:root {
  color-scheme: dark;
  --bg: #070b10;
  --panel: rgb(14 24 33 / 86%);
  --panel-strong: rgb(22 38 52 / 92%);
  --text: #edf7ff;
  --muted: #8fa5b8;
  --line: rgb(100 139 166 / 28%);
  --accent: #4ee7c2;
  --accent-2: #6fb7ff;
  --danger: #ff6b8a;
  --warning: #ffd166;
  --shadow: 0 24px 70px rgb(0 0 0 / 38%);
  --glow: 0 0 28px rgb(78 231 194 / 18%);
  --topbar-bg: rgb(7 11 16 / 72%);
  --control-bg: linear-gradient(180deg, rgb(255 255 255 / 8%), rgb(255 255 255 / 3%));
  --field-bg: rgb(4 10 16 / 66%);
}

/* Component object library */
.component-library-page {
  --object-line: #dfe3e8;
  --object-muted: #5f6368;
  --object-soft: #f8f9fa;
  --object-blue: #1a73e8;
  --object-green: #188038;
  --object-amber: #b06000;
  --object-red: #b3261e;
  background: #f5f7f9;
  color: #202124;
}

.component-library-main {
  width: min(1560px, calc(100% - 32px));
  margin: 0 auto;
  padding: 22px 0 48px;
}

.component-library-head {
  align-items: end;
  margin-bottom: 16px;
}

.component-library-head h1 {
  font-size: 30px;
  line-height: 1.2;
  letter-spacing: 0;
}

.component-object-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--object-line);
  background: #fff;
}

.component-object-metrics article {
  min-width: 0;
  padding: 16px 18px;
  border-right: 1px solid var(--object-line);
}

.component-object-metrics article:last-child {
  border-right: 0;
}

.component-object-metrics span,
.component-object-metrics small {
  display: block;
  color: var(--object-muted);
}

.component-object-metrics strong {
  display: block;
  margin: 4px 0 2px;
  font-size: 25px;
  line-height: 1.15;
  letter-spacing: 0;
}

.component-object-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--object-line);
  background: #fff;
}

.component-object-toolbar form {
  display: grid;
  grid-template-columns: minmax(260px, 1.8fr) minmax(160px, 0.7fr) minmax(180px, 0.8fr) auto auto;
  align-items: end;
  gap: 8px;
  width: min(100%, 1080px);
}

.component-object-toolbar label,
.component-object-form-grid label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #3c4043;
  font-size: 12px;
  font-weight: 600;
}

.component-object-toolbar :is(input, select),
.component-object-form-grid :is(input, select, textarea) {
  width: 100%;
  min-width: 0;
  min-height: 40px;
  border: 1px solid #bdc1c6;
  border-radius: 4px;
  background: #fff;
  color: #202124;
  padding: 8px 10px;
  font: inherit;
  font-weight: 400;
  letter-spacing: 0;
}

.component-object-toolbar :is(input, select):focus,
.component-object-form-grid :is(input, select, textarea):focus {
  border-color: var(--object-blue);
  outline: 2px solid rgb(26 115 232 / 16%);
  outline-offset: 0;
}

.component-object-toolbar > span {
  flex: 0 0 auto;
  padding-bottom: 10px;
  color: var(--object-muted);
  font-size: 13px;
}

.component-library-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(320px, 0.75fr);
  align-items: start;
  gap: 12px;
  margin-top: 12px;
}

.component-object-list,
.component-object-detail {
  border: 1px solid var(--object-line);
  background: #fff;
}

.component-object-list > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 62px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--object-line);
}

.component-object-list > header span,
.component-object-detail > header .component-object-badge {
  color: var(--object-blue);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.component-object-list h2,
.component-object-detail h2,
.component-object-detail h3,
.component-object-dialog h2 {
  margin: 2px 0 0;
  letter-spacing: 0;
}

.component-object-list h2 {
  font-size: 18px;
}

.component-object-table-wrap {
  overflow-x: auto;
}

.component-object-table {
  width: 100%;
  min-width: 820px;
  border-collapse: collapse;
  table-layout: fixed;
}

.component-object-table th {
  padding: 9px 12px;
  border-bottom: 1px solid var(--object-line);
  background: var(--object-soft);
  color: var(--object-muted);
  font-size: 11px;
  font-weight: 700;
  text-align: left;
}

.component-object-table th:first-child { width: 31%; }
.component-object-table th:nth-child(2) { width: 21%; }
.component-object-table th:nth-child(3) { width: 17%; }
.component-object-table th:nth-child(4) { width: 13%; }
.component-object-table th:nth-child(5) { width: 18%; }

.component-object-table td {
  padding: 11px 12px;
  border-bottom: 1px solid #edf0f2;
  vertical-align: middle;
  font-size: 13px;
}

.component-object-table tbody tr {
  cursor: pointer;
}

.component-object-table tbody tr:hover,
.component-object-table tbody tr:focus,
.component-object-table tbody tr.is-selected {
  outline: none;
  background: #f0f6ff;
}

.component-object-table td :is(strong, span, small) {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.component-object-table td strong {
  color: #202124;
}

.component-object-table td span,
.component-object-table td small {
  margin-top: 2px;
  color: var(--object-muted);
}

.component-object-list > footer {
  display: flex;
  justify-content: center;
  padding: 10px;
}

.component-object-empty {
  height: 160px;
  color: var(--object-muted);
  text-align: center;
}

.component-object-badge {
  display: inline-flex !important;
  width: max-content;
  max-width: 100%;
  padding: 3px 7px;
  border-radius: 4px;
  background: #e8f0fe;
  color: #185abc !important;
  font-size: 11px;
  font-weight: 700;
}

.component-object-badge[data-tone="ready"] { background: #e6f4ea; color: var(--object-green) !important; }
.component-object-badge[data-tone="review"] { background: #fef7e0; color: var(--object-amber) !important; }
.component-object-badge[data-tone="candidate"] { background: #fce8e6; color: var(--object-red) !important; }

.component-object-score {
  font-size: 18px;
}

.component-object-score[data-tone="ready"],
.component-object-detail-score[data-tone="ready"] { color: var(--object-green); }
.component-object-score[data-tone="review"],
.component-object-detail-score[data-tone="review"] { color: var(--object-amber); }
.component-object-score[data-tone="candidate"],
.component-object-detail-score[data-tone="candidate"] { color: var(--object-red); }

.component-object-detail {
  position: sticky;
  top: 78px;
  max-height: calc(100vh - 92px);
  overflow-y: auto;
}

.component-object-detail-empty {
  display: grid;
  place-items: center;
  min-height: 300px;
  padding: 28px;
  color: var(--object-muted);
  text-align: center;
}

.component-object-detail-empty span {
  color: var(--object-blue);
  font-size: 32px;
}

.component-object-detail-empty p {
  margin: 5px 0 0;
}

.component-object-detail > header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  border-bottom: 1px solid var(--object-line);
}

.component-object-detail h2 {
  font-size: 19px;
}

.component-object-detail > header p {
  margin: 4px 0 0;
  color: var(--object-muted);
  font-size: 13px;
}

.component-object-detail-score {
  flex: 0 0 auto;
  font-size: 28px;
  line-height: 1;
}

.component-object-detail-score small {
  font-size: 11px;
  font-weight: 500;
}

.component-object-thread {
  background: #fbfcfe;
}

.component-object-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.component-object-section-head > strong {
  color: var(--object-blue);
  font-size: 20px;
  line-height: 1;
}

.component-object-section-head > strong small {
  font-size: 10px;
  font-weight: 500;
}

.component-object-thread-stages,
.component-object-thread-counts {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 10px;
  border: 1px solid var(--object-line);
}

.component-object-thread-stages span,
.component-object-thread-counts span {
  display: grid;
  min-width: 0;
  place-items: center;
  gap: 4px;
  min-height: 46px;
  padding: 6px 3px;
  border-right: 1px solid var(--object-line);
  color: var(--object-muted);
  font-size: 10px;
  text-align: center;
}

.component-object-thread-stages span:last-child,
.component-object-thread-counts span:last-child {
  border-right: 0;
}

.component-object-thread-stages b {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #bdc1c6;
}

.component-object-thread-stages span.is-connected {
  color: var(--object-green);
  font-weight: 700;
}

.component-object-thread-stages span.is-connected b {
  background: var(--object-green);
}

.component-object-thread-counts {
  margin-top: 6px;
  border-top: 0;
}

.component-object-thread-counts span {
  min-height: 42px;
}

.component-object-thread-counts strong {
  color: #202124;
  font-size: 14px;
}

.component-object-thread-gaps,
.component-object-thread-state,
.component-object-thread-total {
  display: block;
  margin: 9px 0 0;
  color: var(--object-muted);
  font-size: 11px;
}

.component-object-thread-gaps strong {
  color: var(--object-amber);
}

.component-object-thread-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 10px;
}

.component-object-thread-actions .button {
  min-width: 0;
  min-height: 34px;
  padding: 7px 8px;
  font-size: 11px;
}

.component-object-thread-records {
  display: grid;
  margin-top: 10px;
  border-top: 1px solid var(--object-line);
}

.component-object-thread-records :is(a, div) {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 2px 8px;
  min-width: 0;
  padding: 8px 0;
  border-bottom: 1px solid var(--object-line);
  color: inherit;
  text-decoration: none;
}

.component-object-thread-records a:hover strong {
  color: var(--object-blue);
}

.component-object-thread-records span {
  grid-row: 1 / span 2;
  align-self: center;
  color: var(--object-blue);
  font-size: 10px;
  font-weight: 700;
}

.component-object-thread-records strong,
.component-object-thread-records small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.component-object-thread-records strong {
  font-size: 12px;
}

.component-object-thread-records small {
  color: var(--object-muted);
  font-size: 10px;
}

.component-object-thread-records > p {
  margin: 10px 0 0;
  color: var(--object-muted);
  font-size: 11px;
}

.component-object-detail > section,
.component-object-facts {
  margin: 0;
  padding: 14px 16px;
  border-bottom: 1px solid var(--object-line);
}

.component-object-detail h3 {
  margin: 0 0 10px;
  font-size: 13px;
}

.component-object-facts,
.component-object-parameters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
}

.component-object-facts div,
.component-object-parameters div {
  min-width: 0;
}

.component-object-facts dt,
.component-object-parameters dt {
  color: var(--object-muted);
  font-size: 11px;
}

.component-object-facts dd,
.component-object-parameters dd {
  overflow-wrap: anywhere;
  margin: 2px 0 0;
  font-size: 12px;
  font-weight: 600;
}

.component-object-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.component-object-checks span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 7px;
  border: 1px solid #f4c7c3;
  border-radius: 4px;
  color: var(--object-red);
  font-size: 11px;
}

.component-object-checks span.is-passed {
  border-color: #b7dfc2;
  color: var(--object-green);
}

.component-object-missing {
  margin: 10px 0 0;
  color: var(--object-amber);
  font-size: 12px;
}

.component-object-evidence,
.component-object-assets {
  display: grid;
  gap: 6px;
}

.component-object-evidence :is(a, div),
.component-object-assets span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--object-line);
  border-radius: 4px;
  color: inherit;
  text-decoration: none;
}

.component-object-evidence a:hover {
  border-color: var(--object-blue);
}

.component-object-evidence span,
.component-object-assets small,
.component-object-evidence p,
.component-object-assets p {
  overflow-wrap: anywhere;
  margin: 0;
  color: var(--object-muted);
  font-size: 11px;
}

.component-object-dialog {
  width: min(780px, calc(100% - 24px));
  max-height: calc(100vh - 32px);
  padding: 0;
  border: 0;
  border-radius: 6px;
  box-shadow: 0 18px 55px rgb(60 64 67 / 30%);
}

.component-object-dialog::backdrop {
  background: rgb(32 33 36 / 42%);
}

.component-object-dialog > form > header,
.component-object-dialog > form > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--object-line);
}

.component-object-dialog > form > footer {
  justify-content: flex-end;
  border-top: 1px solid var(--object-line);
  border-bottom: 0;
}

.component-object-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  max-height: calc(100vh - 210px);
  overflow-y: auto;
  padding: 18px;
}

.component-object-wide {
  grid-column: 1 / -1;
}

.component-object-form-grid textarea {
  resize: vertical;
}

#componentObjectFormMessage {
  min-height: 20px;
  margin: 0;
  padding: 0 18px;
  color: var(--object-amber);
  font-size: 12px;
}

@media (max-width: 1080px) {
  .component-object-toolbar form {
    grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(150px, 0.6fr));
  }

  .component-object-toolbar form .button {
    grid-row: 2;
  }

  .component-library-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .component-object-detail {
    position: static;
    max-height: none;
  }
}

@media (max-width: 720px) {
  .component-library-main {
    width: min(100% - 20px, 1560px);
    padding-top: 14px;
  }

  .component-object-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .component-object-metrics article:nth-child(2) {
    border-right: 0;
  }

  .component-object-metrics article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--object-line);
  }

  .component-object-toolbar {
    display: block;
  }

  .component-object-toolbar form,
  .component-object-form-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .component-object-toolbar form .button {
    grid-row: auto;
  }

  .component-object-toolbar > span {
    display: block;
    padding: 10px 0 0;
  }

  .component-object-wide {
    grid-column: auto;
  }

  .component-object-facts,
  .component-object-parameters {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Engineering decision workbench */
body.engineering-decision-page {
  --decision-bg: #111315;
  --decision-surface: #17191c;
  --decision-subtle: #202327;
  --decision-text: #f1f3f4;
  --decision-muted: #9aa0a6;
  --decision-line: #34383d;
  --decision-blue: #8ab4f8;
  --decision-blue-strong: #1a73e8;
  --decision-green: #81c995;
  --decision-amber: #fdd663;
  --decision-red: #f28b82;
  min-width: 320px;
  background: var(--decision-bg);
  color: var(--decision-text);
}

body.engineering-decision-page.light {
  --decision-bg: #ffffff;
  --decision-surface: #ffffff;
  --decision-subtle: #f8f9fa;
  --decision-text: #202124;
  --decision-muted: #5f6368;
  --decision-line: #dadce0;
  --decision-blue: #1967d2;
  --decision-blue-strong: #1a73e8;
  --decision-green: #137333;
  --decision-amber: #b06000;
  --decision-red: #b3261e;
}

.decision-app {
  width: min(1480px, 100%);
  margin: 0 auto;
  padding: 28px 32px 56px;
}

.decision-page-head,
.decision-page-head > div,
.decision-head-actions,
.decision-source-band,
.decision-source-coverage,
.decision-result-head,
.decision-object-summary > header,
.decision-object-actions,
.decision-execution > header,
.decision-execution-actions,
.decision-execution-footer,
.decision-review-dialog header,
.decision-review-dialog footer {
  display: flex;
  align-items: center;
}

.decision-page-head {
  justify-content: space-between;
  gap: 28px;
  padding: 8px 0 24px;
}

.decision-page-head > div:first-child {
  display: block;
  min-width: 0;
}

.decision-page-head .eyebrow,
.decision-requirement-pane header > span,
.decision-result-head > div > span,
.decision-execution > header > div > span,
.decision-source-band > div:first-child > span,
.decision-review-dialog header span {
  display: block;
  margin: 0 0 5px;
  color: var(--decision-blue);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.decision-page-head h1 {
  margin: 0;
  color: var(--decision-text);
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.18;
  letter-spacing: 0;
}

.decision-page-head p:last-child {
  max-width: 720px;
  margin: 8px 0 0;
  color: var(--decision-muted);
  font-size: 15px;
}

.decision-head-actions {
  flex: 0 0 auto;
  gap: 10px;
}

.decision-history-select {
  display: grid;
  gap: 4px;
}

.decision-history-select span {
  color: var(--decision-muted);
  font-size: 11px;
  font-weight: 600;
}

.decision-history-select select {
  width: min(280px, 32vw);
  min-height: 38px;
  border: 1px solid var(--decision-line);
  border-radius: 6px;
  background: var(--decision-surface);
  color: var(--decision-text);
  padding: 0 34px 0 10px;
}

.decision-save-state {
  min-width: 72px;
  color: var(--decision-muted);
  font-size: 12px;
  text-align: right;
}

.decision-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border: 1px solid var(--decision-line);
  border-radius: 8px 8px 0 0;
  list-style: none;
  overflow: hidden;
}

.decision-flow li {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 62px;
  padding: 10px 16px;
  border-right: 1px solid var(--decision-line);
  background: var(--decision-surface);
}

.decision-flow li:last-child { border-right: 0; }
.decision-flow li.is-active { background: color-mix(in srgb, var(--decision-blue-strong) 8%, var(--decision-surface)); }
.decision-flow li.is-done { background: color-mix(in srgb, var(--decision-green) 7%, var(--decision-surface)); }
.decision-flow li.is-review { background: color-mix(in srgb, var(--decision-amber) 8%, var(--decision-surface)); }

.decision-flow b {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  border: 1px solid var(--decision-line);
  border-radius: 50%;
  color: var(--decision-muted);
  font-size: 12px;
}

.decision-flow .is-active b { border-color: var(--decision-blue); background: var(--decision-blue-strong); color: #fff; }
.decision-flow .is-done b { border-color: var(--decision-green); background: var(--decision-green); color: #fff; }
.decision-flow .is-review b { border-color: var(--decision-amber); color: var(--decision-amber); }
.decision-flow span { display: grid; min-width: 0; gap: 2px; }
.decision-flow strong { color: var(--decision-text); font-size: 13px; }
.decision-flow small { overflow: hidden; color: var(--decision-muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }

.decision-source-band {
  min-height: 54px;
  justify-content: space-between;
  gap: 20px;
  padding: 9px 16px;
  border: 1px solid var(--decision-line);
  border-top: 0;
  background: var(--decision-subtle);
}

.decision-source-band > div:first-child { flex: 0 0 auto; }
.decision-source-band > div:first-child > span { margin: 0; font-size: 9px; }
.decision-source-band > div:first-child > strong { display: block; font-size: 12px; }
.decision-source-coverage { justify-content: flex-end; flex-wrap: wrap; gap: 6px; }

.decision-source-coverage > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 26px;
  padding: 3px 8px;
  border: 1px solid var(--decision-line);
  border-radius: 5px;
  background: var(--decision-surface);
  color: var(--decision-muted);
  font-size: 11px;
}

.decision-source-coverage i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--decision-green);
}

.decision-source-coverage .is-pending i { background: var(--decision-amber); }
.decision-source-coverage b { color: var(--decision-text); font-size: 11px; }

.decision-workspace {
  display: grid;
  grid-template-columns: minmax(320px, 390px) minmax(0, 1fr);
  min-height: 590px;
  border: 1px solid var(--decision-line);
  border-top: 0;
  background: var(--decision-surface);
}

.decision-requirement-pane {
  min-width: 0;
  padding: 24px;
  border-right: 1px solid var(--decision-line);
  background: var(--decision-subtle);
}

.decision-requirement-pane h2,
.decision-result-head h2,
.decision-execution h2,
.decision-review-dialog h2 {
  margin: 0;
  color: var(--decision-text);
  font-size: 19px;
  line-height: 1.3;
  letter-spacing: 0;
}

.decision-requirement-pane header p,
.decision-execution header p,
.decision-review-dialog > form > p {
  margin: 7px 0 0;
  color: var(--decision-muted);
  font-size: 12px;
  line-height: 1.55;
}

.decision-requirement-pane form {
  display: grid;
  gap: 16px;
  margin-top: 22px;
}

.decision-requirement-pane label,
.decision-review-dialog label {
  display: grid;
  min-width: 0;
  gap: 6px;
  color: var(--decision-text);
  font-size: 12px;
  font-weight: 600;
}

.decision-requirement-pane :is(input, select, textarea),
.decision-review-dialog textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--decision-line);
  border-radius: 6px;
  outline: 0;
  background: var(--decision-surface);
  color: var(--decision-text);
  font: inherit;
  font-size: 13px;
}

.decision-requirement-pane :is(input, select) { min-height: 40px; padding: 0 10px; }
.decision-requirement-pane textarea,
.decision-review-dialog textarea { resize: vertical; padding: 10px 11px; line-height: 1.55; }
.decision-requirement-pane :is(input, select, textarea):focus,
.decision-review-dialog textarea:focus { border-color: var(--decision-blue); box-shadow: 0 0 0 2px color-mix(in srgb, var(--decision-blue) 18%, transparent); }

.decision-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.decision-wide-field { grid-column: 1 / -1; }
.decision-advanced { border-top: 1px solid var(--decision-line); }
.decision-advanced summary { padding: 13px 0; color: var(--decision-blue); cursor: pointer; font-size: 12px; font-weight: 600; }
.decision-advanced[open] summary { margin-bottom: 2px; }
.decision-run-button { width: 100%; min-height: 42px; justify-content: center; }
.decision-form-message { min-height: 18px; margin: -8px 0 0; color: var(--decision-muted); font-size: 12px; line-height: 1.45; }
.decision-form-message[data-tone="danger"] { color: var(--decision-red); }
.decision-form-message[data-tone="warning"] { color: var(--decision-amber); }
.decision-form-message[data-tone="success"] { color: var(--decision-green); }

.decision-result-pane { min-width: 0; padding: 24px 28px; }
.decision-result-head { justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--decision-line); }
.decision-status,
.decision-line-state {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 27px;
  padding: 3px 9px;
  border: 1px solid var(--decision-line);
  border-radius: 999px;
  color: var(--decision-muted);
  font-size: 11px;
  font-weight: 700;
}

.decision-status[data-state="review-required"], .decision-line-state.is-review { border-color: color-mix(in srgb, var(--decision-amber) 55%, var(--decision-line)); color: var(--decision-amber); }
.decision-status[data-state="approved"], .decision-status[data-state="submitted"], .decision-line-state.is-approved { border-color: color-mix(in srgb, var(--decision-green) 55%, var(--decision-line)); color: var(--decision-green); }

.decision-empty {
  display: grid;
  min-height: 420px;
  place-content: center;
  justify-items: center;
  padding: 42px;
  color: var(--decision-muted);
  text-align: center;
}

.decision-empty > span { display: grid; width: 52px; height: 52px; margin-bottom: 16px; place-items: center; border: 1px solid var(--decision-line); border-radius: 50%; font-size: 24px; }
.decision-empty strong { color: var(--decision-text); font-size: 16px; }
.decision-empty p { max-width: 520px; margin: 8px 0 0; font-size: 13px; line-height: 1.6; }

.decision-object-summary { padding: 22px 0 20px; border-bottom: 1px solid var(--decision-line); }
.decision-object-summary > header { align-items: flex-start; justify-content: space-between; gap: 20px; }
.decision-object-summary > header > div { min-width: 0; }
.decision-object-summary > header span { color: var(--decision-blue); font-size: 11px; font-weight: 700; }
.decision-object-summary h3 { margin: 5px 0 3px; color: var(--decision-text); font-size: 22px; line-height: 1.25; }
.decision-object-summary header p { margin: 0; color: var(--decision-muted); font-size: 12px; overflow-wrap: anywhere; }
.decision-object-summary > header > strong { display: grid; width: 50px; height: 50px; flex: 0 0 50px; place-items: center; border: 2px solid var(--decision-blue); border-radius: 50%; color: var(--decision-blue); font-size: 16px; }
.decision-object-summary dl,
.decision-provenance { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 20px 0 0; border: 1px solid var(--decision-line); }
.decision-object-summary dl > div,
.decision-provenance > div { min-width: 0; padding: 11px 12px; border-right: 1px solid var(--decision-line); border-bottom: 1px solid var(--decision-line); }
.decision-object-summary dl > div:nth-child(4n),
.decision-provenance > div:nth-child(4n) { border-right: 0; }
.decision-object-summary dl > div:nth-last-child(-n + 4),
.decision-provenance > div:nth-last-child(-n + 4) { border-bottom: 0; }
.decision-object-summary dt,
.decision-provenance dt { color: var(--decision-muted); font-size: 10px; }
.decision-object-summary dd,
.decision-provenance dd { margin: 4px 0 0; overflow: hidden; color: var(--decision-text); font-size: 12px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.decision-object-actions { justify-content: flex-end; gap: 8px; margin-top: 14px; }

.decision-result-tabs { display: flex; gap: 22px; min-height: 48px; border-bottom: 1px solid var(--decision-line); }
.decision-result-tabs button { position: relative; border: 0; background: transparent; color: var(--decision-muted); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.decision-result-tabs button.is-active { color: var(--decision-blue); }
.decision-result-tabs button.is-active::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--decision-blue); content: ""; }
.decision-tab-panel { padding: 16px 0; }
.decision-rule-list,
.decision-alternative-list { display: grid; gap: 8px; }
.decision-rule-list article,
.decision-alternative-list article { display: flex; align-items: center; gap: 11px; min-height: 52px; padding: 9px 12px; border: 1px solid var(--decision-line); border-radius: 6px; }
.decision-rule-list i { display: grid; width: 24px; height: 24px; flex: 0 0 24px; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--decision-green) 13%, transparent); color: var(--decision-green); font-style: normal; font-weight: 700; }
.decision-rule-list .is-warning i { background: color-mix(in srgb, var(--decision-amber) 13%, transparent); color: var(--decision-amber); }
.decision-rule-list div,
.decision-alternative-list div { display: grid; min-width: 0; gap: 3px; }
.decision-rule-list strong,
.decision-alternative-list strong { color: var(--decision-text); font-size: 12px; }
.decision-rule-list span,
.decision-alternative-list span { color: var(--decision-muted); font-size: 11px; line-height: 1.45; }
.decision-alternative-list article { justify-content: space-between; }
.decision-alternative-list a { flex: 0 0 auto; color: var(--decision-blue); font-size: 12px; font-weight: 600; text-decoration: none; }
.decision-list-empty { padding: 36px 0; color: var(--decision-muted); font-size: 12px; text-align: center; }
.decision-provenance { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 0; }
.decision-provenance > div:nth-child(4n) { border-right: 1px solid var(--decision-line); }
.decision-provenance > div:nth-child(3n) { border-right: 0; }
.decision-provenance > div:nth-last-child(-n + 4) { border-bottom: 1px solid var(--decision-line); }
.decision-provenance > div:nth-last-child(-n + 3) { border-bottom: 0; }

.decision-execution { margin-top: 22px; border: 1px solid var(--decision-line); background: var(--decision-surface); }
.decision-execution > header { align-items: flex-start; justify-content: space-between; gap: 24px; padding: 20px 22px; border-bottom: 1px solid var(--decision-line); }
.decision-execution-actions { flex: 0 0 auto; gap: 8px; }
.decision-bom-wrap { overflow-x: auto; }
.decision-bom-table { width: 100%; min-width: 760px; border-collapse: collapse; }
.decision-bom-table th,
.decision-bom-table td { padding: 11px 14px; border-bottom: 1px solid var(--decision-line); color: var(--decision-text); font-size: 12px; text-align: left; vertical-align: middle; }
.decision-bom-table th { background: var(--decision-subtle); color: var(--decision-muted); font-size: 10px; text-transform: uppercase; }
.decision-bom-table td strong,
.decision-bom-table td small { display: block; }
.decision-bom-table td small { margin-top: 2px; color: var(--decision-muted); font-size: 10px; }
.decision-table-empty { height: 88px; color: var(--decision-muted) !important; text-align: center !important; }
.decision-execution-footer { justify-content: space-between; min-height: 54px; padding: 10px 18px; }
.decision-execution-footer span { color: var(--decision-muted); font-size: 12px; }
.decision-execution-footer strong { font-size: 16px; }

.decision-review-dialog { width: min(560px, calc(100vw - 32px)); padding: 0; border: 1px solid var(--decision-line); border-radius: 8px; background: var(--decision-surface); color: var(--decision-text); box-shadow: 0 18px 52px rgb(0 0 0 / 24%); }
.decision-review-dialog::backdrop { background: rgb(32 33 36 / 42%); }
.decision-review-dialog form { display: grid; gap: 18px; padding: 22px; }
.decision-review-dialog header { justify-content: space-between; gap: 16px; }
.decision-review-dialog fieldset { display: grid; gap: 11px; margin: 0; padding: 14px; border: 1px solid var(--decision-line); border-radius: 6px; }
.decision-review-dialog legend { padding: 0 5px; color: var(--decision-muted); font-size: 11px; }
.decision-review-dialog fieldset label { display: flex; align-items: flex-start; gap: 9px; font-weight: 500; line-height: 1.45; }
.decision-review-dialog input { margin-top: 2px; accent-color: var(--decision-blue-strong); }
.decision-review-dialog #reviewMessage { min-height: 18px; margin: -8px 0 0; color: var(--decision-red); font-size: 12px; }
.decision-review-dialog footer { justify-content: flex-end; gap: 8px; }

.decision-toast { position: fixed; right: 24px; bottom: 24px; z-index: 80; max-width: min(420px, calc(100vw - 32px)); padding: 12px 16px; border-radius: 6px; background: #202124; color: #fff; box-shadow: 0 8px 24px rgb(0 0 0 / 22%); font-size: 13px; }
.decision-toast[data-tone="danger"] { background: #b3261e; }

@media (max-width: 980px) {
  .decision-app { padding: 20px 18px 42px; }
  .decision-page-head { align-items: flex-start; flex-direction: column; }
  .decision-head-actions { width: 100%; }
  .decision-history-select { flex: 1; }
  .decision-history-select select { width: 100%; }
  .decision-workspace { grid-template-columns: 1fr; }
  .decision-requirement-pane { border-right: 0; border-bottom: 1px solid var(--decision-line); }
  .decision-workspace { min-height: 0; }
}

@media (max-width: 720px) {
  .decision-app { padding: 16px 12px 36px; }
  .decision-page-head h1 { font-size: 28px; }
  .decision-head-actions { align-items: flex-end; flex-wrap: wrap; }
  .decision-save-state { display: none; }
  .decision-flow { grid-template-columns: repeat(5, minmax(96px, 1fr)); overflow-x: auto; }
  .decision-flow li { min-height: 56px; padding: 8px 10px; }
  .decision-flow small { display: none; }
  .decision-source-band { align-items: flex-start; flex-direction: column; }
  .decision-source-coverage { justify-content: flex-start; }
  .decision-requirement-pane,
  .decision-result-pane { padding: 20px 16px; }
  .decision-field-grid { grid-template-columns: 1fr; }
  .decision-wide-field { grid-column: auto; }
  .decision-object-summary dl,
  .decision-provenance { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .decision-object-summary dl > div:nth-child(4n),
  .decision-provenance > div:nth-child(3n),
  .decision-provenance > div:nth-child(4n) { border-right: 1px solid var(--decision-line); }
  .decision-object-summary dl > div:nth-child(2n),
  .decision-provenance > div:nth-child(2n) { border-right: 0; }
  .decision-object-summary dl > div:nth-last-child(-n + 4),
  .decision-provenance > div:nth-last-child(-n + 3) { border-bottom: 1px solid var(--decision-line); }
  .decision-object-summary dl > div:nth-last-child(-n + 2),
  .decision-provenance > div:nth-last-child(-n + 2) { border-bottom: 0; }
  .decision-object-actions { align-items: stretch; flex-direction: column; }
  .decision-object-actions .button { justify-content: center; }
  .decision-result-tabs { gap: 12px; overflow-x: auto; }
  .decision-result-tabs button { flex: 0 0 auto; min-height: 46px; }
  .decision-execution > header { flex-direction: column; }
  .decision-execution-actions { width: 100%; }
  .decision-execution-actions .button { flex: 1; justify-content: center; }
  .decision-toast { right: 16px; bottom: 16px; left: 16px; }
}

/* Task-driven engineering workspace */
.engineering-integrated-page .engx-root-navigation {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 180px));
  justify-content: start;
  background: #f7f8fa;
}

.engineering-integrated-page .engx-root-navigation button {
  justify-content: center;
  font-size: 0.76rem;
}

.engineering-integrated-page .engx-lifecycle-metrics {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.engx-root-sidebar {
  border-bottom: 1px solid var(--engx-line);
}

.engx-work-focus-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(220px, 0.6fr);
  gap: 12px;
  padding: 0 12px 12px;
}

.engx-work-focus-grid .engx-focus-panel {
  min-height: 0;
}

.engx-work-ai-entry {
  display: grid;
  align-content: center;
  gap: 7px;
  border: 1px solid var(--engx-line);
  border-left: 3px solid #d7a719;
  padding: 16px;
  background: #fbfcfd;
}

.engx-work-ai-entry > span,
.engx-work-timeline header span {
  color: var(--engx-muted);
  font-size: 0.62rem;
  font-weight: 800;
}

.engx-work-ai-entry h3,
.engx-work-timeline h3 {
  margin: 0;
  color: var(--engx-text);
  font-size: 0.86rem;
}

.engx-work-ai-entry p {
  margin: 0;
  color: var(--engx-muted);
  font-size: 0.7rem;
  line-height: 1.6;
}

.engx-work-ai-entry .button {
  width: max-content;
  margin-top: 4px;
}

.engx-assistant-view {
  padding-bottom: 16px;
  background: #f7f8fa;
}

.engx-ai-office-primary {
  margin: 12px;
}

.engx-ai-office-primary .engx-ai-conversation {
  min-height: 390px;
  max-height: 520px;
}

.engx-project-tabs {
  display: flex;
  min-height: 42px;
  overflow-x: auto;
  border-bottom: 1px solid var(--engx-line);
  background: #f7f8fa;
}

.engx-project-tabs[hidden] {
  display: none;
}

.engx-project-tabs button {
  min-width: max-content;
  min-height: 42px;
  border: 0;
  border-right: 1px solid var(--engx-line);
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0 13px;
  background: transparent;
  color: var(--engx-muted);
  font-size: 0.68rem;
  font-weight: 750;
  box-shadow: none;
}

.engx-project-tabs button:hover,
.engx-project-tabs button.is-active {
  border-bottom-color: var(--engx-blue);
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-ai-action-review {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(240px, 0.75fr);
  border-top: 1px solid var(--engx-line);
}

.engx-ai-action-review > section {
  min-width: 0;
  padding: 14px;
}

.engx-ai-action-review > section + section {
  border-left: 1px solid var(--engx-line);
}

.engx-ai-action-review h4 {
  margin: 0 0 9px;
  color: var(--engx-text);
  font-size: 0.72rem;
}

.engx-ai-action-review label {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 54px;
  border-top: 1px solid var(--engx-line);
  padding: 8px 2px;
  cursor: pointer;
}

.engx-ai-action-review label.is-confirmed {
  opacity: 0.7;
  cursor: default;
}

.engx-ai-action-review label input {
  width: 15px;
  height: 15px;
}

.engx-ai-action-review label span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.engx-ai-action-review label strong,
.engx-ai-action-review article strong {
  color: var(--engx-text);
  font-size: 0.7rem;
}

.engx-ai-action-review label small,
.engx-ai-action-review article small,
.engx-ai-action-review li,
.engx-ai-action-review > section > p {
  color: var(--engx-muted);
  font-size: 0.62rem;
  line-height: 1.5;
}

.engx-ai-action-review label > b {
  color: #9d6d00;
  font-size: 0.58rem;
  white-space: nowrap;
}

.engx-ai-action-review label.is-confirmed > b {
  color: var(--engx-green);
}

.engx-ai-action-review article {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 7px;
  border-top: 1px solid var(--engx-line);
  padding: 8px 0;
}

.engx-ai-action-review article span {
  display: grid;
  gap: 3px;
}

.engx-ai-confirmed {
  align-self: center;
  color: var(--engx-green);
  font-size: 0.64rem;
  font-weight: 750;
}

.engx-work-timeline {
  margin: 0 12px 12px;
  border: 1px solid var(--engx-line);
  background: var(--engx-surface);
}

.engx-work-timeline > header {
  display: flex;
  min-height: 50px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--engx-line);
  padding: 9px 12px;
}

.engx-work-timeline > header > div {
  display: grid;
  gap: 2px;
}

.engx-work-timeline > header button {
  border: 0;
  background: transparent;
  color: var(--engx-blue);
  font-size: 0.64rem;
  font-weight: 750;
  box-shadow: none;
}

.engx-work-timeline > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 4px 12px 10px;
}

.engx-work-timeline article {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  gap: 7px;
  min-width: 0;
  border-bottom: 1px solid var(--engx-line);
  padding: 9px 4px;
}

.engx-work-timeline article > i {
  width: 7px;
  height: 7px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--engx-blue);
}

.engx-work-timeline article p {
  margin: 0;
  color: var(--engx-text);
  font-size: 0.66rem;
  line-height: 1.45;
}

.engx-work-timeline article time {
  color: var(--engx-muted);
  font-size: 0.58rem;
}

@media (max-width: 1080px) {
  .engineering-integrated-page .engx-lifecycle-metrics {
    grid-template-columns: repeat(5, 150px);
  }

  .engx-work-focus-grid,
  .engx-ai-action-review {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-ai-action-review > section + section {
    border-top: 1px solid var(--engx-line);
    border-left: 0;
  }
}

@media (max-width: 680px) {
  .engineering-integrated-page .engx-root-navigation {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
    overflow-x: auto;
  }

  .engx-work-focus-grid {
    padding-inline: 8px;
  }

  .engx-ai-office-primary,
  .engx-work-timeline {
    margin-inline: 8px;
  }

  .engx-work-timeline > div {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-ai-action-review label {
    grid-template-columns: 18px minmax(0, 1fr);
  }

  .engx-ai-action-review label > b {
    grid-column: 2;
  }
}

/* Enterprise account and MISUMI-style organization permissions */
.account-management-page {
  background: #f3f4f6;
  color: #20242b;
}

.account-management-page [hidden] {
  display: none !important;
}

.account-management-page .brand > span:last-child {
  display: grid;
  gap: 1px;
}

.platform-industrial-utility [hidden] {
  display: none !important;
}

.account-shell {
  width: calc(100% - 32px);
  max-width: 1040px;
  margin: 28px auto 48px;
  background: #fff;
  border: 1px solid #cfd3d8;
}

.account-page-head,
.account-team-head,
.account-permission-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.account-page-head {
  min-height: 78px;
  padding: 14px 22px;
  border-bottom: 3px solid #f2c94c;
  background: #fff;
}

.account-page-head span,
.account-panel-title > span,
.account-team-head > div > span,
.account-permission-section header span,
.account-permission-dialog header span {
  display: block;
  color: #68717c;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
}

.account-page-head h1,
.account-panel-title h2,
.account-team-head h2,
.account-permission-section h2,
.account-permission-dialog h2 {
  margin: 3px 0 0;
  color: #20242b;
  font-size: 20px;
  line-height: 1.25;
  letter-spacing: 0;
}

.account-head-meta {
  color: #505964;
  font-size: 13px;
  text-align: right;
}

.account-auth-workspace {
  min-height: 0;
}

.account-auth-tabs,
.account-section-tabs {
  background: #f4f5f6;
}

.account-auth-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 0;
  border-bottom: 1px solid #d7dadd;
}

.account-auth-tabs button,
.account-section-tabs button {
  border: 0;
  border-radius: 0;
  color: #3f4650;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.account-auth-tabs button {
  display: grid;
  width: 100%;
  min-height: 66px;
  padding: 12px 20px 10px;
  border-bottom: 3px solid transparent;
  background: transparent;
  text-align: center;
}

.account-auth-tabs button.active {
  border-bottom-color: #244696;
  background: #fff;
  color: #244696;
}

.account-auth-tabs button strong,
.account-auth-tabs button span {
  display: block;
}

.account-auth-tabs button span {
  margin-top: 3px;
  color: #737b84;
  font-size: 11px;
  font-weight: 500;
}

.account-auth-stage {
  min-width: 0;
}

.account-auth-panel,
.account-view {
  min-width: 0;
  padding: 28px 34px 36px;
}

.account-auth-panel {
  max-width: none;
}

.account-auth-panel[data-auth-panel="login"] {
  display: grid;
  grid-template-columns: minmax(0, 440px) minmax(250px, 1fr);
  column-gap: 56px;
}

.account-auth-panel[data-auth-panel="login"] .account-panel-title,
.account-auth-panel[data-auth-panel="login"] .account-login-form {
  grid-column: 1;
}

.account-auth-panel[data-auth-panel="login"] .account-login-register {
  grid-column: 2;
  grid-row: 1 / span 3;
}

.account-panel-title {
  padding-bottom: 14px;
  border-bottom: 1px solid #cfd3d8;
}

.account-panel-title p {
  margin: 7px 0 0;
  color: #68717c;
  font-size: 12px;
}

.account-form {
  display: grid;
  grid-template-columns: minmax(0, 420px);
  gap: 14px;
  padding-top: 20px;
}

.account-register-form,
.account-profile-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-register-mode,
.account-form-message,
.account-register-form > .button,
.account-consent {
  grid-column: 1 / -1;
}

.account-register-mode {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid #bfc5cc;
}

.account-register-mode button {
  display: grid;
  min-height: 58px;
  align-content: center;
  padding: 8px 16px;
  border: 0;
  border-right: 1px solid #bfc5cc;
  border-radius: 0;
  background: #fff;
  color: #3f4650;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}

.account-register-mode button strong,
.account-register-mode button span {
  display: block;
}

.account-register-mode button span {
  margin-top: 3px;
  color: #747c85;
  font-size: 11px;
}

.account-register-mode button:last-child {
  border-right: 0;
}

.account-register-mode button.active {
  background: #244696;
  color: #fff;
}

.account-register-mode button.active span {
  color: #dce5ff;
}

.account-company-fields {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-company-fields > label {
  max-width: 420px;
}

.account-form-section-title {
  display: flex;
  grid-column: 1 / -1;
  align-items: baseline;
  gap: 10px;
  margin-top: 4px;
  padding-bottom: 8px;
  border-bottom: 1px solid #d8dce0;
  color: #303741;
  font-size: 13px;
}

.account-form-section-title span {
  color: #747c85;
  font-size: 11px;
}

.account-form-grid {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.account-form label,
.account-access-state label {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: #424a54;
  font-size: 12px;
  font-weight: 700;
}

.account-form input,
.account-form select,
.account-access-state select {
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid #bfc5cc;
  border-radius: 0;
  background: #fff;
  color: #20242b;
  font: inherit;
  font-size: 14px;
}

.account-form input:focus,
.account-form select:focus,
.account-access-state select:focus {
  border-color: #244696;
  outline: 2px solid rgba(36, 70, 150, 0.14);
  outline-offset: 0;
}

.account-form input:disabled {
  background: #f2f3f4;
  color: #6d747d;
}

.account-password-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 54px;
  border: 1px solid #bfc5cc;
  background: #fff;
}

.account-password-field input {
  border: 0;
}

.account-password-field button {
  border: 0;
  border-left: 1px solid #d4d8dc;
  border-radius: 0;
  background: #f5f6f7;
  color: #244696;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}

.account-login-register {
  align-self: stretch;
  display: grid;
  gap: 10px;
  align-content: center;
  padding: 26px;
  border-left: 1px solid #d8dce0;
  background: #f6f7f8;
}

.account-login-register > strong {
  margin-bottom: 5px;
  color: #303741;
  font-size: 14px;
}

.account-login-register button {
  min-height: 42px;
  border: 1px solid #244696;
  border-radius: 0;
  background: #fff;
  color: #244696;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.account-consent {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 8px !important;
  font-weight: 500 !important;
}

.account-consent input {
  width: 16px;
  min-height: 16px;
}

.account-form .button {
  justify-self: start;
  min-width: 150px;
}

.account-form-message {
  min-height: 18px;
  margin: 0;
  color: #b42318;
  font-size: 12px;
}

.account-form-message.is-success {
  color: #167344;
}

.account-section-tabs {
  display: flex;
  min-height: 47px;
  padding: 0 18px;
  border-bottom: 1px solid #cfd3d8;
  overflow-x: auto;
}

.account-section-tabs button {
  flex: 0 0 auto;
  padding: 0 18px;
  border-bottom: 3px solid transparent;
  background: transparent;
}

.account-section-tabs button.active {
  border-bottom-color: #244696;
  background: #fff;
  color: #244696;
}

.account-section-tabs button span:not(:empty) {
  display: inline-grid;
  min-width: 18px;
  height: 18px;
  margin-left: 4px;
  place-items: center;
  border-radius: 9px;
  background: #c7352d;
  color: #fff;
  font-size: 10px;
}

.account-access-notice {
  margin: 16px 34px 0;
  padding: 11px 13px;
  border-left: 3px solid #b42318;
  background: #fff1f0;
  color: #8f1f17;
  font-size: 12px;
}

.account-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid #cfd3d8;
}

.account-summary-grid > div {
  display: grid;
  min-width: 0;
  min-height: 112px;
  padding: 18px;
  align-content: center;
  border-right: 1px solid #cfd3d8;
}

.account-summary-grid > div:last-child {
  border-right: 0;
}

.account-summary-grid span {
  color: #69727d;
  font-size: 12px;
}

.account-summary-grid strong {
  margin-top: 8px;
  overflow-wrap: anywhere;
  color: #20242b;
  font-size: 17px;
}

.account-summary-grid small {
  margin-top: 4px;
  overflow-wrap: anywhere;
  color: #69727d;
  font-size: 12px;
}

.account-permission-section {
  margin-top: 24px;
  border-top: 3px solid #244696;
}

.account-return-target {
  grid-column: 1;
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid #cfd8ec;
  border-left: 4px solid #244696;
  margin-top: 16px;
  padding: 10px 12px;
  background: #f6f8fd;
}

.account-return-target span {
  color: #68717c;
  font-size: 11px;
}

.account-return-target strong {
  color: #244696;
  font-size: 13px;
}

.account-work-launcher {
  margin-top: 24px;
  border-top: 3px solid #c7352d;
}

.account-work-launcher > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid #cfd3d8;
  padding: 14px 2px 12px;
}

.account-work-launcher header span,
.account-work-launcher header small {
  color: #68717c;
  font-size: 11px;
  font-weight: 700;
}

.account-work-launcher h2 {
  margin: 3px 0 0;
  color: #20242b;
  font-size: 20px;
  letter-spacing: 0;
}

.account-work-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-left: 1px solid #d8dce0;
}

.account-work-links a {
  display: grid;
  min-height: 86px;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border-right: 1px solid #d8dce0;
  border-bottom: 1px solid #d8dce0;
  padding: 14px;
  color: #20242b;
  text-decoration: none;
}

.account-work-links a:hover {
  background: #f7f8fa;
}

.account-work-links a > b {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 4px;
  background: #244696;
  color: #fff;
  font-size: 11px;
}

.account-work-links a > span {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.account-work-links strong {
  font-size: 13px;
}

.account-work-links small {
  color: #69727d;
  font-size: 11px;
  line-height: 1.4;
}

.account-work-links i {
  color: #c7352d;
  font-size: 18px;
  font-style: normal;
}

.account-work-links > p {
  grid-column: 1 / -1;
  margin: 0;
  border-right: 1px solid #d8dce0;
  border-bottom: 1px solid #d8dce0;
  padding: 18px;
  color: #69727d;
  font-size: 12px;
}

.account-permission-section > header {
  padding: 14px 2px 12px;
  border-bottom: 1px solid #cfd3d8;
}

.account-permission-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-left: 1px solid #d8dce0;
}

.account-permission-list span {
  min-height: 48px;
  padding: 14px;
  border-right: 1px solid #d8dce0;
  border-bottom: 1px solid #d8dce0;
  background: #fff;
  color: #303741;
  font-size: 13px;
}

.account-permission-list span::before {
  content: "✓";
  margin-right: 8px;
  color: #167344;
  font-weight: 800;
}

.account-permission-list span.is-muted::before {
  content: "-";
  color: #7a828b;
}

.account-team-head {
  padding-bottom: 14px;
  border-bottom: 3px solid #244696;
}

.account-table-wrap {
  width: 100%;
  overflow-x: auto;
}

.account-user-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-size: 13px;
}

.account-user-table th,
.account-user-table td {
  padding: 12px 14px;
  border-bottom: 1px solid #d8dce0;
  text-align: left;
  vertical-align: middle;
}

.account-user-table th {
  background: #f2f3f5;
  color: #505964;
  font-size: 11px;
  text-transform: uppercase;
}

.account-user-table td strong,
.account-user-table td small {
  display: block;
}

.account-user-table td small {
  margin-top: 3px;
  color: #747c85;
}

.account-status {
  display: inline-block;
  min-width: 56px;
  padding: 3px 7px;
  border: 1px solid #bfc5cc;
  background: #f5f6f7;
  color: #505964;
  font-size: 11px;
  text-align: center;
}

.account-status.is-active {
  border-color: #75ad8d;
  background: #eef8f2;
  color: #167344;
}

.account-status.is-pending {
  border-color: #d6ac34;
  background: #fff9df;
  color: #815c00;
}

.account-row-action {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid #244696;
  border-radius: 0;
  background: #fff;
  color: #244696;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.account-row-action:disabled {
  border-color: #c9cdd2;
  color: #8a9199;
  cursor: default;
}

.account-permission-dialog {
  width: min(720px, calc(100% - 24px));
  max-height: calc(100vh - 40px);
  padding: 0;
  border: 1px solid #9da5ae;
  border-radius: 2px;
  color: #20242b;
}

.account-permission-dialog::backdrop {
  background: rgba(24, 28, 34, 0.48);
}

.account-permission-dialog form {
  display: grid;
  gap: 0;
  max-height: calc(100vh - 42px);
  overflow-y: auto;
}

.account-permission-dialog header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 3px solid #f2c94c;
}

.account-permission-dialog header p {
  margin: 5px 0 0;
  color: #69727d;
  font-size: 12px;
}

.account-permission-dialog header button {
  width: 32px;
  height: 32px;
  border: 1px solid #c5cad0;
  border-radius: 0;
  background: #fff;
  color: #343b44;
  font-size: 21px;
  cursor: pointer;
}

.account-access-state {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 16px 20px;
  background: #f4f5f6;
  border-bottom: 1px solid #d5d9dd;
}

.account-permission-dialog fieldset {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0 20px 12px;
  border: 0;
  border-bottom: 1px solid #d5d9dd;
}

.account-permission-dialog legend {
  width: 100%;
  padding: 14px 0 8px;
  color: #303741;
  font-size: 13px;
  font-weight: 800;
}

.account-permission-dialog fieldset label {
  display: flex;
  align-items: center;
  min-height: 38px;
  gap: 8px;
  color: #424a54;
  font-size: 13px;
}

.account-permission-dialog fieldset input[type="checkbox"] {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  min-height: 16px;
  margin: 0;
}

.account-permission-dialog .account-form-message {
  padding: 10px 20px 0;
}

.account-permission-dialog footer {
  position: sticky;
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 20px;
  border-top: 1px solid #d5d9dd;
  background: #fff;
}

@media (max-width: 760px) {
  .account-shell {
    width: calc(100% - 16px);
    margin-top: 8px;
  }

  .account-page-head {
    align-items: flex-start;
    padding: 13px 14px;
  }

  .account-page-head h1 {
    font-size: 17px;
  }

  .account-head-meta {
    max-width: 44%;
    font-size: 11px;
  }

  .account-auth-workspace {
    display: block;
  }

  .account-auth-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0;
    border-right: 0;
    border-bottom: 1px solid #d7dadd;
  }

  .account-auth-tabs button {
    width: 100%;
    min-height: 60px;
    padding: 10px 8px 8px;
    border-left: 0;
    border-bottom: 3px solid transparent;
  }

  .account-auth-tabs button.active {
    border-bottom-color: #244696;
  }

  .account-auth-panel,
  .account-view {
    padding: 20px 14px 28px;
  }

  .account-auth-panel[data-auth-panel="login"] {
    display: block;
  }

  .account-login-register {
    margin-top: 24px;
    padding: 18px;
    border-top: 1px solid #d8dce0;
    border-left: 0;
  }

  .account-register-form,
  .account-profile-form,
  .account-form-grid,
  .account-company-fields,
  .account-summary-grid,
  .account-permission-list,
  .account-access-state,
  .account-permission-dialog fieldset {
    grid-template-columns: 1fr;
  }

  .account-work-links {
    grid-template-columns: 1fr;
  }

  .account-summary-grid > div {
    min-height: 92px;
    border-right: 0;
    border-bottom: 1px solid #cfd3d8;
  }

  .account-summary-grid > div:last-child {
    border-bottom: 0;
  }

  .account-section-tabs {
    padding: 0 4px;
  }

  .account-section-tabs button {
    padding: 0 12px;
  }

  .account-access-notice {
    margin: 12px 14px 0;
  }

  .account-register-mode {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr;
  }

  .account-register-mode button {
    min-height: 64px;
    padding: 7px 8px;
  }

  .account-register-mode button {
    padding: 0 8px;
  }
}

/* Industrial catalog and configurable procurement workspace */
.misumi-marketplace-page {
  --mi-bg: #eef2f5;
  --mi-surface: #fff;
  --mi-surface-muted: #f6f8fa;
  --mi-line: #d6dde4;
  --mi-line-strong: #b9c5cf;
  --mi-text: #202b36;
  --mi-muted: #63707c;
  --mi-blue: #185f9d;
  --mi-blue-dark: #104a7b;
  --mi-teal: #087b68;
  --mi-amber: #a86100;
  min-width: 0;
  background: var(--mi-bg);
  color: var(--mi-text);
}

.misumi-marketplace-page main {
  width: min(calc(100% - 28px), 1580px);
  padding: 14px 0 34px;
}

.misumi-marketplace-page .topbar {
  min-height: 62px;
  border-color: var(--mi-line);
  background: rgb(255 255 255 / 96%);
  box-shadow: 0 3px 14px rgb(25 42 58 / 9%);
  backdrop-filter: blur(12px);
}

.misumi-marketplace-page .brand,
.misumi-marketplace-page .topnav a,
.misumi-marketplace-page .header-project-link {
  color: var(--mi-text);
}

.misumi-marketplace-page .brand strong {
  color: var(--mi-blue);
}

.misumi-marketplace-page .brand-mark {
  border-radius: 5px;
  background: var(--mi-blue);
  color: #fff;
  box-shadow: none;
}

.misumi-marketplace-page .topnav,
.misumi-marketplace-page .header-project-link {
  border-color: var(--mi-line);
  border-radius: 5px;
  background: var(--mi-surface);
  box-shadow: none;
}

.misumi-marketplace-page .header-project-link {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 13px;
  color: var(--mi-blue);
  font-size: 0.78rem;
  font-weight: 800;
}

.misumi-marketplace-page .platform-command-bar {
  min-height: 46px;
  margin-bottom: 12px;
  border-color: var(--mi-line);
}

.misumi-marketplace-page .button {
  min-height: 36px;
  border-radius: 4px;
  font-size: 0.75rem;
  letter-spacing: 0;
  box-shadow: none;
}

.misumi-marketplace-page .button.primary {
  border-color: var(--mi-blue);
  background: var(--mi-blue);
  color: #fff;
}

.misumi-marketplace-page .button.primary:hover {
  border-color: var(--mi-blue-dark);
  background: var(--mi-blue-dark);
}

.misumi-marketplace-page .button.secondary,
.misumi-marketplace-page .small-button {
  border-color: var(--mi-line-strong);
  background: var(--mi-surface);
  color: var(--mi-blue);
  box-shadow: none;
}

.misumi-search-command {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 14px 24px;
  border: 1px solid var(--mi-line);
  padding: 16px;
  background: var(--mi-surface);
}

.misumi-catalog-title {
  grid-row: 1 / 3;
  border-right: 1px solid var(--mi-line);
  padding-right: 22px;
}

.misumi-catalog-title > span,
.misumi-panel-heading span,
.misumi-section-heading span,
.misumi-detail-heading > div > span {
  color: var(--mi-muted);
  font-size: 0.62rem;
  font-weight: 800;
  text-transform: uppercase;
}

.misumi-catalog-title h1 {
  margin: 4px 0 5px;
  color: var(--mi-text);
  font-size: 1.2rem;
  letter-spacing: 0;
}

.misumi-catalog-title p {
  margin: 0;
  color: var(--mi-muted);
  font-size: 0.75rem;
  line-height: 1.55;
}

.misumi-global-search {
  display: grid;
  grid-template-columns: 142px minmax(0, 1fr) 82px;
  align-items: stretch;
}

.misumi-global-search select,
.misumi-global-search input,
.misumi-marketplace-page .misumi-filter-panel select,
.misumi-marketplace-page .misumi-parameter-grid select,
.misumi-marketplace-page .misumi-parameter-grid input,
.misumi-marketplace-page .misumi-quantity-field input,
.misumi-marketplace-page .misumi-buy-panel select {
  min-width: 0;
  min-height: 40px;
  border: 1px solid var(--mi-line-strong);
  border-radius: 0;
  background: #fff;
  color: var(--mi-text);
}

.misumi-global-search select {
  border-right: 0;
  padding: 0 28px 0 10px;
}

.misumi-global-search input {
  padding: 0 13px;
  font-size: 0.85rem;
}

.misumi-global-search .button {
  min-height: 40px;
  border-radius: 0 4px 4px 0;
}

.misumi-search-links {
  display: flex;
  align-items: center;
  gap: 0;
  min-width: 0;
  overflow-x: auto;
}

.misumi-search-links a {
  flex: 0 0 auto;
  border-right: 1px solid var(--mi-line);
  padding: 0 14px;
  color: var(--mi-blue);
  font-size: 0.72rem;
  font-weight: 750;
}

.misumi-search-links a:first-child {
  padding-left: 0;
}

.misumi-catalog-status {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 10px;
  border: 1px solid var(--mi-line);
  background: var(--mi-surface);
}

.misumi-catalog-status > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  min-height: 46px;
  border-right: 1px solid var(--mi-line);
  padding: 8px 12px;
}

.misumi-catalog-status > div:last-child {
  border-right: 0;
}

.misumi-catalog-status span {
  color: var(--mi-muted);
  font-size: 0.68rem;
}

.misumi-catalog-status strong {
  overflow: hidden;
  color: var(--mi-text);
  font-size: 0.8rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.misumi-catalog-shell {
  display: grid;
  grid-template-columns: 236px minmax(0, 1fr) 270px;
  align-items: start;
  margin-top: 10px;
  border: 1px solid var(--mi-line);
  background: var(--mi-surface);
}

.misumi-catalog-sidebar,
.misumi-procurement-sidebar {
  min-width: 0;
  background: var(--mi-surface-muted);
}

.misumi-catalog-sidebar {
  border-right: 1px solid var(--mi-line);
}

.misumi-procurement-sidebar {
  border-left: 1px solid var(--mi-line);
}

.misumi-category-panel,
.misumi-filter-panel,
.misumi-procurement-sidebar > section {
  border-bottom: 1px solid var(--mi-line);
  padding: 12px;
}

.misumi-panel-heading,
.misumi-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.misumi-panel-heading > div,
.misumi-section-heading > div {
  display: grid;
  gap: 2px;
}

.misumi-panel-heading h2,
.misumi-section-heading h2 {
  margin: 0;
  color: var(--mi-text);
  font-size: 0.84rem;
  letter-spacing: 0;
}

.misumi-panel-heading > a,
.misumi-section-heading > a {
  color: var(--mi-blue);
  font-size: 0.68rem;
  font-weight: 750;
}

.misumi-category-panel nav {
  display: grid;
  margin: 10px -12px -12px;
}

.misumi-category-panel nav a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  border-top: 1px solid var(--mi-line);
  padding: 7px 12px;
}

.misumi-category-panel nav a:hover,
.misumi-category-panel nav a.is-active {
  border-left: 3px solid var(--mi-blue);
  padding-left: 9px;
  background: #fff;
}

.misumi-category-panel nav a > span {
  display: grid;
  gap: 2px;
  color: var(--mi-text);
  font-size: 0.73rem;
  font-weight: 750;
}

.misumi-category-panel nav small {
  color: var(--mi-muted);
  font-size: 0.58rem;
  font-weight: 600;
}

.misumi-category-panel nav strong,
.misumi-panel-heading > strong {
  display: grid;
  min-width: 25px;
  min-height: 25px;
  place-items: center;
  border: 1px solid var(--mi-line);
  border-radius: 3px;
  background: #fff;
  color: var(--mi-blue);
  font-size: 0.67rem;
}

.misumi-filter-panel form {
  display: grid;
  gap: 9px;
  margin-top: 12px;
}

.misumi-filter-panel label,
.misumi-parameter-grid label,
.misumi-quantity-field,
.misumi-buy-panel label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.misumi-filter-panel label > span,
.misumi-parameter-grid label > span,
.misumi-quantity-field > span,
.misumi-buy-panel label > span {
  color: var(--mi-muted);
  font-size: 0.65rem;
  font-weight: 750;
}

.misumi-filter-panel select {
  min-height: 35px !important;
  padding: 0 26px 0 8px;
  font-size: 0.7rem;
}

.misumi-result-panel {
  min-width: 0;
  background: #fff;
}

.misumi-result-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 60px;
  border-bottom: 1px solid var(--mi-line);
  padding: 10px 14px;
}

.misumi-result-toolbar > div {
  display: grid;
  gap: 3px;
}

.misumi-result-toolbar span,
.misumi-result-toolbar p {
  margin: 0;
  color: var(--mi-muted);
  font-size: 0.68rem;
}

.misumi-result-toolbar h2 {
  margin: 0;
  font-size: 0.92rem;
}

.misumi-result-list {
  display: grid;
  gap: 8px;
  padding: 10px;
  background: #eef2f5;
}

.misumi-product-row {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr) 160px 138px;
  gap: 13px;
  min-width: 0;
  border: 1px solid var(--mi-line);
  border-radius: 6px;
  padding: 12px;
  background: #fff;
}

.misumi-product-visual {
  position: relative;
  display: block;
  min-width: 0;
  aspect-ratio: 1.15;
  overflow: hidden;
  border: 1px solid var(--mi-line);
  background: #f7f9fa;
}

.misumi-product-visual [data-cad-viewer] {
  position: absolute;
  inset: 0;
}

.misumi-product-visual canvas,
.misumi-detail-viewer canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.misumi-product-visual > span {
  position: absolute;
  z-index: 1;
  right: 5px;
  bottom: 5px;
  border: 1px solid #b9d0e4;
  padding: 2px 5px;
  background: rgb(255 255 255 / 92%);
  color: var(--mi-blue);
  font-size: 0.55rem;
  font-weight: 800;
}

.misumi-product-main {
  min-width: 0;
}

.misumi-product-meta,
.misumi-product-flags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.misumi-product-meta {
  color: var(--mi-muted);
  font-size: 0.63rem;
  font-weight: 700;
}

.misumi-product-meta i {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--mi-line-strong);
}

.misumi-product-main h2 {
  margin: 5px 0 4px;
  color: var(--mi-blue-dark);
  font-size: 0.86rem;
  line-height: 1.35;
}

.misumi-series-code {
  display: flex;
  align-items: baseline;
  gap: 7px;
  margin: 0 0 8px;
}

.misumi-series-code span {
  color: var(--mi-muted);
  font-size: 0.6rem;
}

.misumi-series-code strong {
  color: var(--mi-text);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.72rem;
}

.misumi-product-specs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--mi-line);
  border-left: 1px solid var(--mi-line);
}

.misumi-product-specs > div {
  min-width: 0;
  border-right: 1px solid var(--mi-line);
  border-bottom: 1px solid var(--mi-line);
  padding: 5px 7px;
}

.misumi-product-specs dt {
  color: var(--mi-muted);
  font-size: 0.56rem;
}

.misumi-product-specs dd {
  overflow: hidden;
  margin: 2px 0 0;
  color: var(--mi-text);
  font-size: 0.63rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.misumi-product-flags {
  margin-top: 8px;
}

.misumi-product-flags span {
  border: 1px solid #b8d5ca;
  border-radius: 3px;
  padding: 2px 5px;
  color: var(--mi-teal);
  font-size: 0.55rem;
  font-weight: 750;
}

.misumi-product-flags span.is-warning {
  border-color: #e2c99f;
  color: var(--mi-amber);
}

.misumi-product-commercial {
  border-left: 1px solid var(--mi-line);
  padding-left: 13px;
}

.misumi-product-commercial > span {
  color: var(--mi-muted);
  font-size: 0.62rem;
}

.misumi-product-commercial > strong {
  display: block;
  margin: 3px 0 9px;
  color: var(--mi-text);
  font-size: 1rem;
}

.misumi-product-commercial dl,
.misumi-buy-panel dl {
  display: grid;
  gap: 5px;
  margin: 0;
}

.misumi-product-commercial dl > div,
.misumi-buy-panel dl > div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.62rem;
}

.misumi-product-commercial dt,
.misumi-buy-panel dt {
  color: var(--mi-muted);
}

.misumi-product-commercial dd,
.misumi-buy-panel dd {
  margin: 0;
  color: var(--mi-text);
  font-weight: 750;
}

.misumi-product-actions {
  display: grid;
  align-content: start;
  gap: 7px;
}

.misumi-product-actions .button,
.misumi-product-actions form,
.misumi-product-actions .small-button {
  width: 100%;
}

.misumi-product-actions .small-button,
.misumi-product-actions .project-saved {
  display: grid;
  min-height: 32px;
  place-items: center;
  border-radius: 4px;
  font-size: 0.65rem;
}

.misumi-product-actions .project-saved {
  border: 1px solid #b8d5ca;
  color: var(--mi-teal);
}

.misumi-project-list,
.misumi-cart-list {
  display: grid;
  margin: 10px 0 12px;
  padding: 0;
  list-style: none;
}

.misumi-project-list li,
.misumi-cart-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  border-top: 1px solid var(--mi-line);
  padding: 8px 0;
}

.misumi-project-list a {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.misumi-project-list a strong,
.misumi-cart-list span {
  overflow: hidden;
  color: var(--mi-blue-dark);
  font-size: 0.64rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.misumi-project-list a span,
.misumi-cart-list strong {
  color: var(--mi-muted);
  font-size: 0.58rem;
}

.misumi-project-list form button {
  width: 26px;
  height: 26px;
  border: 1px solid var(--mi-line);
  border-radius: 3px;
  padding: 0;
  background: #fff;
  color: var(--mi-muted);
}

.misumi-project-list .project-empty,
.misumi-cart-list .project-empty {
  color: var(--mi-muted);
  font-size: 0.68rem;
}

.misumi-cart-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 9px;
  border-top: 1px solid var(--mi-line-strong);
  padding-top: 9px;
  font-size: 0.7rem;
}

.misumi-cart-total strong {
  font-size: 0.88rem;
}

.misumi-service-links {
  display: grid;
  padding: 0 !important;
}

.misumi-service-links a {
  display: grid;
  gap: 2px;
  border-bottom: 1px solid var(--mi-line);
  padding: 11px 12px;
}

.misumi-service-links a:last-child {
  border-bottom: 0;
}

.misumi-service-links strong {
  color: var(--mi-blue-dark);
  font-size: 0.7rem;
}

.misumi-service-links span {
  color: var(--mi-muted);
  font-size: 0.58rem;
}

.misumi-detail-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  border-bottom: 1px solid var(--mi-line);
  padding: 8px 2px;
  color: var(--mi-muted);
  font-size: 0.68rem;
  white-space: nowrap;
}

.misumi-detail-breadcrumb a {
  color: var(--mi-blue);
}

.misumi-detail-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 28px;
  border: 1px solid var(--mi-line);
  border-top: 0;
  padding: 15px 18px;
  background: #fff;
}

.misumi-detail-heading h1 {
  margin: 4px 0;
  color: var(--mi-text);
  font-size: 1.2rem;
  letter-spacing: 0;
}

.misumi-detail-heading p {
  margin: 0;
  color: var(--mi-muted);
  font-size: 0.75rem;
}

.misumi-detail-heading > div:last-child {
  display: grid;
  align-content: center;
  gap: 3px;
  border-left: 1px solid var(--mi-line);
  padding-left: 20px;
}

.misumi-detail-heading > div:last-child strong {
  color: var(--mi-blue-dark);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.82rem;
}

.misumi-detail-heading > div:last-child small {
  color: var(--mi-muted);
  font-size: 0.62rem;
}

.misumi-detail-tabs {
  display: flex;
  min-width: 0;
  overflow-x: auto;
  border: 1px solid var(--mi-line);
  border-top: 0;
  background: var(--mi-surface-muted);
}

.misumi-detail-tabs a {
  flex: 0 0 auto;
  border-right: 1px solid var(--mi-line);
  padding: 10px 16px;
  color: var(--mi-text);
  font-size: 0.7rem;
  font-weight: 750;
}

.misumi-detail-tabs a:first-child {
  border-bottom: 2px solid var(--mi-blue);
  background: #fff;
  color: var(--mi-blue);
}

.misumi-detail-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  align-items: start;
  margin-top: 10px;
  border: 1px solid var(--mi-line);
  background: #fff;
}

.misumi-detail-main {
  min-width: 0;
  border-right: 1px solid var(--mi-line);
}

.misumi-detail-main > section {
  border-bottom: 1px solid var(--mi-line);
  padding: 16px;
}

.misumi-series-overview {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(280px, 1.1fr);
  gap: 16px;
}

.misumi-detail-viewer {
  position: relative;
  min-height: 300px;
  overflow: hidden;
  border: 1px solid var(--mi-line);
  background: #f4f7f9;
}

.misumi-detail-viewer > [data-cad-viewer] {
  position: absolute;
  inset: 0;
}

.misumi-detail-viewer > button {
  position: absolute;
  z-index: 2;
  top: 8px;
  right: 8px;
  min-height: 28px;
  border: 1px solid var(--mi-line);
  border-radius: 3px;
  padding: 0 8px;
  background: rgb(255 255 255 / 92%);
  color: var(--mi-blue);
  font-size: 0.62rem;
}

.misumi-series-overview > dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  margin: 0;
  border-top: 1px solid var(--mi-line);
  border-left: 1px solid var(--mi-line);
}

.misumi-series-overview > dl > div {
  min-width: 0;
  min-height: 78px;
  border-right: 1px solid var(--mi-line);
  border-bottom: 1px solid var(--mi-line);
  padding: 11px;
}

.misumi-series-overview dt {
  color: var(--mi-muted);
  font-size: 0.63rem;
}

.misumi-series-overview dd {
  margin: 6px 0 0;
  color: var(--mi-text);
  font-size: 0.73rem;
  font-weight: 750;
  line-height: 1.45;
}

.misumi-configurator form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 140px auto;
  align-items: end;
  gap: 12px;
  margin-top: 14px;
}

.misumi-parameter-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.misumi-parameter-grid label {
  border: 1px solid var(--mi-line);
  padding: 8px;
  background: var(--mi-surface-muted);
}

.misumi-parameter-grid select,
.misumi-parameter-grid input,
.misumi-quantity-field input {
  min-height: 36px !important;
  padding: 0 9px;
  font-size: 0.7rem;
}

.misumi-parameter-grid small {
  overflow: hidden;
  color: var(--mi-muted);
  font-size: 0.54rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.misumi-generated-model {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  margin-top: 12px;
  border: 1px solid #adc8df;
  background: #f2f8fc;
}

.misumi-generated-model > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  border-right: 1px solid #adc8df;
  padding: 10px 12px;
}

.misumi-generated-model > div:last-child {
  border-right: 0;
}

.misumi-generated-model span,
.misumi-buy-model span {
  color: var(--mi-muted);
  font-size: 0.62rem;
}

.misumi-generated-model strong,
.misumi-buy-model strong {
  overflow-wrap: anywhere;
  color: var(--mi-blue-dark);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.78rem;
}

.misumi-detail-data table,
.misumi-price-table table {
  width: 100%;
  margin-top: 12px;
  border-collapse: collapse;
  font-size: 0.68rem;
}

.misumi-detail-data th,
.misumi-detail-data td,
.misumi-price-table th,
.misumi-price-table td {
  border: 1px solid var(--mi-line);
  padding: 8px 10px;
  text-align: left;
}

.misumi-detail-data th,
.misumi-price-table th {
  background: var(--mi-surface-muted);
  color: var(--mi-muted);
  font-weight: 750;
}

.misumi-detail-data th {
  width: 35%;
}

.misumi-related > div:last-child {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.misumi-related > div:last-child a {
  display: grid;
  gap: 3px;
  border: 1px solid var(--mi-line);
  padding: 10px;
}

.misumi-related a span,
.misumi-related a small {
  color: var(--mi-muted);
  font-size: 0.6rem;
}

.misumi-related a strong {
  color: var(--mi-blue-dark);
  font-size: 0.7rem;
}

.misumi-buy-panel {
  position: sticky;
  top: 74px;
  min-width: 0;
  background: var(--mi-surface-muted);
}

.misumi-buy-panel > section,
.misumi-buy-panel > p {
  margin: 0;
  border-bottom: 1px solid var(--mi-line);
  padding: 14px;
}

.misumi-ready-state {
  display: inline-flex;
  border: 1px solid #abd0c4;
  border-radius: 3px;
  padding: 3px 6px;
  color: var(--mi-teal);
  font-size: 0.6rem;
  font-weight: 800;
}

.misumi-buy-model {
  display: grid;
  gap: 4px;
  margin: 10px 0;
  border: 1px solid var(--mi-line-strong);
  padding: 10px;
  background: #fff;
}

.misumi-buy-panel dl {
  border-top: 1px solid var(--mi-line);
  padding-top: 8px;
}

.misumi-buy-panel dl > div {
  padding: 3px 0;
}

.misumi-buy-panel form,
.misumi-buy-panel .button {
  margin-top: 8px;
}

.misumi-buy-panel .misumi-section-heading {
  margin-bottom: 10px;
}

.misumi-buy-panel > section > p,
.misumi-buy-panel > p {
  color: var(--mi-muted);
  font-size: 0.64rem;
  line-height: 1.5;
}

@media (max-width: 1280px) {
  .misumi-catalog-shell {
    grid-template-columns: 220px minmax(0, 1fr);
  }

  .misumi-procurement-sidebar {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-column: 1 / -1;
    border-top: 1px solid var(--mi-line);
    border-left: 0;
  }

  .misumi-procurement-sidebar > section {
    border-right: 1px solid var(--mi-line);
    border-bottom: 0;
  }

  .misumi-product-row {
    grid-template-columns: 116px minmax(0, 1fr) 150px;
  }

  .misumi-product-actions {
    grid-column: 2 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .misumi-search-command {
    grid-template-columns: 1fr;
  }

  .misumi-catalog-title {
    grid-row: auto;
    border-right: 0;
    border-bottom: 1px solid var(--mi-line);
    padding: 0 0 10px;
  }

  .misumi-catalog-status {
    grid-template-columns: repeat(5, 150px);
    overflow-x: auto;
  }

  .misumi-catalog-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .misumi-catalog-sidebar {
    display: grid;
    grid-template-columns: minmax(220px, 0.8fr) minmax(300px, 1.2fr);
    border-right: 0;
    border-bottom: 1px solid var(--mi-line);
  }

  .misumi-category-panel {
    border-right: 1px solid var(--mi-line);
  }

  .misumi-filter-panel form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .misumi-filter-panel .button {
    grid-column: 1 / -1;
  }

  .misumi-detail-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .misumi-detail-main {
    border-right: 0;
  }

  .misumi-buy-panel {
    position: static;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid var(--mi-line);
  }

  .misumi-buy-panel > section,
  .misumi-buy-panel > p {
    border-right: 1px solid var(--mi-line);
  }

  .misumi-buy-panel > p {
    grid-column: 1 / -1;
  }
}

@media (max-width: 680px) {
  .misumi-marketplace-page main {
    width: min(calc(100% - 18px), 660px);
  }

  .misumi-global-search {
    grid-template-columns: 112px minmax(0, 1fr);
  }

  .misumi-global-search .button {
    grid-column: 1 / -1;
    border-radius: 0 0 4px 4px;
  }

  .misumi-catalog-sidebar,
  .misumi-procurement-sidebar,
  .misumi-buy-panel {
    grid-template-columns: minmax(0, 1fr);
  }

  .misumi-category-panel,
  .misumi-procurement-sidebar > section,
  .misumi-buy-panel > section {
    border-right: 0;
    border-bottom: 1px solid var(--mi-line);
  }

  .misumi-filter-panel form,
  .misumi-product-specs,
  .misumi-series-overview,
  .misumi-parameter-grid,
  .misumi-related > div:last-child {
    grid-template-columns: minmax(0, 1fr);
  }

  .misumi-product-row {
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 10px;
    padding: 9px;
  }

  .misumi-product-commercial,
  .misumi-product-actions {
    grid-column: 1 / -1;
  }

  .misumi-product-commercial {
    border-top: 1px solid var(--mi-line);
    border-left: 0;
    padding: 9px 0 0;
  }

  .misumi-product-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .misumi-detail-heading {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .misumi-detail-heading > div:last-child {
    border-top: 1px solid var(--mi-line);
    border-left: 0;
    padding: 10px 0 0;
  }

  .misumi-configurator form {
    grid-template-columns: minmax(0, 1fr);
  }

  .misumi-generated-model {
    grid-template-columns: minmax(0, 1fr);
  }

  .misumi-generated-model > div {
    border-right: 0;
    border-bottom: 1px solid #adc8df;
  }

  .misumi-generated-model > div:last-child {
    border-bottom: 0;
  }

  .misumi-detail-viewer {
    min-height: 240px;
  }
}

/* Unified operations control center */
.operations-center-page {
  --ops-canvas: #f5f6f8;
  --ops-surface: #ffffff;
  --ops-surface-muted: #f8fafc;
  --ops-text: #18212f;
  --ops-muted: #687386;
  --ops-line: #dfe3e8;
  --ops-blue: #1967d2;
  --ops-green: #207a4b;
  --ops-amber: #a65f00;
  --ops-red: #b42318;
  background: var(--ops-canvas);
  color: var(--ops-text);
  font-family: Inter, ui-sans-serif, system-ui, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

.operations-center-page:not(.light) {
  --ops-canvas: #12161d;
  --ops-surface: #191f28;
  --ops-surface-muted: #202733;
  --ops-text: #eef2f7;
  --ops-muted: #a5afbd;
  --ops-line: #333c49;
  --ops-blue: #78aef5;
  --ops-green: #63c991;
  --ops-amber: #f0b65e;
  --ops-red: #ff8f84;
}

.operations-center-page main {
  width: min(1560px, calc(100% - 32px));
  padding-top: 18px;
}

.operations-center-page .topbar {
  border-color: var(--ops-line);
  background: color-mix(in srgb, var(--ops-surface) 95%, transparent);
}

.operations-center-page .brand,
.operations-center-page .topnav a,
.operations-center-page .auth-button,
.operations-center-page .icon-button,
.operations-center-page .language-switch select {
  color: var(--ops-text);
}

.operations-center-page .button.primary {
  border-color: var(--ops-blue);
  background: var(--ops-blue);
  color: #ffffff;
  box-shadow: none;
}

.operations-center-page .button.secondary {
  border-color: var(--ops-line);
  background: var(--ops-surface);
  color: var(--ops-text);
  box-shadow: none;
}

.operations-page-head {
  align-items: center;
  min-height: 102px;
  margin-bottom: 12px;
  border-top: 0;
  border-color: var(--ops-line);
  padding: 14px 2px 18px;
}

.operations-page-head h1 {
  color: var(--ops-text);
  font-size: 1.9rem;
  text-shadow: none;
}

.operations-page-head .eyebrow,
.operations-section .section-kicker {
  color: var(--ops-blue);
}

.operations-page-head .page-subtitle,
.operations-section-head p,
.operations-last-updated {
  color: var(--ops-muted);
}

.operations-last-updated {
  align-self: center;
  font-size: 0.75rem;
}

.operations-control-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-bottom: 14px;
  border: 1px solid var(--ops-line);
  background: var(--ops-surface);
}

.operations-control-metrics article {
  display: grid;
  min-width: 0;
  min-height: 88px;
  align-content: center;
  border-right: 1px solid var(--ops-line);
  padding: 12px 15px;
}

.operations-control-metrics article:last-child {
  border-right: 0;
}

.operations-control-metrics span,
.operations-control-metrics small {
  color: var(--ops-muted);
  font-size: 0.68rem;
}

.operations-control-metrics strong {
  margin: 3px 0 2px;
  color: var(--ops-text);
  font-size: 1.32rem;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.operations-view-tabs {
  display: flex;
  min-height: 46px;
  align-items: stretch;
  gap: 2px;
  margin-bottom: 10px;
  border: 1px solid var(--ops-line);
  background: var(--ops-surface);
}

.operations-view-tabs > button {
  min-width: 110px;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  padding: 0 18px;
  background: transparent;
  color: var(--ops-muted);
  box-shadow: none;
  font-weight: 700;
}

.operations-view-tabs > button:hover,
.operations-view-tabs > button.is-active {
  border-bottom-color: var(--ops-blue);
  background: var(--ops-surface-muted);
  color: var(--ops-text);
}

.operations-view-tabs > span {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 7px;
  margin-left: auto;
  padding: 0 14px;
  color: var(--ops-muted);
  font-size: 0.7rem;
}

.operations-view-tabs > span strong {
  color: var(--ops-text);
}

.operations-workspace {
  display: grid;
  grid-template-columns: 214px minmax(0, 1fr);
  align-items: start;
  border: 1px solid var(--ops-line);
  background: var(--ops-surface);
}

.operations-workspace.operations-workspace-simplified {
  grid-template-columns: minmax(0, 1fr);
}

.operations-section[hidden] {
  display: none !important;
}

.operations-sidebar {
  position: sticky;
  top: 82px;
  display: grid;
  min-height: calc(100vh - 104px);
  align-content: start;
  border-right: 1px solid var(--ops-line);
  background: var(--ops-surface-muted);
}

.operations-sidebar-title {
  display: grid;
  gap: 2px;
  border-bottom: 1px solid var(--ops-line);
  padding: 18px 16px;
}

.operations-sidebar-title span,
.operations-sidebar-meta span {
  color: var(--ops-muted);
  font-size: 0.67rem;
  text-transform: uppercase;
}

.operations-sidebar-title strong {
  font-size: 0.88rem;
}

.operations-sidebar nav {
  display: grid;
  gap: 2px;
  padding: 10px;
}

.operations-sidebar nav button {
  min-height: 38px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0;
  padding: 0 10px;
  background: transparent;
  color: var(--ops-muted);
  text-align: left;
  box-shadow: none;
}

.operations-sidebar nav button:hover,
.operations-sidebar nav button.is-active {
  border-left-color: var(--ops-blue);
  background: color-mix(in srgb, var(--ops-blue) 9%, var(--ops-surface));
  color: var(--ops-text);
}

.operations-sidebar-meta {
  display: grid;
  gap: 4px;
  margin-top: 14px;
  border-top: 1px solid var(--ops-line);
  padding: 16px;
  font-size: 0.75rem;
}

.operations-content {
  min-width: 0;
}

.operations-section {
  scroll-margin-top: 92px;
  border-bottom: 1px solid var(--ops-line);
  padding: 22px;
}

.operations-section:last-child {
  border-bottom: 0;
}

.operations-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}

.operations-section-head h2 {
  margin: 3px 0 4px;
  color: var(--ops-text);
  font-size: 1.08rem;
}

.operations-section-head p {
  max-width: 720px;
  margin: 0;
  font-size: 0.78rem;
}

.operations-message {
  max-width: 420px;
  border-left: 3px solid var(--ops-line);
  padding: 4px 0 4px 10px;
  text-align: right;
}

.operations-message[data-tone="success"] {
  border-left-color: var(--ops-green);
  color: var(--ops-green);
}

.operations-message[data-tone="warning"] {
  border-left-color: var(--ops-amber);
  color: var(--ops-amber);
}

.operations-message[data-tone="danger"] {
  border-left-color: var(--ops-red);
  color: var(--ops-red);
}

.operations-service-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--ops-line);
  border-left: 1px solid var(--ops-line);
}

.operations-service-card {
  min-width: 0;
  border-right: 1px solid var(--ops-line);
  border-bottom: 1px solid var(--ops-line);
  background: var(--ops-surface);
}

.operations-service-card-wide {
  grid-column: 1 / -1;
}

.operations-service-card header {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 74px;
  border-bottom: 1px solid var(--ops-line);
  padding: 12px 14px;
}

.operations-service-icon {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--ops-blue) 28%, var(--ops-line));
  background: color-mix(in srgb, var(--ops-blue) 8%, var(--ops-surface));
  color: var(--ops-blue);
  font-size: 0.67rem;
  font-weight: 900;
}

.operations-service-card h3,
.operations-governance-grid h3 {
  margin: 0;
  color: var(--ops-text);
  font-size: 0.86rem;
}

.operations-service-card header p {
  margin: 2px 0 0;
  color: var(--ops-muted);
  font-size: 0.7rem;
}

.operations-service-state {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  border: 1px solid var(--ops-line);
  border-radius: 5px;
  padding: 0 7px;
  color: var(--ops-muted);
  font-size: 0.66rem;
  font-weight: 800;
  white-space: nowrap;
}

.operations-service-state.is-online {
  border-color: color-mix(in srgb, var(--ops-green) 35%, var(--ops-line));
  background: color-mix(in srgb, var(--ops-green) 7%, var(--ops-surface));
  color: var(--ops-green);
}

.operations-service-state.is-offline {
  border-color: color-mix(in srgb, var(--ops-red) 30%, var(--ops-line));
  background: color-mix(in srgb, var(--ops-red) 6%, var(--ops-surface));
  color: var(--ops-red);
}

.operations-service-card dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.operations-service-card dl div {
  min-width: 0;
  border-right: 1px solid var(--ops-line);
  padding: 11px 14px;
}

.operations-service-card dl div:last-child {
  border-right: 0;
}

.operations-service-card dt {
  color: var(--ops-muted);
  font-size: 0.66rem;
}

.operations-service-card dd {
  margin: 5px 0 0;
  color: var(--ops-text);
  font-size: 0.79rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.operations-card-actions {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-top: 1px solid var(--ops-line);
  padding: 8px 14px;
}

.operations-card-actions .button {
  min-height: 32px;
  padding-inline: 10px;
  font-size: 0.72rem;
}

.operations-text-link {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--ops-blue);
  font-size: 0.72rem;
  font-weight: 700;
  box-shadow: none;
}

.operations-gateway-url {
  max-width: 420px;
  color: var(--ops-blue);
  font-size: 0.76rem;
  font-weight: 800;
  overflow-wrap: anywhere;
  text-align: right;
}

.operations-gateway-url.is-disabled {
  color: var(--ops-muted);
  pointer-events: none;
}

.cloudflare-gateway-section {
  background: var(--ops-surface-muted);
}

.cloudflare-gateway-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid var(--ops-line);
  background: var(--ops-surface);
}

.edge-gateway-summary {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.cloudflare-gateway-summary article {
  display: grid;
  min-width: 0;
  gap: 3px;
  border-right: 1px solid var(--ops-line);
  padding: 12px 14px;
}

.cloudflare-gateway-summary article:last-child {
  border-right: 0;
}

.cloudflare-gateway-summary span,
.cloudflare-gateway-summary small {
  color: var(--ops-muted);
  font-size: 0.67rem;
}

.cloudflare-gateway-summary strong {
  color: var(--ops-text);
  font-size: 0.9rem;
  overflow-wrap: anywhere;
}

.cloudflare-gateway-workspace {
  display: grid;
  grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.25fr);
  margin-top: 12px;
  border: 1px solid var(--ops-line);
  background: var(--ops-surface);
}

.cloudflare-publish-form,
.cloudflare-service-register {
  min-width: 0;
  padding: 16px;
}

.cloudflare-publish-form {
  display: grid;
  align-content: start;
  gap: 11px;
  border-right: 1px solid var(--ops-line);
}

.cloudflare-form-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 2px;
}

.cloudflare-form-head h3 {
  margin: 0;
  color: var(--ops-text);
  font-size: 0.86rem;
}

.cloudflare-form-head p,
.cloudflare-form-head > span {
  margin: 3px 0 0;
  color: var(--ops-muted);
  font-size: 0.68rem;
}

.cloudflare-form-head > strong {
  color: var(--ops-blue);
  font-size: 1rem;
}

.edge-register-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.edge-register-actions strong {
  color: var(--ops-blue);
  font-size: 1rem;
}

.edge-register-actions .button {
  min-height: 30px;
  padding: 0 9px;
  font-size: 0.66rem;
}

.cloudflare-publish-form label {
  display: grid;
  gap: 5px;
  color: var(--ops-muted);
  font-size: 0.68rem;
}

.cloudflare-publish-form input,
.cloudflare-publish-form select {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--ops-line);
  border-radius: 3px;
  background: var(--ops-surface);
  color: var(--ops-text);
}

.cloudflare-publish-form input:focus,
.cloudflare-publish-form select:focus {
  border-color: var(--ops-blue);
  outline: 2px solid color-mix(in srgb, var(--ops-blue) 15%, transparent);
}

.cloudflare-publish-form .button {
  width: 100%;
  margin-top: 2px;
}

.cloudflare-service-list {
  display: grid;
  margin-top: 12px;
  border-top: 1px solid var(--ops-line);
}

.cloudflare-service-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  border-bottom: 1px solid var(--ops-line);
}

.cloudflare-service-lock {
  display: grid;
  width: 36px;
  height: 30px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--ops-blue) 28%, var(--ops-line));
  color: var(--ops-blue);
  font-size: 0.61rem;
  font-weight: 900;
}

.cloudflare-service-identity {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.cloudflare-service-row strong,
.cloudflare-service-row span {
  overflow-wrap: anywhere;
}

.cloudflare-service-row strong {
  color: var(--ops-text);
  font-size: 0.77rem;
}

.cloudflare-service-identity span {
  color: var(--ops-muted);
  font-size: 0.66rem;
}

.cloudflare-service-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.cloudflare-service-actions a,
.cloudflare-service-actions button {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--ops-blue);
  font-size: 0.7rem;
  font-weight: 800;
  box-shadow: none;
}

.cloudflare-service-actions button {
  color: var(--ops-red);
}

.cloudflare-service-actions button[data-edge-verify] {
  color: var(--ops-blue);
}

.edge-route-status.is-active {
  border-color: color-mix(in srgb, var(--ops-green) 35%, var(--ops-line));
  color: var(--ops-green) !important;
}

.edge-route-status.is-pending_dns {
  border-color: color-mix(in srgb, var(--ops-amber) 38%, var(--ops-line));
  color: var(--ops-amber) !important;
}

.edge-route-status.is-disabled {
  border-color: color-mix(in srgb, var(--ops-red) 32%, var(--ops-line));
  color: var(--ops-red) !important;
}

.cloudflare-gateway-warning {
  margin: 10px 0 0;
  border-left: 3px solid var(--ops-amber);
  padding-left: 10px;
  color: var(--ops-amber);
  font-size: 0.72rem;
}

.operations-search-section {
  background: var(--ops-surface-muted);
}

.operations-result-count {
  color: var(--ops-muted);
  font-size: 0.75rem;
}

.operations-searchbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(160px, 0.35fr) minmax(150px, 0.3fr) auto;
  align-items: end;
  gap: 8px;
  margin-bottom: 12px;
}

.operations-searchbar label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.operations-searchbar label span {
  color: var(--ops-muted);
  font-size: 0.67rem;
  font-weight: 700;
}

.operations-searchbar input,
.operations-searchbar select {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  border-color: var(--ops-line);
  border-radius: 4px;
  background: var(--ops-surface);
  color: var(--ops-text);
}

.operations-searchbar .button {
  min-height: 38px;
}

.operations-search-results {
  min-height: 130px;
  border: 1px solid var(--ops-line);
  background: var(--ops-surface);
}

.operations-search-result {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 60px;
  border-bottom: 1px solid var(--ops-line);
  padding: 8px 12px;
}

.operations-search-result:last-child {
  border-bottom: 0;
}

.operations-file-type {
  display: grid;
  width: 38px;
  height: 34px;
  place-items: center;
  border: 1px solid var(--ops-line);
  background: var(--ops-surface-muted);
  color: var(--ops-blue);
  font-size: 0.62rem;
  font-weight: 900;
}

.operations-search-result > div:nth-child(2) {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.operations-search-result strong {
  overflow: hidden;
  color: var(--ops-text);
  font-size: 0.78rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.operations-search-result div span {
  color: var(--ops-muted);
  font-size: 0.67rem;
}

.operations-result-actions {
  display: flex;
  gap: 6px;
}

.operations-result-actions a {
  min-height: 30px;
  border: 1px solid var(--ops-line);
  border-radius: 4px;
  padding: 6px 9px;
  background: var(--ops-surface);
  color: var(--ops-text);
  font-size: 0.68rem;
  font-weight: 700;
}

.operations-governance-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(260px, 1fr) minmax(360px, 1.35fr);
  border-top: 1px solid var(--ops-line);
  border-left: 1px solid var(--ops-line);
}

.operations-governance-grid > section {
  min-width: 0;
  border-right: 1px solid var(--ops-line);
  border-bottom: 1px solid var(--ops-line);
  padding: 14px;
}

.operations-governance-grid h3 {
  margin-bottom: 8px;
}

.operations-center-page .operations-runtime-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 8px;
  background: var(--ops-line);
}

.operations-center-page .operations-runtime-list div {
  min-height: 60px;
  background: var(--ops-surface);
}

.operations-center-page .operations-check {
  border-color: var(--ops-line);
}

.operations-center-page .operations-check div span,
.operations-center-page .operations-message,
.operations-center-page .operations-table td span {
  color: var(--ops-muted);
}

.operations-center-page .operations-table th,
.operations-center-page .operations-table td {
  border-color: var(--ops-line);
}

.operations-center-page .quote-register {
  margin-bottom: 0;
}

@media (max-width: 1180px) {
  .edge-gateway-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .operations-control-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .operations-control-metrics article:nth-child(3) {
    border-right: 0;
  }

  .operations-control-metrics article:nth-child(-n + 3) {
    border-bottom: 1px solid var(--ops-line);
  }

  .operations-governance-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operations-governance-grid > section:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 960px) {
  .operations-workspace {
    grid-template-columns: 1fr;
  }

  .operations-sidebar {
    position: sticky;
    top: 0;
    z-index: 8;
    display: block;
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid var(--ops-line);
  }

  .operations-sidebar-title,
  .operations-sidebar-meta {
    display: none;
  }

  .operations-sidebar nav {
    display: flex;
    overflow-x: auto;
    padding: 6px;
  }

  .operations-sidebar nav button {
    min-width: max-content;
    border-bottom: 2px solid transparent;
    border-left: 0;
  }

  .operations-sidebar nav button:hover,
  .operations-sidebar nav button.is-active {
    border-bottom-color: var(--ops-blue);
    border-left-color: transparent;
  }

  .operations-searchbar {
    grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(140px, 0.4fr));
  }

  .operations-searchbar .button {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .edge-gateway-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operations-center-page .topbar {
    position: relative;
  }

  .operations-center-page main {
    width: min(100% - 20px, 680px);
    padding-top: 10px;
  }

  .operations-page-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .operations-page-head .page-actions {
    width: 100%;
    justify-content: space-between;
  }

  .operations-control-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operations-control-metrics article,
  .operations-control-metrics article:nth-child(3) {
    border-right: 1px solid var(--ops-line);
    border-bottom: 1px solid var(--ops-line);
  }

  .operations-control-metrics article:nth-child(2n) {
    border-right: 0;
  }

  .operations-control-metrics article:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .operations-section {
    padding: 16px 12px;
  }

  .operations-section-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .operations-message {
    max-width: none;
    text-align: left;
  }

  .operations-service-grid,
  .operations-governance-grid {
    grid-template-columns: 1fr;
  }

  .operations-governance-grid > section:last-child {
    grid-column: auto;
  }

  .operations-searchbar {
    grid-template-columns: 1fr;
  }

  .cloudflare-gateway-workspace {
    grid-template-columns: 1fr;
  }

  .cloudflare-publish-form {
    border-right: 0;
    border-bottom: 1px solid var(--ops-line);
  }

  .operations-searchbar .button {
    grid-column: auto;
  }

  .operations-search-result {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  .operations-result-actions {
    grid-column: 2;
    justify-content: flex-start;
  }
}

@media (max-width: 420px) {
  .edge-gateway-summary {
    grid-template-columns: 1fr;
  }

  .operations-service-card header {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  .operations-service-state {
    grid-column: 2;
    justify-self: start;
  }

  .operations-service-card dl {
    grid-template-columns: 1fr;
  }

  .operations-service-card dl div,
  .operations-service-card dl div:last-child {
    border-right: 0;
    border-bottom: 1px solid var(--ops-line);
  }

  .operations-service-card dl div:last-child {
    border-bottom: 0;
  }

  .operations-center-page .operations-runtime-list {
    grid-template-columns: 1fr;
  }

  .cloudflare-gateway-summary {
    grid-template-columns: 1fr;
  }

  .cloudflare-gateway-summary article,
  .cloudflare-gateway-summary article:last-child {
    border-right: 0;
    border-bottom: 1px solid var(--ops-line);
  }

  .cloudflare-gateway-summary article:last-child {
    border-bottom: 0;
  }

  .cloudflare-service-row {
    grid-template-columns: 38px minmax(0, 1fr) auto;
  }

  .cloudflare-service-actions {
    grid-column: 2;
  }
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 18% 8%, rgb(63 127 255 / 18%), transparent 34rem),
    radial-gradient(circle at 86% 14%, rgb(78 231 194 / 15%), transparent 30rem),
    linear-gradient(135deg, #06080d 0%, #09111a 48%, #071016 100%);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, "Segoe UI", sans-serif;
}

body.light {
  color-scheme: light;
  --bg: #f5f9fc;
  --panel: rgb(255 255 255 / 86%);
  --panel-strong: #eaf3f9;
  --text: #13212c;
  --muted: #5d7183;
  --line: #c9dce8;
  --accent: #0f8b74;
  --accent-2: #176fc2;
  --shadow: 0 24px 70px rgb(51 84 111 / 18%);
  --glow: 0 0 28px rgb(15 139 116 / 14%);
  --topbar-bg: rgb(246 249 252 / 82%);
  --control-bg: linear-gradient(180deg, rgb(255 255 255 / 94%), rgb(240 247 251 / 82%));
  --field-bg: rgb(255 255 255 / 86%);
}

body.light {
  background:
    radial-gradient(circle at 18% 8%, rgb(23 111 194 / 12%), transparent 34rem),
    radial-gradient(circle at 86% 14%, rgb(15 139 116 / 10%), transparent 30rem),
    linear-gradient(135deg, #f6f9fc 0%, #edf6f8 48%, #f8fbfd 100%);
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select {
  font: inherit;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 68px;
  padding: 0 28px;
  border-bottom: 1px solid rgb(111 183 255 / 22%);
  background: var(--topbar-bg);
  box-shadow: 0 12px 42px rgb(0 0 0 / 28%);
  backdrop-filter: blur(22px);
}

.brand,
.header-actions,
.page-actions,
.auth-status,
.bucket-tab,
.object-actions,
.section-head,
.page-head {
  display: flex;
  align-items: center;
}

.brand {
  gap: 10px;
  font-weight: 900;
}

.brand-mark {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  color: #07120d;
  box-shadow: 0 0 30px rgb(78 231 194 / 36%);
}

.header-actions,
.page-actions {
  gap: 10px;
}

.topnav {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px;
  background: var(--control-bg);
}

.topnav a {
  min-height: 30px;
  border-radius: 999px;
  padding: 7px 11px;
  color: var(--muted);
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1;
}

.topnav a:hover {
  background: rgb(111 183 255 / 12%);
  color: var(--text);
}

.language-switch {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 6px 4px 12px;
  background: var(--control-bg);
  color: var(--muted);
  font-size: 0.8125rem;
  font-weight: 700;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 8%);
}

.language-switch select {
  flex: 0 0 92px;
  min-height: 30px;
  width: 92px;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
  border-radius: 999px;
  padding: 0 26px 0 10px;
  background: var(--field-bg);
  color: var(--text);
  cursor: pointer;
}

.language-switch select:focus {
  border-color: var(--accent);
  box-shadow: var(--glow);
}

.auth-status {
  gap: 8px;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: var(--control-bg);
  color: var(--muted);
  font-size: 0.8125rem;
  font-weight: 700;
}

.auth-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--danger);
}

.auth-dot.verified {
  background: var(--accent);
  box-shadow: 0 0 18px var(--accent);
}

.icon-button,
.auth-button,
.button,
.small-button,
.bucket-tab,
.object-actions button {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--control-bg);
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0px;
  text-align: center;
  text-decoration: none;
  transition:
    border-color 160ms ease,
    box-shadow 160ms ease,
    transform 160ms ease,
    background 160ms ease;
}

.icon-button:hover,
.auth-button:hover,
.button:hover,
.small-button:hover,
.bucket-tab:hover,
.object-actions button:hover {
  border-color: color-mix(in srgb, var(--accent) 72%, var(--line));
  box-shadow: var(--glow);
  transform: translateY(-1px);
}

.icon-button {
  width: 40px;
}

.auth-button,
.button,
.small-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 14px;
  white-space: nowrap;
}

.auth-button {
  min-width: 76px;
}

.small-button,
.object-actions button {
  min-height: 32px;
  padding: 0 10px;
  font-size: 0.78rem;
}

.primary {
  border-color: var(--accent);
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  color: #07120d;
  box-shadow: 0 0 34px rgb(78 231 194 / 24%);
}

.secondary {
  background: var(--panel);
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

main {
  width: min(1440px, calc(100% - 36px));
  margin: 0 auto;
  padding: 28px 0 42px;
}

.page-head {
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 20px;
  border-block: 1px solid var(--line);
  padding: 20px 2px;
  background: transparent;
}

.eyebrow {
  margin: 0 0 8px;
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

h1,
h2,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 0;
  font-size: clamp(1.9rem, 3vw, 3.2rem);
  line-height: 1.06;
  letter-spacing: 0;
  text-shadow: 0 0 36px rgb(111 183 255 / 24%);
}

h2 {
  margin-bottom: 12px;
  font-size: 1.05rem;
}

.metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.metrics article,
.side-panel,
.content-panel,
.detail-panel,
.auth-dialog,
.file-dialog {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
  backdrop-filter: blur(18px);
}

.metrics article {
  padding: 16px;
  background:
    linear-gradient(135deg, rgb(111 183 255 / 10%), transparent 42%),
    var(--panel);
}

.metrics span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-weight: 800;
}

.metrics strong {
  font-size: 1.8rem;
  color: var(--text);
  text-shadow: 0 0 24px rgb(78 231 194 / 18%);
}

.app-shell {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr) 340px;
  gap: 16px;
  align-items: start;
}

.side-panel,
.content-panel,
.detail-panel {
  padding: 16px;
  min-width: 0;
}

.panel-block {
  margin-bottom: 18px;
}

.es-admin-page {
  margin-top: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background:
    linear-gradient(135deg, rgb(78 231 194 / 8%), transparent 38%),
    var(--panel);
  box-shadow: var(--shadow);
}

.section-head {
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}

.section-head h2 {
  margin-bottom: 0;
  font-size: 1.55rem;
}

.es-admin-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.es-admin-card,
.es-ops-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgb(4 10 16 / 48%);
}

.es-admin-card {
  display: grid;
  gap: 8px;
  padding: 15px;
}

body.light .es-admin-card,
body.light .es-ops-panel {
  background: rgb(255 255 255 / 68%);
}

.es-admin-card span {
  color: var(--muted);
  font-weight: 900;
}

.es-admin-card strong {
  color: var(--text);
  font-size: 1.25rem;
  overflow-wrap: anywhere;
}

.es-admin-card small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.status-card strong {
  color: var(--accent);
}

.es-ops-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
  gap: 14px;
}

.es-ops-panel {
  padding: 16px;
}

.es-results.wide {
  margin-top: 12px;
  max-height: 390px;
}

.diagnostic-list {
  display: grid;
  gap: 10px;
}

.diagnostic-list article {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  background: rgb(111 183 255 / 8%);
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.diagnostic-list pre {
  max-height: 360px;
  margin: 0;
  overflow: auto;
  color: var(--text);
  font-size: 0.82rem;
  line-height: 1.45;
  white-space: pre-wrap;
}

.engineering-shell {
  display: grid;
  grid-template-columns: 310px minmax(0, 1fr) 340px;
  gap: 16px;
  align-items: start;
}

.engineering-sidebar,
.engineering-main {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.engineering-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: rgb(4 10 16 / 48%);
  box-shadow: var(--shadow);
}

body.light .engineering-panel {
  background: rgb(255 255 255 / 72%);
}

.project-list,
.part-results,
.design-file-results {
  display: grid;
  gap: 10px;
}

.project-item,
.part-result,
.design-file-result {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  color: var(--text);
  background: rgb(255 255 255 / 4%);
  text-align: left;
}

.project-item {
  display: grid;
}

.project-item.active {
  border-color: rgb(78 231 194 / 54%);
  background: rgb(78 231 194 / 10%);
}

.project-item strong,
.part-result strong,
.design-file-result strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-item span,
.part-result span,
.design-file-result span {
  display: block;
  margin-top: 4px;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-form-grid,
.engineering-upload {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.engineering-upload {
  grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1fr) auto;
  align-items: end;
}

.bom-table-wrap {
  overflow-x: auto;
}

.bom-table {
  width: 100%;
  min-width: 780px;
  border-collapse: collapse;
}

.bom-table th,
.bom-table td {
  border-bottom: 1px solid var(--line);
  padding: 9px;
  text-align: left;
}

.bom-table th {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.bom-table input {
  min-height: 36px;
}

.bom-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  background: rgb(255 255 255 / 4%);
}

.bom-summary span {
  color: var(--muted);
  font-weight: 800;
}

.bom-summary strong {
  color: var(--accent);
  font-size: 1.2rem;
}

.procurement-preview pre {
  max-height: 520px;
  margin: 0;
  overflow: auto;
  color: var(--text);
  font-size: 0.8rem;
  line-height: 1.45;
  white-space: pre-wrap;
}

.nas-shell {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: start;
}

.nas-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: rgb(4 10 16 / 48%);
  box-shadow: var(--shadow);
}

body.light .nas-panel {
  background: rgb(255 255 255 / 72%);
}

.nas-wide {
  grid-column: 1 / -1;
}

.nas-folder-grid,
.nas-file-list,
.nas-snapshot-grid,
.backup-policy-grid {
  display: grid;
  gap: 10px;
}

.nas-folder-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.nas-snapshot-grid,
.backup-policy-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.nas-folder,
.nas-file {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  background: rgb(255 255 255 / 4%);
}

.nas-file {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.nas-folder strong,
.nas-file strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-folder span,
.nas-folder small,
.nas-file span {
  display: block;
  margin-top: 4px;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-result pre {
  max-height: 360px;
  margin: 12px 0 0;
  overflow: auto;
  color: var(--text);
  font-size: 0.82rem;
  line-height: 1.45;
  white-space: pre-wrap;
}

.pdm-shell {
  display: grid;
  grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.55fr) minmax(280px, 0.85fr);
  gap: 16px;
  align-items: start;
}

.pdm-sidebar,
.pdm-main,
.pdm-panel,
.pdm-revision-list,
.pdm-search-results,
.pdm-state-grid {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.pdm-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: rgb(4 10 16 / 48%);
  box-shadow: var(--shadow);
}

body.light .pdm-panel {
  background: rgb(255 255 255 / 72%);
}

.pdm-bucket {
  border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--line));
  border-radius: 999px;
  padding: 7px 10px;
  color: var(--accent);
  background: rgb(78 231 194 / 9%);
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1;
}

.pdm-upload {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}

.pdm-upload button {
  min-height: 44px;
}

.pdm-revision-card,
.pdm-search-card,
.pdm-state-grid article {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgb(255 255 255 / 4%);
}

.pdm-revision-card,
.pdm-search-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.pdm-revision-card > div,
.pdm-search-card > div {
  min-width: 0;
  flex: 1 1 auto;
}

.pdm-revision-card strong,
.pdm-search-card strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-revision-card span,
.pdm-revision-card small,
.pdm-search-card span,
.pdm-state-grid span {
  display: block;
  margin-top: 4px;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-revision-actions {
  display: inline-flex;
  flex-shrink: 0;
  gap: 8px;
}

.pdm-state-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pdm-state-grid strong {
  display: block;
  margin-top: 5px;
  color: var(--accent);
  font-size: 1rem;
}

.pdm-local-sync-grid,
.pdm-local-results {
  display: grid;
  gap: 10px;
}

.pdm-local-sync-grid {
  grid-template-columns: minmax(0, 1fr) 220px;
}

.pdm-sync-summary,
.pdm-local-file {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  background: rgb(255 255 255 / 4%);
}

.pdm-sync-summary strong,
.pdm-sync-summary span,
.pdm-local-file strong,
.pdm-local-file span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-sync-summary span,
.pdm-local-file span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
}

.pdm-local-file {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.pdm-local-results pre {
  max-height: 220px;
  margin: 0;
  overflow: auto;
  color: var(--text);
  font-size: 0.8rem;
  line-height: 1.45;
  white-space: pre-wrap;
}

.pdm-synology-grid,
.pdm-synology-plan {
  display: grid;
  gap: 10px;
}

.pdm-synology-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pdm-synology-plan pre {
  max-height: 300px;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  overflow: auto;
  color: var(--text);
  background: rgb(255 255 255 / 4%);
  font-size: 0.8rem;
  line-height: 1.45;
  white-space: pre-wrap;
}

.agent-flow {
  display: grid;
  grid-template-columns: 0.8fr 2.2fr 1.35fr 1.35fr 1fr;
  gap: 14px;
  margin-bottom: 18px;
}

.agent-column,
.agent-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: rgb(4 10 16 / 48%);
  box-shadow: var(--shadow);
}

body.light .agent-column,
body.light .agent-panel {
  background: rgb(255 255 255 / 74%);
}

.agent-column {
  display: grid;
  align-content: start;
  gap: 10px;
}

.agent-column h2,
.agent-panel h2 {
  margin: 0;
  color: var(--accent);
  font-size: 1rem;
}

.agent-column span,
.agent-capability-grid span {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  color: var(--text);
  background: rgb(255 255 255 / 4%);
  font-weight: 800;
}

.agent-capability-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.data-layer h2,
.data-layer span {
  color: #9df2c7;
}

.app-layer h2,
.app-layer span {
  color: #cdb8ff;
}

.output-layer h2,
.output-layer span {
  color: #ffd08a;
}

.standard-agent-shell {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
  gap: 16px;
}

.agent-wide {
  grid-column: 1 / -1;
}

.agent-input-grid,
.agent-output-grid,
.agent-check-grid,
.agent-roadmap {
  display: grid;
  gap: 10px;
}

.agent-input-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.agent-output-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.agent-output-grid article,
.agent-result-card,
.agent-alt-card,
.agent-check-grid article,
.agent-roadmap article {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgb(255 255 255 / 4%);
}

.agent-result-card {
  display: grid;
  gap: 10px;
}

.agent-result-card span,
.agent-result-card small,
.agent-alt-card span,
.agent-check-grid span,
.agent-roadmap span {
  color: var(--muted);
  font-weight: 800;
}

.agent-result-card strong {
  color: var(--text);
  font-size: 1.3rem;
}

.agent-result-card dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.agent-result-card dl div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px;
}

.agent-check-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 12px;
}

.agent-check-grid article.ok {
  border-color: rgb(47 184 126 / 42%);
}

.agent-check-grid article.warn {
  border-color: rgb(245 184 83 / 48%);
}

.agent-alternatives {
  display: grid;
  gap: 10px;
}

.agent-trace {
  display: grid;
  gap: 10px;
}

.agent-trace-step {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  background: rgb(255 255 255 / 4%);
}

.agent-trace-step > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  color: var(--accent);
  background: rgb(78 231 194 / 12%);
  font-weight: 900;
}

.agent-trace-step strong,
.agent-trace-step small {
  display: block;
}

.agent-trace-step small {
  margin-top: 4px;
  color: var(--muted);
  font-weight: 800;
}

.agent-trace-step pre {
  max-height: 160px;
  margin: 8px 0 0;
  overflow: auto;
  color: var(--text);
  font-size: 0.78rem;
  line-height: 1.45;
  white-space: pre-wrap;
}

.agent-output-grid pre {
  max-height: 320px;
  margin: 8px 0 0;
  overflow: auto;
  color: var(--text);
  font-size: 0.8rem;
  line-height: 1.45;
  white-space: pre-wrap;
}

.agent-roadmap {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.commerce-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.distribution-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.distribution-metrics article {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.distribution-metrics span,
.distribution-metrics small,
.distributor-availability span,
.distributor-pricing > span,
.bom-confidence span,
.bom-supply span,
.bom-extended span {
  display: block;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 800;
}

.distribution-metrics strong {
  display: block;
  margin: 5px 0;
  color: var(--accent);
  font-size: 1.35rem;
}

.distributor-shell {
  display: grid;
  grid-template-columns: 236px minmax(0, 1fr) 310px;
  gap: 14px;
  align-items: start;
}

.distributor-filter-panel,
.distributor-catalog {
  min-width: 0;
}

.distributor-filter-panel {
  position: sticky;
  top: 86px;
  display: grid;
  gap: 12px;
}

.parametric-filter,
.filter-support,
.distributor-catalog {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 13px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.parametric-filter,
.filter-support {
  display: grid;
  gap: 11px;
}

.parametric-filter h2,
.filter-support h2 {
  margin: 0;
  font-size: 0.98rem;
}

.parametric-filter .panel-title a,
.filter-support a {
  color: var(--accent);
  font-size: 0.8rem;
  font-weight: 800;
}

.filter-support a {
  border-top: 1px solid var(--line);
  padding-top: 9px;
}

.catalog-result-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 10px;
}

.catalog-result-bar .ossd-message {
  flex: 1;
  margin: 0;
}

.catalog-result-bar > strong {
  color: var(--accent);
  white-space: nowrap;
}

.distributor-product-list {
  display: grid;
  gap: 8px;
}

.distributor-product-row {
  display: grid;
  grid-template-columns: minmax(260px, 1.7fr) minmax(150px, 0.9fr) 125px 150px 118px;
  gap: 12px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgb(255 255 255 / 3%);
}

.distributor-product-row:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
  background: rgb(255 255 255 / 5%);
}

.distributor-identity,
.distributor-specs,
.distributor-availability,
.distributor-pricing,
.distributor-buy {
  min-width: 0;
}

.distributor-identity small {
  display: block;
  margin: 7px 0 3px;
  color: var(--accent-2);
  font-weight: 900;
}

.distributor-identity h2 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.25;
}

.distributor-identity h2 a:hover {
  color: var(--accent);
}

.distributor-identity p {
  display: -webkit-box;
  margin: 7px 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.4;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.distribution-labels,
.part-numbers,
.technical-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.distribution-labels span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 7px;
  color: var(--muted);
  background: rgb(255 255 255 / 4%);
  font-size: 0.69rem;
  font-weight: 900;
}

.distribution-labels .lifecycle-active {
  border-color: rgb(47 184 126 / 42%);
  color: #9df2c7;
}

.part-numbers span {
  color: var(--muted);
  font-size: 0.74rem;
}

.part-numbers strong {
  color: var(--text);
}

.technical-links a {
  color: var(--accent);
  font-size: 0.76rem;
  font-weight: 800;
}

.distributor-specs {
  display: grid;
  gap: 5px;
  margin: 0;
}

.distributor-specs div {
  display: grid;
  grid-template-columns: minmax(60px, 0.8fr) minmax(0, 1fr);
  gap: 6px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 4px;
  font-size: 0.73rem;
}

.distributor-specs dt {
  color: var(--muted);
}

.distributor-specs dd {
  overflow: hidden;
  color: var(--text);
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.distributor-availability,
.distributor-pricing,
.distributor-buy {
  display: grid;
  align-content: start;
  gap: 7px;
}

.distributor-availability strong,
.distributor-pricing > strong {
  font-size: 0.95rem;
}

.distributor-availability small {
  color: var(--muted);
  font-size: 0.73rem;
  font-weight: 700;
}

.stock-ready {
  color: #9df2c7;
}

.stock-low {
  color: #ffd996;
}

.stock-out {
  color: #ffb2b2;
}

.distributor-pricing > strong {
  color: var(--accent);
}

.price-break-mini {
  display: grid;
  gap: 3px;
}

.price-break-mini span {
  display: flex;
  justify-content: space-between;
  gap: 5px;
  color: var(--muted);
  font-size: 0.7rem;
}

.price-break-mini strong {
  color: var(--text);
}

.distributor-buy input {
  min-height: 34px;
}

.distributor-buy .button,
.distributor-buy .small-button {
  width: 100%;
}

.bom-workspace,
.bom-input-panel,
.bom-match-list,
.quote-form,
.quote-guidance {
  display: grid;
  gap: 12px;
}

.bom-input-panel,
.quote-form,
.quote-guidance,
.datasheet-layout > article,
.datasheet-layout > aside {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 15px;
  background: rgb(255 255 255 / 3%);
}

textarea {
  min-width: 0;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px 12px;
  background: var(--field-bg);
  color: var(--text);
  font: inherit;
  line-height: 1.5;
  resize: vertical;
}

textarea:focus {
  border-color: var(--accent);
  outline: none;
}

.bom-input-panel small {
  color: var(--muted);
}

.bom-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.bom-summary-strip article {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: rgb(255 255 255 / 4%);
}

.bom-summary-strip span {
  display: block;
  color: var(--muted);
  font-size: 0.73rem;
  font-weight: 800;
}

.bom-summary-strip strong {
  display: block;
  margin-top: 5px;
  color: var(--accent);
  font-size: 1.1rem;
}

.bom-match-row {
  display: grid;
  grid-template-columns: 130px minmax(190px, 1.2fr) 88px 120px 110px 84px;
  gap: 10px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  background: rgb(255 255 255 / 3%);
}

.bom-match-row.unmatched {
  border-color: rgb(245 184 83 / 48%);
}

.bom-source-line strong,
.bom-source-line span,
.bom-match-product strong,
.bom-match-product span,
.bom-match-product small,
.bom-confidence strong,
.bom-confidence small,
.bom-supply strong,
.bom-supply small,
.bom-extended strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bom-source-line span,
.bom-match-product span,
.bom-match-product small,
.bom-confidence small,
.bom-supply small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.73rem;
}

.bom-confidence strong,
.bom-extended strong {
  margin-top: 5px;
  color: var(--accent);
}

.bom-alternatives {
  display: flex;
  grid-column: 2 / -1;
  flex-wrap: wrap;
  gap: 8px;
  border-top: 1px solid var(--line);
  padding-top: 8px;
}

.bom-alternatives > span,
.bom-alternatives small {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 800;
}

.bom-alternatives a {
  color: var(--accent);
  font-size: 0.74rem;
  font-weight: 800;
}

.quote-layout,
.datasheet-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 16px;
  align-items: start;
}

.quote-form,
.quote-guidance,
.datasheet-layout > article,
.datasheet-layout > aside {
  background: var(--panel);
  box-shadow: var(--shadow);
}

.quote-contact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.quote-guidance dl {
  display: grid;
  gap: 10px;
}

.quote-guidance dl div {
  border-bottom: 1px solid var(--line);
  padding-bottom: 9px;
}

.quote-guidance dd {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.4;
}

.datasheet-layout table,
.price-break-table {
  width: 100%;
  border-collapse: collapse;
}

.datasheet-layout th,
.datasheet-layout td,
.price-break-table th,
.price-break-table td {
  border-bottom: 1px solid var(--line);
  padding: 9px;
  text-align: left;
}

.datasheet-layout th,
.price-break-table th {
  color: var(--muted);
  font-size: 0.78rem;
}

.technical-resource-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.technical-resource-grid a {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: rgb(255 255 255 / 4%);
}

.technical-resource-grid strong,
.technical-resource-grid span {
  display: block;
}

.technical-resource-grid strong {
  color: var(--accent);
}

.technical-resource-grid span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.74rem;
}

.module-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 6px;
  background: rgb(4 10 16 / 44%);
  box-shadow: var(--shadow);
}

.module-tabs button,
.module-tabs a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 14px;
  background: var(--control-bg);
  color: var(--muted);
  cursor: pointer;
  font-size: 0.83rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

.module-tabs button.active,
.module-tabs a.active {
  border-color: var(--accent);
  background: linear-gradient(135deg, rgb(78 231 194 / 22%), rgb(111 183 255 / 12%));
  color: var(--text);
  box-shadow: var(--glow);
}

.shop-view {
  display: none;
}

.shop-view.active {
  display: grid;
}

.commerce-shell.shop-view.active {
  display: grid;
}

.commerce-main,
.commerce-side,
.merchant-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.commerce-main {
  padding: 14px;
}

.commerce-side {
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.commerce-side-inner {
  position: sticky;
  top: 86px;
  display: grid;
  gap: 14px;
}

.commerce-side .panel-block,
.commerce-side .checkout-form {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 14px;
}

.product-card,
.cart-item,
.order-card,
.product-detail-card {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgb(4 10 16 / 48%);
}

.product-card {
  grid-template-rows: auto 1fr auto auto;
  min-height: 348px;
}

.product-card:hover {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--line));
}

body.light .product-card,
body.light .cart-item,
body.light .order-card {
  background: rgb(255 255 255 / 70%);
}

.product-card h2 {
  margin-bottom: 6px;
  font-size: 1.02rem;
  line-height: 1.18;
}

.product-media {
  position: relative;
}

.product-media a {
  display: block;
  color: inherit;
}

.product-thumb {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgb(255 255 255 / 8%);
}

.product-thumb.placeholder {
  background: linear-gradient(135deg, rgb(78 231 194 / 18%), rgb(111 183 255 / 12%));
}

.product-badge {
  position: absolute;
  left: 8px;
  top: 8px;
  max-width: calc(100% - 16px);
  border: 1px solid rgb(255 255 255 / 20%);
  border-radius: 999px;
  padding: 4px 8px;
  background: rgb(4 10 16 / 72%);
  color: var(--text);
  font-size: 0.72rem;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  backdrop-filter: blur(12px);
}

.product-copy {
  min-width: 0;
}

.product-copy h2 a {
  color: inherit;
  text-decoration: none;
}

.product-copy h2 a:hover {
  color: var(--accent);
}

.product-card p {
  display: -webkit-box;
  min-height: 2.6em;
  margin-bottom: 0;
  overflow: hidden;
  color: var(--muted);
  line-height: 1.3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.product-card small,
.cart-item span,
.order-card span {
  color: var(--muted);
  font-weight: 800;
}

.product-meta {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}

.product-meta div {
  min-width: 0;
}

.product-meta dd {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.product-actions strong {
  color: var(--accent);
  font-size: 1.05rem;
  line-height: 1;
  white-space: nowrap;
}

.product-card-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.product-card-links a {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  color: var(--text);
  background: rgb(255 255 255 / 4%);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
}

.product-card-links a:hover {
  border-color: rgb(255 255 255 / 28%);
  color: var(--accent);
  background: rgb(255 255 255 / 8%);
}

.cart-list,
.order-list,
.checkout-form,
.product-form {
  display: grid;
  gap: 12px;
}

.checkout-form,
.merchant-panel {
  border-top: 1px solid var(--line);
  padding-top: 16px;
}

.commerce-side .checkout-form {
  border-top: 1px solid var(--line);
  margin: 0;
}

.merchant-panel {
  margin-top: 16px;
}

.merchant-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 14px;
}

.shop-monitor-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.product-detail-panel {
  display: grid;
  gap: 12px;
}

.detail-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 0.83rem;
  font-weight: 700;
}

.detail-breadcrumb a {
  color: var(--accent);
  text-decoration: none;
}

.detail-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.detail-chip,
.detail-status {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 11px;
  color: var(--text);
  background: rgb(255 255 255 / 6%);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
}

.detail-status.ok {
  border-color: rgb(47 184 126 / 42%);
  color: #9df2c7;
  background: rgb(47 184 126 / 12%);
}

.detail-status.warn {
  border-color: rgb(245 184 83 / 48%);
  color: #ffd996;
  background: rgb(245 184 83 / 12%);
}

.detail-status.critical {
  border-color: rgb(255 107 107 / 48%);
  color: #ffb2b2;
  background: rgb(255 107 107 / 12%);
}

.product-detail-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.1fr);
  gap: 18px;
}

.product-detail-layout.enterprise-detail {
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: linear-gradient(180deg, rgb(255 255 255 / 6%), rgb(255 255 255 / 3%));
}

.product-detail-media {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.product-detail-media img,
.product-detail-media .product-thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgb(255 255 255 / 8%);
}

.detail-media-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  color: var(--muted);
  background: rgb(0 0 0 / 10%);
  font-size: 0.82rem;
  font-weight: 700;
}

.product-detail-content {
  display: grid;
  align-content: start;
  gap: 14px;
  min-width: 0;
}

.detail-purchase-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: rgb(0 0 0 / 12%);
}

.detail-purchase-panel span,
.detail-kpi span,
.section-kicker {
  display: block;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.detail-price {
  display: block;
  margin-top: 6px;
  color: var(--accent);
  font-size: 1.8rem;
  line-height: 1;
}

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

.detail-kpi {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgb(255 255 255 / 4%);
}

.detail-kpi strong {
  display: block;
  margin-top: 8px;
  overflow: hidden;
  color: var(--text);
  font-size: 1.15rem;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-kpi small {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.detail-section {
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.product-detail-card h2 {
  margin-bottom: 8px;
  font-size: 1.4rem;
}

.detail-section h2 {
  margin: 4px 0 0;
  font-size: 1.18rem;
}

.product-detail-card p,
.product-detail-content p {
  color: var(--muted);
}

.detail-copy {
  max-width: 74ch;
  line-height: 1.7;
}

.detail-note-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  line-height: 1.55;
}

.product-detail-specs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.product-detail-specs div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: rgb(255 255 255 / 4%);
}

.product-detail-specs dd {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-detail-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
}

.product-detail-actions strong {
  color: var(--accent);
  font-size: 1.35rem;
  line-height: 1;
}

.product-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.product-form button {
  grid-column: 1 / -1;
}

.admin-only {
  display: none;
}

.is-verified .admin-only:not(.shop-view) {
  display: block;
}

.is-verified .admin-only.shop-view.active {
  display: grid;
}

.is-verified.merchant-panel,
.is-verified .merchant-panel {
  display: block;
}

.panel-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.bucket-tabs {
  display: grid;
  gap: 8px;
}

.bucket-tab {
  justify-content: space-between;
  width: 100%;
  gap: 10px;
  padding: 0 12px;
  color: var(--muted);
}

.bucket-tab.active {
  border-color: var(--accent);
  background:
    linear-gradient(90deg, rgb(78 231 194 / 22%), rgb(111 183 255 / 12%)),
    var(--panel);
  color: var(--text);
  box-shadow: inset 3px 0 0 var(--accent), var(--glow);
}

.bucket-tab small {
  color: var(--muted);
}

label {
  display: grid;
  gap: 8px;
  min-width: 0;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 800;
}

input,
select {
  min-height: 42px;
  min-width: 0;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: var(--field-bg);
  color: var(--text);
  outline: none;
}

input:focus,
select:focus {
  border-color: var(--accent);
}

.bucket-create,
.file-upload {
  display: grid;
  gap: 12px;
  border-top: 1px solid var(--line);
  padding-top: 16px;
}

.bucket-create {
  margin-bottom: 18px;
}

.file-picker input {
  padding: 8px;
}

.toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto minmax(0, 150px) minmax(0, 170px);
  gap: 10px;
  align-items: end;
  margin-bottom: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: rgb(255 255 255 / 4%);
}

.search-actions {
  display: flex;
  gap: 8px;
  min-width: 0;
}

.search-actions .button {
  min-width: 74px;
  white-space: nowrap;
}

.ossd-message {
  min-height: 20px;
  margin: 0 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: rgb(78 231 194 / 7%);
  color: var(--text);
  font-weight: 800;
}

.object-table {
  overflow-x: auto;
}

.object-row {
  display: grid;
  grid-template-columns: minmax(320px, 1.5fr) 92px 110px 132px 250px;
  gap: 12px;
  align-items: center;
  min-width: 940px;
  border-top: 1px solid var(--line);
  padding: 12px 0;
  color: var(--muted);
  transition:
    background 160ms ease,
    box-shadow 160ms ease;
}

.object-row:not(.object-head):hover {
  background: rgb(111 183 255 / 7%);
}

.object-row span:first-child {
  color: var(--text);
  overflow-wrap: anywhere;
}

.object-row.selected {
  background: linear-gradient(90deg, rgb(78 231 194 / 14%), rgb(111 183 255 / 8%));
  box-shadow: inset 3px 0 0 var(--accent);
}

.object-head {
  border-top: 0;
  color: var(--text);
  font-weight: 900;
  position: sticky;
  top: 0;
  z-index: 1;
  background: color-mix(in srgb, var(--panel) 92%, #000);
}

.type-pill {
  display: inline-flex;
  border-radius: 999px;
  padding: 4px 8px;
  border: 1px solid rgb(111 183 255 / 24%);
  background: rgb(111 183 255 / 10%);
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 900;
}

.bucket-chip {
  display: inline-flex;
  max-width: 160px;
  margin-right: 8px;
  border: 1px solid rgb(78 231 194 / 28%);
  border-radius: 999px;
  padding: 3px 7px;
  background: rgb(78 231 194 / 10%);
  color: var(--accent);
  font-size: 0.72rem;
  font-weight: 900;
  vertical-align: middle;
  overflow-wrap: anywhere;
}

.object-actions {
  flex-wrap: wrap;
  gap: 8px;
}

.object-actions button {
  padding: 0 10px;
}

.object-delete {
  color: var(--danger);
}

.empty-state {
  padding: 18px 0;
  color: var(--muted);
  font-weight: 800;
}

.empty-state.compact {
  padding: 8px 0;
}

dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

dl div {
  border-top: 1px solid var(--line);
  padding-top: 10px;
  background: linear-gradient(90deg, rgb(255 255 255 / 3%), transparent);
}

dt {
  color: var(--muted);
  font-weight: 800;
}

dd {
  margin: 4px 0 0;
  overflow-wrap: anywhere;
}

.audit-list {
  display: grid;
  gap: 10px;
  max-height: 360px;
  overflow: auto;
}

.audit-list article,
.es-result {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: rgb(4 10 16 / 52%);
}

.audit-list strong,
.audit-list span,
.audit-list time {
  display: block;
}

.audit-list strong {
  color: var(--accent);
}

.audit-list span,
.audit-list time {
  color: var(--muted);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.es-panel {
  background:
    linear-gradient(135deg, rgb(78 231 194 / 10%), rgb(111 183 255 / 7%)),
    transparent;
}

.es-results {
  display: grid;
  gap: 10px;
  max-height: 320px;
  overflow: auto;
}

.es-result {
  display: grid;
  gap: 8px;
}

.es-result strong {
  color: var(--text);
  overflow-wrap: anywhere;
}

.es-result span {
  color: var(--muted);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.auth-dialog {
  width: min(420px, calc(100% - 32px));
  padding: 0;
  color: var(--text);
}

.auth-dialog::backdrop,
.file-dialog::backdrop {
  background: rgb(0 0 0 / 62%);
}

.auth-dialog form {
  display: grid;
  gap: 16px;
  padding: 22px;
}

.dialog-head,
.file-dialog-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 18px;
}

.auth-error {
  min-height: 20px;
  margin: 0;
  color: var(--danger);
  font-weight: 800;
}

.full-width {
  width: 100%;
}

.file-dialog {
  width: min(960px, calc(100% - 32px));
  height: min(760px, calc(100vh - 32px));
  padding: 0;
  color: var(--text);
}

.file-dialog-head {
  border-bottom: 1px solid var(--line);
  padding: 18px;
}

.file-dialog h2 {
  max-width: 760px;
  margin-bottom: 0;
  overflow-wrap: anywhere;
}

.file-dialog iframe {
  width: 100%;
  height: calc(100% - 96px);
  border: 0;
  background: #fff;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

body.cad-marketplace-page {
  color-scheme: light;
  --bg: #f4f6f8;
  --panel: #ffffff;
  --panel-strong: #eef2f5;
  --text: #17232d;
  --muted: #667682;
  --line: #d4dce2;
  --accent: #e6532f;
  --accent-2: #1674b8;
  --danger: #c73b45;
  --warning: #b36a16;
  --shadow: 0 8px 24px rgb(31 48 60 / 9%);
  --glow: 0 0 0 3px rgb(230 83 47 / 12%);
  --topbar-bg: #ffffff;
  --control-bg: #ffffff;
  --field-bg: #ffffff;
  background: #f4f6f8;
  color: var(--text);
}

.cad-marketplace-page .topbar {
  min-height: 62px;
  border-bottom-color: #d5dde3;
  padding: 0 22px;
  background: #fff;
  box-shadow: 0 2px 10px rgb(31 48 60 / 8%);
  backdrop-filter: none;
}

.cad-marketplace-page .brand {
  color: #1e2b34;
  font-size: 1.04rem;
}

.cad-marketplace-page .brand strong {
  color: var(--accent);
}

.cad-marketplace-page .brand-mark {
  width: 32px;
  height: 32px;
  border-radius: 4px;
  background: #263d4c;
  color: #fff;
  box-shadow: none;
}

.cad-marketplace-page .topnav {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
}

.cad-marketplace-page .topnav a {
  border-radius: 3px;
  color: #50616c;
  font-weight: 650;
}

.cad-marketplace-page .topnav a:hover {
  background: #edf2f5;
  color: #17232d;
}

.header-project-link {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  border: 1px solid #c7d1d8;
  border-radius: 4px;
  padding: 0 12px;
  background: #f7f9fa;
  color: #273945;
  font-size: 0.8rem;
  font-weight: 800;
  white-space: nowrap;
}

.cad-marketplace-page main {
  width: min(1600px, calc(100% - 28px));
  padding: 18px 0 40px;
}

.cad-marketplace-page h1 {
  margin: 0;
  color: #15232c;
  font-size: 2rem;
  line-height: 1.16;
  text-shadow: none;
}

.cad-marketplace-page .button,
.cad-marketplace-page .small-button {
  border-radius: 4px;
  box-shadow: none;
}

.cad-marketplace-page .button.primary {
  border-color: #d94926;
  background: #e6532f;
  color: #fff;
  box-shadow: none;
}

.cad-marketplace-page .button.secondary,
.cad-marketplace-page .small-button {
  background: #fff;
  color: #263945;
}

.cad-marketplace-page input,
.cad-marketplace-page select,
.cad-marketplace-page textarea {
  border-radius: 4px;
  background: #fff;
  color: #17232d;
}

.cad-search-hero {
  border-bottom: 1px solid #cad4db;
  padding: 18px 10px 0;
  background: #f4f6f8;
}

.cad-search-title {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin: 0 auto 15px;
  max-width: 1180px;
}

.cad-search-title p {
  order: 2;
  margin: 0 0 4px;
  color: #667682;
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.cad-search-title h1 {
  max-width: 790px;
}

.cad-global-search {
  display: grid;
  grid-template-columns: 230px minmax(280px, 1fr) 110px;
  gap: 0;
  max-width: 1180px;
  margin: 0 auto;
  border: 1px solid #aebbc4;
  background: #fff;
  box-shadow: 0 4px 14px rgb(31 48 60 / 10%);
}

.cad-global-search label {
  gap: 0;
}

.cad-global-search label > span:not(.sr-only) {
  padding: 7px 12px 0;
  color: #6f7d86;
  font-size: 0.66rem;
  text-transform: uppercase;
}

.cad-global-search input,
.cad-global-search select {
  min-height: 52px;
  border: 0;
  border-radius: 0;
}

.cad-global-search .cad-search-manufacturer {
  border-right: 1px solid #d7dfe4;
}

.cad-global-search .button {
  min-height: 66px;
  border: 0;
  border-radius: 0;
  font-size: 0.92rem;
}

.cad-search-modes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 1180px;
  margin: 15px auto 0;
}

.cad-search-modes a {
  min-width: 0;
  border-bottom: 3px solid transparent;
  padding: 12px 14px 11px;
  color: #5e6d77;
}

.cad-search-modes a:hover,
.cad-search-modes a.active {
  border-bottom-color: var(--accent);
  background: #fff;
  color: #17232d;
}

.cad-search-modes strong,
.cad-search-modes span {
  display: block;
}

.cad-search-modes strong {
  font-size: 0.86rem;
}

.cad-search-modes span {
  margin-top: 3px;
  color: #7a8891;
  font-size: 0.7rem;
}

.cad-platform-strip {
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 44px;
  border-bottom: 1px solid #d4dce2;
  padding: 0 12px;
  background: #fff;
  color: #62727c;
  font-size: 0.76rem;
}

.cad-platform-strip strong {
  color: #263945;
}

.cad-platform-strip a {
  margin-left: auto;
  color: #176fae;
  font-weight: 800;
}

.cad-browser-shell {
  display: grid;
  grid-template-columns: 238px minmax(0, 1fr) 350px;
  gap: 12px;
  align-items: start;
  margin-top: 12px;
}

.cad-filter-sidebar,
.cad-preview-sidebar {
  position: sticky;
  top: 76px;
}

.cad-filter-sidebar {
  border: 1px solid #d3dce2;
  background: #fff;
}

.cad-filter-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid #d8e0e5;
  padding: 13px;
}

.cad-filter-heading span,
.cad-result-toolbar span,
.cad-preview-toolbar span,
.cad-project-panel > div span,
.section-title span,
.cad-download-box > div span {
  display: block;
  color: #73818a;
  font-size: 0.68rem;
  font-weight: 850;
  text-transform: uppercase;
}

.cad-filter-heading h2 {
  margin: 4px 0 0;
  color: #21343f;
  font-size: 0.9rem;
}

.cad-filter-heading a {
  color: #1772b4;
  font-size: 0.72rem;
  font-weight: 800;
}

.cad-filter-sidebar > p {
  margin: 0;
  border-bottom: 1px solid #e0e6ea;
  padding: 11px 13px;
  color: #6a7a84;
  font-size: 0.75rem;
  line-height: 1.45;
}

.cad-filter-sidebar > form {
  display: grid;
  gap: 11px;
  padding: 13px;
}

.cad-filter-sidebar label {
  gap: 5px;
  color: #596a75;
  font-size: 0.74rem;
}

.cad-filter-sidebar select {
  min-height: 36px;
  font-size: 0.76rem;
}

.cad-system-links {
  display: grid;
  border-top: 1px solid #d7dfe4;
}

.cad-system-links a {
  border-bottom: 1px solid #e1e6e9;
  padding: 10px 13px;
  color: #276b98;
  font-size: 0.75rem;
  font-weight: 750;
}

.cad-result-panel {
  min-width: 0;
  border: 1px solid #d3dce2;
  background: #fff;
}

.cad-result-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 54px;
  border-bottom: 1px solid #d3dce2;
  padding: 0 14px;
}

.cad-result-toolbar strong {
  display: block;
  margin-top: 2px;
  font-size: 0.95rem;
}

.cad-result-toolbar p {
  margin: 0;
  color: #6a7a84;
  font-size: 0.74rem;
  text-align: right;
}

.cad-result-list {
  display: grid;
}

.cad-result-row {
  display: grid;
  grid-template-columns: 146px minmax(250px, 1fr) 128px 124px;
  gap: 14px;
  align-items: center;
  min-width: 0;
  border-bottom: 1px solid #dce3e7;
  padding: 12px;
  background: #fff;
}

.cad-result-row:last-child {
  border-bottom: 0;
}

.cad-result-row:hover {
  background: #f7f9fa;
}

.cad-part-thumbnail {
  display: block;
  width: 146px;
  height: 116px;
  border: 1px solid #d7dfe4;
  background: #f7f9fb;
}

.cad-part-thumbnail [data-cad-viewer],
.cad-part-thumbnail canvas {
  width: 100%;
  height: 100%;
}

.cad-result-copy {
  min-width: 0;
}

.cad-result-meta,
.cad-part-brand {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  color: #5e707b;
  font-size: 0.7rem;
  font-weight: 780;
}

.cad-verified {
  border: 1px solid #9bc8ae;
  border-radius: 3px;
  padding: 2px 5px;
  background: #edf8f1;
  color: #277148;
  font-size: 0.64rem;
  font-weight: 850;
}

.cad-result-copy h2 {
  margin: 5px 0 3px;
  font-size: 0.95rem;
  line-height: 1.28;
}

.cad-result-copy h2 a:hover {
  color: #d84b29;
}

.cad-part-number {
  margin: 0;
  color: #52636d;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.72rem;
  overflow-wrap: anywhere;
}

.cad-result-attributes {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 16px;
  margin-top: 9px;
}

.cad-result-attributes span {
  display: grid;
  gap: 1px;
}

.cad-result-attributes small {
  color: #7a8992;
  font-size: 0.62rem;
}

.cad-result-attributes strong {
  color: #334650;
  font-size: 0.7rem;
}

.cad-format-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}

.cad-format-row span {
  border: 1px solid #ccd7de;
  border-radius: 3px;
  padding: 2px 5px;
  color: #5e6f79;
  background: #f5f7f8;
  font-size: 0.61rem;
  font-weight: 820;
}

.cad-result-supply,
.cad-result-actions {
  display: grid;
  gap: 6px;
  align-content: center;
}

.cad-result-supply span {
  color: #78868e;
  font-size: 0.67rem;
}

.cad-result-supply strong {
  color: #26704a;
  font-size: 0.86rem;
}

.cad-result-supply small {
  color: #667781;
  font-size: 0.66rem;
  line-height: 1.35;
}

.cad-result-actions .button,
.cad-result-actions .small-button {
  width: 100%;
  min-height: 32px;
  padding: 0 8px;
  font-size: 0.72rem;
}

.project-saved {
  display: block;
  padding: 5px 0;
  color: #277148;
  font-size: 0.69rem;
  font-weight: 850;
  text-align: center;
}

.cad-preview-sidebar {
  display: grid;
  gap: 12px;
}

.cad-preview-stage,
.cad-project-panel {
  border: 1px solid #d3dce2;
  background: #fff;
}

.cad-preview-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  border-bottom: 1px solid #d8e0e5;
  padding: 0 11px;
}

.cad-preview-toolbar button,
.cad-detail-viewer-toolbar button,
.cad-project-panel form button {
  border: 0;
  padding: 4px;
  background: transparent;
  color: #216fa3;
  cursor: pointer;
  font: inherit;
  font-size: 0.7rem;
  font-weight: 800;
}

#cadQuickViewer {
  width: 100%;
  height: 330px;
  border-bottom: 1px solid #d7dfe4;
  background: #f1f4f6;
  touch-action: none;
}

#cadQuickViewer canvas,
.cad-detail-viewer canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.cad-preview-info {
  padding: 14px;
}

.cad-preview-info small {
  color: #657680;
  font-weight: 750;
}

.cad-preview-info h2 {
  margin: 5px 0;
  font-size: 0.98rem;
}

.cad-preview-info p {
  margin-bottom: 12px;
}

.cad-project-panel > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #d8e0e5;
  padding: 11px;
}

.cad-project-panel ul {
  display: grid;
  max-height: 180px;
  margin: 0;
  padding: 0;
  overflow: auto;
  list-style: none;
}

.cad-project-panel li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 1px solid #e2e7ea;
  padding: 8px 11px;
  font-size: 0.7rem;
}

.cad-project-panel li a {
  min-width: 0;
  overflow: hidden;
  color: #2a526d;
  font-weight: 750;
  text-overflow: ellipsis;
}

.cad-project-panel .project-empty {
  color: #7a8992;
}

.cad-project-panel > a {
  display: block;
  padding: 10px 11px;
  color: #176fae;
  font-size: 0.72rem;
  font-weight: 800;
}

.cad-detail-header,
.cad-detail-tabs {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.cad-detail-header {
  min-height: 42px;
  border-bottom: 1px solid #d4dce2;
  padding: 0 4px;
}

.cad-detail-header-actions {
  display: flex;
  gap: 14px;
  color: #246e9f;
  font-size: 0.74rem;
  font-weight: 760;
}

.cad-detail-tabs {
  justify-content: flex-start;
  min-height: 46px;
  border-bottom: 1px solid #cfd9df;
  background: #fff;
}

.cad-detail-tabs a {
  align-self: stretch;
  display: inline-flex;
  align-items: center;
  border-bottom: 3px solid transparent;
  padding: 0 18px;
  color: #5f707a;
  font-size: 0.78rem;
  font-weight: 760;
}

.cad-detail-tabs a.active,
.cad-detail-tabs a:hover {
  border-bottom-color: var(--accent);
  color: #17232d;
}

.cad-detail-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(330px, 0.7fr);
  min-height: 650px;
  border-bottom: 1px solid #ced8de;
  background: #fff;
}

.cad-detail-viewer-pane {
  position: relative;
  min-width: 0;
  background: #eef2f4;
}

.cad-detail-viewer-toolbar {
  position: absolute;
  z-index: 2;
  top: 14px;
  right: 14px;
  left: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  pointer-events: none;
}

.cad-detail-viewer-toolbar > div {
  display: grid;
  gap: 2px;
}

.cad-detail-viewer-toolbar span,
.cad-detail-viewer-toolbar strong {
  color: #4c606d;
  font-size: 0.7rem;
}

.cad-detail-viewer-toolbar button {
  pointer-events: auto;
}

.cad-detail-viewer {
  width: 100%;
  height: 100%;
  min-height: 650px;
  background: #eef2f4;
  cursor: grab;
  touch-action: none;
}

.cad-detail-viewer:active {
  cursor: grabbing;
}

.cad-axis-labels {
  position: absolute;
  right: 18px;
  bottom: 18px;
  display: flex;
  gap: 5px;
}

.cad-axis-labels span {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border: 1px solid #bcc8d0;
  background: #fff;
  color: #526572;
  font-size: 0.65rem;
  font-weight: 900;
}

.cad-config-panel {
  min-width: 0;
  border-left: 1px solid #ccd6dc;
  padding: 24px;
  background: #fff;
}

.cad-config-panel h1 {
  margin: 9px 0 7px;
  font-size: 1.45rem;
  overflow-wrap: anywhere;
}

.cad-detail-description {
  margin: 18px 0;
  color: #5c6d77;
  font-size: 0.82rem;
  line-height: 1.55;
}

.cad-config-summary {
  display: grid;
  margin: 0;
  border-top: 1px solid #d9e0e4;
}

.cad-config-summary div {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 12px;
  border-bottom: 1px solid #e0e6e9;
  padding: 9px 0;
  font-size: 0.75rem;
}

.cad-config-summary dt {
  color: #72808a;
}

.cad-config-summary dd {
  margin: 0;
  color: #263945;
  font-weight: 780;
}

.cad-download-box {
  margin-top: 20px;
  border: 1px solid #cbd6dc;
  padding: 14px;
  background: #f7f9fa;
}

.cad-download-box > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.cad-download-box > div strong {
  font-size: 0.76rem;
}

.cad-download-box form {
  display: grid;
  gap: 10px;
}

.cad-download-box label {
  gap: 5px;
  font-size: 0.72rem;
}

.cad-detail-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 12px;
}

.cad-detail-actions form,
.cad-detail-actions .button {
  width: 100%;
}

.cad-detail-status {
  margin: 14px 0 0;
  color: #667782;
  font-size: 0.7rem;
}

.cad-detail-data-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(260px, 0.72fr) minmax(260px, 0.8fr);
  gap: 12px;
  margin-top: 12px;
}

.cad-detail-data-grid > article {
  min-width: 0;
  border: 1px solid #d1dbe1;
  padding: 16px;
  background: #fff;
}

.section-title h2 {
  margin: 3px 0 12px;
  color: #263945;
  font-size: 0.96rem;
}

.cad-detail-data-grid table {
  width: 100%;
  border-collapse: collapse;
}

.cad-detail-data-grid th,
.cad-detail-data-grid td {
  border-bottom: 1px solid #e0e6e9;
  padding: 8px 6px;
  font-size: 0.73rem;
  text-align: left;
}

.cad-detail-data-grid th {
  width: 38%;
  color: #6c7b84;
  font-weight: 650;
}

.cad-detail-data-grid td {
  color: #263945;
  font-weight: 760;
}

.cad-detail-data-grid dl {
  display: grid;
  gap: 8px;
  margin: 0 0 14px;
}

.cad-detail-data-grid dl div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #e0e6e9;
  padding-bottom: 8px;
  font-size: 0.72rem;
}

.cad-detail-data-grid dt {
  color: #6c7b84;
}

.cad-detail-data-grid dd {
  margin: 0;
  font-weight: 800;
}

.cad-detail-data-grid .button {
  width: 100%;
  margin-top: 7px;
}

.cad-related-list {
  display: grid;
}

.cad-related-list a {
  display: grid;
  gap: 2px;
  border-bottom: 1px solid #e0e6e9;
  padding: 9px 0;
}

.cad-related-list span,
.cad-related-list small {
  color: #73818a;
  font-size: 0.65rem;
}

.cad-related-list strong {
  color: #275876;
  font-size: 0.75rem;
}

.cad-detail-not-found {
  display: grid;
  justify-items: start;
  gap: 14px;
  padding: 80px 20px;
}

.cad-viewer-unavailable {
  display: grid;
  place-items: center;
  color: #6b7b85;
  font-size: 0.75rem;
}

.cad-viewer-fallback {
  display: grid;
  justify-items: center;
  gap: 8px;
  text-align: center;
}

.cad-viewer-fallback button {
  min-height: 30px;
  border: 1px solid #b9c3cc;
  border-radius: 3px;
  padding: 4px 13px;
  background: #ffffff;
  color: #174f9c;
  cursor: pointer;
  font: 700 12px/1.2 Arial, "Microsoft YaHei", sans-serif;
}

.cad-viewer-host.is-context-lost::after {
  position: absolute;
  z-index: 7;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgb(247 249 251 / 92%);
  color: #5c6975;
  content: "正在恢复 3D 预览";
  font: 700 12px/1.4 Arial, "Microsoft YaHei", sans-serif;
}

@media (max-width: 1250px) {
  .cad-browser-shell {
    grid-template-columns: 220px minmax(0, 1fr);
  }

  .cad-preview-sidebar {
    position: static;
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) 320px;
  }

  #cadQuickViewer {
    height: 360px;
  }

  .cad-result-row {
    grid-template-columns: 132px minmax(230px, 1fr) 118px 116px;
  }

  .cad-part-thumbnail {
    width: 132px;
    height: 108px;
  }
}

@media (max-width: 900px) {
  .cad-global-search {
    grid-template-columns: 190px minmax(0, 1fr) 96px;
  }

  .cad-browser-shell,
  .cad-detail-workspace,
  .cad-detail-data-grid {
    grid-template-columns: 1fr;
  }

  .cad-filter-sidebar {
    position: static;
  }

  .cad-filter-sidebar > form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cad-filter-sidebar > form .button {
    grid-column: 1 / -1;
  }

  .cad-preview-sidebar {
    grid-column: auto;
  }

  .cad-result-row {
    grid-template-columns: 132px minmax(0, 1fr);
  }

  .cad-result-supply,
  .cad-result-actions {
    grid-column: 1 / -1;
  }

  .cad-result-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cad-result-actions form {
    min-width: 0;
  }

  .cad-detail-viewer,
  .cad-detail-workspace {
    min-height: 500px;
  }

  .cad-config-panel {
    border-top: 1px solid #ccd6dc;
    border-left: 0;
  }
}

@media (max-width: 620px) {
  .cad-marketplace-page main {
    width: calc(100% - 16px);
  }

  .cad-search-title {
    align-items: start;
    flex-direction: column;
  }

  .cad-search-title p {
    order: 0;
  }

  .cad-marketplace-page h1 {
    font-size: 1.5rem;
  }

  .cad-global-search {
    grid-template-columns: 1fr;
  }

  .cad-global-search .cad-search-manufacturer {
    border-right: 0;
    border-bottom: 1px solid #d7dfe4;
  }

  .cad-global-search .button {
    min-height: 44px;
  }

  .cad-search-modes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cad-platform-strip {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
    padding: 10px 12px;
  }

  .cad-platform-strip a {
    margin-left: 0;
  }

  .cad-filter-sidebar > form,
  .cad-preview-sidebar {
    grid-template-columns: 1fr;
  }

  .cad-result-toolbar {
    align-items: flex-start;
    flex-direction: column;
    padding: 10px 12px;
  }

  .cad-result-toolbar p {
    text-align: left;
  }

  .cad-result-row {
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 10px;
  }

  .cad-part-thumbnail {
    width: 104px;
    height: 96px;
  }

  .cad-result-supply,
  .cad-result-actions {
    grid-column: 1 / -1;
  }

  .cad-result-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cad-result-actions form {
    grid-column: 1 / -1;
  }

  #cadQuickViewer {
    height: 300px;
  }

  .cad-detail-header,
  .cad-detail-tabs,
  .cad-detail-header-actions {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .cad-detail-tabs a {
    min-height: 42px;
    padding: 0 9px;
  }

  .cad-detail-viewer,
  .cad-detail-workspace {
    min-height: 390px;
  }

  .cad-config-panel {
    padding: 17px;
  }

  .cad-detail-actions {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1100px) {
  .app-shell,
  .metrics,
  .es-admin-grid,
  .es-ops-grid,
  .engineering-shell,
  .project-form-grid,
  .engineering-upload,
  .nas-shell,
  .nas-folder-grid,
  .nas-snapshot-grid,
  .backup-policy-grid,
  .pdm-shell,
  .pdm-upload,
  .pdm-state-grid,
  .pdm-local-sync-grid,
  .pdm-synology-grid,
  .agent-flow,
  .standard-agent-shell,
  .agent-input-grid,
  .agent-output-grid,
  .agent-result-card dl,
  .agent-check-grid,
  .agent-roadmap,
  .commerce-shell,
  .distributor-shell,
  .quote-layout,
  .datasheet-layout,
  .merchant-grid,
  .product-detail-layout,
  .product-form {
    grid-template-columns: 1fr;
  }

  .product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .toolbar {
    grid-template-columns: 1fr;
  }

  .search-actions {
    width: 100%;
  }

  .search-actions .button {
    flex: 1;
  }

  .page-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .commerce-side-inner {
    position: static;
  }

  .distributor-filter-panel {
    position: static;
  }

  .parametric-filter {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .parametric-filter .panel-title,
  .parametric-filter .full-width {
    grid-column: 1 / -1;
  }

  .distributor-product-row {
    grid-template-columns: minmax(240px, 1.4fr) minmax(160px, 0.8fr) 130px;
  }

  .distributor-pricing,
  .distributor-buy {
    border-top: 1px solid var(--line);
    padding-top: 9px;
  }

  .bom-match-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .bom-alternatives {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .topbar {
    align-items: flex-start;
    flex-direction: column;
    padding: 14px 18px;
  }

  .header-actions,
  .page-actions {
    flex-wrap: wrap;
    width: 100%;
  }

  .topnav {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border-radius: 8px;
    scrollbar-width: thin;
  }

  .topnav a {
    flex: 0 0 auto;
  }

  .page-actions .button,
  .auth-button,
  .auth-status,
  .language-switch {
    flex: 1;
  }

  main {
    width: min(100% - 20px, 1440px);
    padding-top: 14px;
  }

  .metrics strong {
    font-size: 1.45rem;
  }

  .module-tabs {
    gap: 6px;
  }

  .module-tabs a,
  .module-tabs button {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0 10px;
  }

  .product-grid {
    grid-template-columns: 1fr;
  }

  .distribution-metrics,
  .parametric-filter,
  .bom-summary-strip,
  .quote-contact-grid,
  .technical-resource-grid,
  .distributor-product-row,
  .bom-match-row {
    grid-template-columns: 1fr;
  }

  .distributor-specs,
  .distributor-availability,
  .distributor-pricing,
  .distributor-buy {
    border-top: 1px solid var(--line);
    padding-top: 9px;
  }

  .bom-alternatives {
    grid-column: 1;
  }

  .product-card {
    min-height: auto;
  }

  .product-detail-layout.enterprise-detail {
    padding: 12px;
  }

  .detail-purchase-panel {
    align-items: stretch;
    flex-direction: column;
  }

  .detail-kpis {
    grid-template-columns: 1fr;
  }

  .product-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .product-actions .button {
    width: 100%;
  }

  .product-detail-specs {
    grid-template-columns: 1fr;
  }

  .product-detail-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .commerce-main,
  .commerce-side .panel-block,
  .commerce-side .checkout-form {
    padding: 12px;
  }
}

/* Shared enterprise workspace rail */
.header-actions {
  min-width: 0;
}

.platform-skip-link {
  position: fixed;
  z-index: 1000;
  top: 8px;
  left: 8px;
  transform: translateY(-150%);
  border-radius: 6px;
  padding: 9px 12px;
  background: var(--text);
  color: var(--bg);
  font-size: 0.8rem;
  font-weight: 800;
}

.platform-skip-link:focus {
  transform: translateY(0);
}

.topnav {
  max-width: min(720px, 52vw);
  overflow-x: auto;
  scrollbar-width: none;
}

.topnav::-webkit-scrollbar {
  display: none;
}

.topnav a.is-active {
  background: color-mix(in srgb, var(--accent-2) 18%, transparent);
  color: var(--text);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-2) 38%, transparent);
}

.platform-command-bar {
  display: grid;
  grid-template-columns: minmax(145px, 0.75fr) minmax(360px, 2fr) minmax(300px, 1.25fr);
  align-items: center;
  gap: 18px;
  min-height: 54px;
  margin-bottom: 18px;
  border-block: 1px solid var(--line);
  padding: 8px 2px;
  color: var(--muted);
}

.platform-context,
.platform-services,
.platform-operations {
  display: flex;
  align-items: center;
  min-width: 0;
}

.platform-context {
  gap: 8px;
  white-space: nowrap;
}

.platform-context span {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
}

.platform-context strong {
  color: var(--text);
  font-size: 0.84rem;
}

.platform-services {
  gap: 7px;
  overflow-x: auto;
  scrollbar-width: none;
}

.platform-services::-webkit-scrollbar {
  display: none;
}

.platform-service,
.platform-environment,
.platform-readiness {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 8px;
  background: color-mix(in srgb, var(--panel) 72%, transparent);
  font-size: 0.72rem;
  font-weight: 750;
  white-space: nowrap;
}

.platform-service {
  gap: 6px;
}

.platform-service i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--warning);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--warning) 14%, transparent);
}

.platform-service.is-online i {
  background: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}

.platform-service.is-offline i {
  background: var(--danger);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 14%, transparent);
}

.platform-operations {
  justify-content: flex-end;
  gap: 8px;
  font-size: 0.74rem;
  font-weight: 700;
  white-space: nowrap;
}

.platform-environment {
  color: var(--warning);
}

.platform-environment.is-production,
.platform-readiness.is-ready {
  color: var(--accent);
}

@media (max-width: 1380px) {
  .topbar {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    padding-block: 10px;
  }

  .header-actions,
  .topnav {
    width: 100%;
    max-width: 100%;
  }

  .platform-command-bar {
    grid-template-columns: minmax(140px, 0.7fr) minmax(340px, 2fr);
  }

  .platform-operations {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  .platform-command-bar {
    grid-template-columns: 1fr;
    gap: 8px;
    padding-block: 10px;
  }

  .platform-context,
  .platform-operations {
    overflow-x: auto;
  }

  .platform-operations {
    grid-column: auto;
    justify-content: flex-start;
  }

  .platform-services {
    margin-inline: -2px;
    padding: 2px;
  }

  .pdm-revision-card,
  .pdm-search-card {
    align-items: stretch;
    flex-direction: column;
  }

  .pdm-revision-actions {
    justify-content: flex-end;
  }
}

.operations-metrics {
  margin-bottom: 18px;
}

.operations-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 18px;
}

.operations-column {
  display: grid;
  align-content: start;
  gap: 18px;
  min-width: 0;
}

.operations-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background: var(--panel);
  box-shadow: 0 14px 34px rgb(0 0 0 / 14%);
}

.operations-check-list {
  display: grid;
  gap: 2px;
  margin-top: 14px;
}

.operations-runtime-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 14px 0 0;
  background: var(--line);
}

.operations-runtime-list div {
  display: grid;
  gap: 5px;
  min-height: 70px;
  align-content: center;
  padding: 12px;
  background: var(--panel);
}

.operations-runtime-list dt {
  color: var(--muted);
  font-size: 0.7rem;
  text-transform: uppercase;
}

.operations-runtime-list dd {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.operations-check {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 54px;
  border-top: 1px solid var(--line);
  padding: 9px 2px;
}

.operations-check:first-child {
  border-top: 0;
}

.operations-check-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--danger);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger) 12%, transparent);
}

.operations-check.is-ok .operations-check-dot {
  background: var(--accent);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent);
}

.operations-check div {
  display: grid;
  gap: 3px;
}

.operations-check strong {
  font-size: 0.84rem;
}

.operations-check div span,
.operations-message,
.operations-table td span {
  color: var(--muted);
  font-size: 0.74rem;
}

.quote-register {
  margin-bottom: 40px;
}

.operations-table-wrap {
  overflow-x: auto;
  margin-top: 14px;
}

.operations-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.operations-table th,
.operations-table td {
  border-bottom: 1px solid var(--line);
  padding: 11px 10px;
  text-align: left;
  vertical-align: top;
}

.operations-table th {
  color: var(--muted);
  font-size: 0.7rem;
  text-transform: uppercase;
}

.operations-table td strong,
.operations-table td span {
  display: block;
}

.operations-parts {
  max-width: 340px;
  white-space: pre-line;
}

.status-pill {
  display: inline-flex !important;
  min-height: 26px;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--accent-2) 35%, var(--line));
  border-radius: 6px;
  padding: 0 8px;
  color: var(--accent-2) !important;
  font-weight: 800;
  text-transform: capitalize;
}

.button.is-disabled {
  opacity: 0.45;
}

@media (max-width: 900px) {
  .operations-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .operations-runtime-list {
    grid-template-columns: 1fr;
  }
}

/* PDM knowledge workspace */
body.pdm-notion-page {
  --pdm-canvas: #ffffff;
  --pdm-sidebar: #f7f7f5;
  --pdm-inspector: #fafafa;
  --pdm-text: #272727;
  --pdm-muted: #787774;
  --pdm-line: #e8e8e5;
  --pdm-hover: #efefed;
  --pdm-selected: #e8f1ff;
  --pdm-blue: #246bce;
  --pdm-green: #2f7d4a;
  --pdm-orange: #a96016;
  --pdm-red: #b33a3a;
  background: var(--pdm-canvas);
  color: var(--pdm-text);
  font-family: Inter, ui-sans-serif, system-ui, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

body.pdm-notion-page:not(.light) {
  --pdm-canvas: #191919;
  --pdm-sidebar: #202020;
  --pdm-inspector: #1d1d1d;
  --pdm-text: #ededed;
  --pdm-muted: #a7a7a7;
  --pdm-line: #343434;
  --pdm-hover: #2b2b2b;
  --pdm-selected: #243b58;
  --pdm-blue: #6aa9ff;
  --pdm-green: #72bd87;
  --pdm-orange: #e0a260;
  --pdm-red: #e57d7d;
}

.pdm-notion-page .topbar {
  min-height: 58px;
  border-color: var(--pdm-line);
  background: color-mix(in srgb, var(--pdm-canvas) 94%, transparent);
  box-shadow: none;
}

.pdm-notion-page .brand-mark {
  background: var(--pdm-text);
  color: var(--pdm-canvas);
  box-shadow: none;
}

.pdm-notion-page .topnav,
.pdm-notion-page .language-switch,
.pdm-notion-page .auth-status,
.pdm-notion-page .auth-button,
.pdm-notion-page .icon-button {
  border-color: var(--pdm-line);
  background: var(--pdm-canvas);
  color: var(--pdm-text);
  box-shadow: none;
}

.pdm-notion-page .topnav a {
  color: var(--pdm-muted);
}

.pdm-notion-page .topnav a.is-active {
  background: var(--pdm-hover);
  color: var(--pdm-text);
  box-shadow: none;
}

main.pdm-notion-app {
  width: 100%;
  margin: 0;
  padding: 0;
  background: var(--pdm-canvas);
}

.pdm-notion-app .platform-command-bar {
  min-height: 44px;
  margin: 0;
  border-top: 0;
  border-color: var(--pdm-line);
  padding: 7px 22px;
  color: var(--pdm-muted);
  background: var(--pdm-canvas);
}

.pdm-notion-app .platform-context strong,
.pdm-notion-app .platform-operations,
.pdm-notion-app .platform-service {
  color: var(--pdm-text);
}

.pdm-notion-app .platform-service,
.pdm-notion-app .platform-environment,
.pdm-notion-app .platform-readiness {
  border-color: var(--pdm-line);
  background: var(--pdm-sidebar);
}

.pdm-workspace {
  display: grid;
  grid-template-columns: 240px minmax(560px, 1fr) 310px;
  min-height: calc(100vh - 103px);
  background: var(--pdm-canvas);
}

.pdm-workspace-sidebar,
.pdm-document-space,
.pdm-inspector {
  min-width: 0;
}

.pdm-workspace-sidebar {
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--pdm-line);
  padding: 14px 10px 12px;
  background: var(--pdm-sidebar);
}

.pdm-workspace-name {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 5px 8px 11px;
}

.pdm-workspace-name > div,
.pdm-project-link > span:last-child,
.pdm-inspector-head > div,
.pdm-settings-heading > div {
  min-width: 0;
}

.pdm-workspace-name strong,
.pdm-workspace-name span,
.pdm-project-link strong,
.pdm-project-link small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-workspace-name strong {
  font-size: 0.82rem;
}

.pdm-workspace-name div span {
  margin-top: 2px;
  color: var(--pdm-muted);
  font-size: 0.7rem;
}

.pdm-workspace-logo,
.pdm-project-glyph {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid var(--pdm-line);
  border-radius: 5px;
  color: #ffffff;
  background: #2f6f63;
  font-weight: 800;
}

.pdm-workspace-logo {
  width: 30px;
  height: 30px;
  font-size: 0.72rem;
}

.pdm-project-glyph {
  width: 24px;
  height: 24px;
  background: #536d95;
  font-size: 0.68rem;
}

.pdm-sidebar-actions,
.pdm-sidebar-nav,
.pdm-sidebar-section,
.project-list {
  display: grid;
  gap: 3px;
}

.pdm-sidebar-actions {
  border-bottom: 1px solid var(--pdm-line);
  padding-bottom: 10px;
}

.pdm-sidebar-nav,
.pdm-sidebar-section {
  padding-top: 12px;
}

.pdm-sidebar-nav p,
.pdm-sidebar-heading {
  min-height: 26px;
  margin: 0;
  padding: 0 8px;
  color: var(--pdm-muted);
  font-size: 0.7rem;
  font-weight: 750;
}

.pdm-sidebar-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pdm-nav-button,
.pdm-project-link,
.pdm-favorite-button,
.pdm-icon-action,
.pdm-text-action,
.pdm-view-tabs button,
.pdm-board-card,
.pdm-row-open,
.pdm-version-list button,
.pdm-block-controls button,
.pdm-comment button,
.pdm-cloud-result a,
.pdm-local-file a {
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--pdm-text);
  font: inherit;
  letter-spacing: 0;
}

.pdm-nav-button {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  min-height: 34px;
  width: 100%;
  padding: 0 8px;
  cursor: pointer;
  color: var(--pdm-text);
  font-size: 0.8rem;
  text-align: left;
}

.pdm-nav-button > span {
  color: var(--pdm-muted);
  font-size: 0.96rem;
}

.pdm-nav-button small {
  color: var(--pdm-muted);
  font-size: 0.68rem;
}

.pdm-nav-button:hover,
.pdm-nav-button.active,
.pdm-project-entry:hover,
.pdm-project-entry.active {
  background: var(--pdm-hover);
}

.pdm-nav-button.active {
  color: var(--pdm-blue);
  font-weight: 700;
}

.pdm-project-entry {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  align-items: center;
  border-radius: 5px;
}

.pdm-project-link {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  min-height: 42px;
  padding: 4px 3px 4px 8px;
  cursor: pointer;
  text-align: left;
}

.pdm-project-link strong {
  font-size: 0.75rem;
  font-weight: 700;
}

.pdm-project-link small {
  margin-top: 2px;
  color: var(--pdm-muted);
  font-size: 0.65rem;
}

.pdm-favorite-button,
.pdm-icon-action {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  padding: 0;
  cursor: pointer;
  color: var(--pdm-muted);
}

.pdm-favorite-button:hover,
.pdm-icon-action:hover,
.pdm-favorite-button.active {
  background: color-mix(in srgb, var(--pdm-hover) 72%, var(--pdm-canvas));
  color: var(--pdm-text);
}

.pdm-repository-footer {
  display: grid;
  gap: 9px;
  margin-top: auto;
  border-top: 1px solid var(--pdm-line);
  padding: 12px 8px 0;
}

.pdm-repository-state {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 9px;
}

.pdm-repository-state > span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--pdm-muted);
  font-size: 0.64rem;
}

.pdm-repository-state i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #b9b7b2;
}

.pdm-repository-state i.online {
  background: #3f9b61;
}

.pdm-repository-state strong {
  color: var(--pdm-text);
  font-weight: 700;
}

.pdm-repository-footer > p {
  margin: 0;
  color: var(--pdm-muted);
  font-size: 0.67rem;
  line-height: 1.45;
}

.pdm-document-space {
  background: var(--pdm-canvas);
}

.pdm-document-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 52px;
  border-bottom: 1px solid var(--pdm-line);
  padding: 7px 18px;
  background: color-mix(in srgb, var(--pdm-canvas) 96%, transparent);
}

.pdm-breadcrumb {
  min-width: 0;
  overflow: hidden;
  color: var(--pdm-muted);
  font-size: 0.72rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-document-actions {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 7px;
}

.pdm-document-actions .button,
.pdm-dialog-actions .button,
.pdm-inspector-actions .button {
  min-height: 32px;
  border-color: var(--pdm-line);
  border-radius: 5px;
  padding: 0 11px;
  background: var(--pdm-canvas);
  color: var(--pdm-text);
  box-shadow: none;
  font-size: 0.75rem;
}

.pdm-document-actions .button.primary,
.pdm-dialog-actions .button.primary,
.pdm-inspector-actions .button.primary {
  border-color: #1f5fb7;
  background: #246bce;
  color: #ffffff;
}

.pdm-text-action {
  min-height: 30px;
  padding: 0 9px;
  cursor: pointer;
  color: var(--pdm-muted);
  font-size: 0.74rem;
  font-weight: 650;
}

.pdm-text-action:hover {
  background: var(--pdm-hover);
  color: var(--pdm-text);
}

.pdm-project-page {
  min-width: 0;
  padding: 34px clamp(24px, 4vw, 62px) 60px;
}

.pdm-project-title-row {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  max-width: 1100px;
}

.pdm-project-icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 0;
  border-radius: 6px;
  background: #e3ede8;
  color: #2f6f63;
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 850;
}

.pdm-project-icon.active {
  color: #a96016;
  background: #f5ead7;
  font-size: 1.2rem;
}

.pdm-project-title {
  min-height: 48px;
  border: 0;
  border-radius: 4px;
  padding: 0 4px;
  background: transparent;
  color: var(--pdm-text);
  font-size: 2rem;
  font-weight: 760;
  line-height: 1.2;
}

.pdm-project-title:hover,
.pdm-project-title:focus {
  background: var(--pdm-hover);
  box-shadow: none;
}

.pdm-project-properties {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 8px 18px;
  max-width: 1100px;
  margin-top: 23px;
  border-block: 1px solid var(--pdm-line);
  padding: 10px 0;
}

.pdm-project-properties label,
.pdm-property-readonly {
  display: grid;
  grid-template-columns: minmax(70px, 0.7fr) minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  color: var(--pdm-muted);
  font-size: 0.72rem;
  font-weight: 600;
}

.pdm-project-properties input,
.pdm-project-properties select {
  min-height: 30px;
  border: 0;
  border-radius: 4px;
  padding: 0 7px;
  background: transparent;
  color: var(--pdm-text);
  font-size: 0.75rem;
  font-weight: 650;
}

.pdm-project-properties input:hover,
.pdm-project-properties input:focus,
.pdm-project-properties select:hover,
.pdm-project-properties select:focus {
  background: var(--pdm-hover);
  box-shadow: none;
}

.pdm-property-readonly strong {
  overflow: hidden;
  color: var(--pdm-text);
  font-size: 0.72rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-view-tabs {
  display: flex;
  gap: 18px;
  max-width: 1100px;
  margin-top: 28px;
  border-bottom: 1px solid var(--pdm-line);
  overflow-x: auto;
}

.pdm-view-tabs button {
  position: relative;
  min-height: 39px;
  flex: 0 0 auto;
  padding: 0 2px;
  cursor: pointer;
  color: var(--pdm-muted);
  font-size: 0.76rem;
  font-weight: 700;
}

.pdm-view-tabs button.active {
  color: var(--pdm-text);
}

.pdm-view-tabs button.active::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  background: var(--pdm-text);
  content: "";
}

.pdm-database-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 132px 124px auto;
  align-items: center;
  gap: 7px;
  max-width: 1100px;
  min-height: 51px;
  border-bottom: 1px solid var(--pdm-line);
  padding: 8px 0;
}

.pdm-database-toolbar[hidden] {
  display: none;
}

.pdm-search-field {
  position: relative;
  display: block;
}

.pdm-search-field > span {
  position: absolute;
  top: 7px;
  left: 9px;
  z-index: 1;
  color: var(--pdm-muted);
}

.pdm-search-field input,
.pdm-database-toolbar select {
  min-height: 32px;
  border: 1px solid var(--pdm-line);
  border-radius: 5px;
  background: var(--pdm-canvas);
  color: var(--pdm-text);
  font-size: 0.72rem;
}

.pdm-search-field input {
  padding-left: 29px;
}

.pdm-view-content {
  max-width: 1100px;
  min-width: 0;
  overflow-x: auto;
}

.pdm-database-summary {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 8px;
  color: var(--pdm-muted);
  font-size: 0.68rem;
}

.pdm-table-wrap {
  min-width: 0;
  overflow-x: auto;
}

.pdm-drawing-table {
  width: 100%;
  min-width: 850px;
  border-collapse: collapse;
  table-layout: fixed;
  color: var(--pdm-text);
  font-size: 0.72rem;
}

.pdm-drawing-table th,
.pdm-drawing-table td {
  height: 50px;
  border-bottom: 1px solid var(--pdm-line);
  padding: 7px 9px;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-drawing-table th {
  height: 34px;
  color: var(--pdm-muted);
  font-size: 0.66rem;
  font-weight: 650;
}

.pdm-drawing-table th:first-child {
  width: 31%;
}

.pdm-drawing-table th:nth-child(2) {
  width: 8%;
}

.pdm-drawing-table th:nth-child(3) {
  width: 13%;
}

.pdm-drawing-table th:nth-child(4),
.pdm-drawing-table th:nth-child(5) {
  width: 12%;
}

.pdm-drawing-table th:nth-child(6) {
  width: 16%;
}

.pdm-drawing-table th:last-child {
  width: 38px;
}

.pdm-drawing-table tbody tr:hover,
.pdm-drawing-table tbody tr.selected {
  background: var(--pdm-selected);
}

.pdm-drawing-link {
  display: grid;
  grid-template-columns: 29px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--pdm-text);
  cursor: pointer;
  text-align: left;
}

.pdm-drawing-link > span:first-child {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid #b9cbe7;
  border-radius: 4px;
  color: #315f9e;
  background: #edf3fb;
  font-size: 0.54rem;
  font-weight: 850;
}

.pdm-drawing-link strong,
.pdm-drawing-link small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-drawing-link strong {
  font-size: 0.72rem;
}

.pdm-drawing-link small {
  margin-top: 3px;
  color: var(--pdm-muted);
  font-size: 0.64rem;
}

.pdm-revision-chip,
.pdm-status {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  border-radius: 4px;
  padding: 0 6px;
  font-size: 0.65rem;
  font-weight: 700;
}

.pdm-revision-chip {
  background: var(--pdm-hover);
}

.pdm-status-work-in-progress,
.pdm-status-draft {
  color: #6b5b30;
  background: #f2eddc;
}

.pdm-status-checked,
.pdm-status-design-review {
  color: #315f9e;
  background: #e7effb;
}

.pdm-status-released {
  color: #2f6f43;
  background: #e2f0e6;
}

.pdm-status-obsolete,
.pdm-status-archived {
  color: #7a4c4c;
  background: #f2e4e4;
}

.pdm-row-open {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  color: var(--pdm-muted);
  font-size: 0.9rem;
}

.pdm-row-open:hover {
  background: var(--pdm-hover);
  color: var(--pdm-text);
}

.pdm-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(210px, 1fr));
  gap: 10px;
  min-width: 900px;
  padding-top: 14px;
}

.pdm-board-column {
  min-width: 0;
  border-right: 1px solid var(--pdm-line);
  padding-right: 10px;
}

.pdm-board-column:last-child {
  border-right: 0;
}

.pdm-board-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 34px;
}

.pdm-board-heading small {
  color: var(--pdm-muted);
  font-size: 0.68rem;
}

.pdm-board-list {
  display: grid;
  gap: 7px;
}

.pdm-board-card {
  display: grid;
  gap: 7px;
  min-height: 126px;
  border: 1px solid var(--pdm-line);
  padding: 10px;
  cursor: pointer;
  background: var(--pdm-canvas);
  text-align: left;
}

.pdm-board-card:hover,
.pdm-board-card.selected {
  border-color: #aac3e7;
  background: var(--pdm-selected);
}

.pdm-board-card strong {
  overflow: hidden;
  font-size: 0.76rem;
  text-overflow: ellipsis;
}

.pdm-board-card > span,
.pdm-board-card small,
.pdm-board-number {
  color: var(--pdm-muted);
  font-size: 0.66rem;
}

.pdm-empty-column {
  min-height: 76px;
  margin: 0;
  border: 1px dashed var(--pdm-line);
  border-radius: 5px;
  padding: 24px 8px;
  color: var(--pdm-muted);
  font-size: 0.68rem;
  text-align: center;
}

.pdm-empty-view {
  display: grid;
  justify-items: center;
  max-width: 420px;
  margin: 54px auto;
  text-align: center;
}

.pdm-empty-view > span {
  display: grid;
  width: 46px;
  height: 46px;
  margin-bottom: 14px;
  place-items: center;
  border: 1px solid var(--pdm-line);
  border-radius: 6px;
  color: var(--pdm-muted);
  background: var(--pdm-sidebar);
  font-size: 0.65rem;
  font-weight: 850;
}

.pdm-empty-view strong {
  font-size: 0.9rem;
}

.pdm-empty-view p,
.pdm-empty-quiet {
  margin: 7px 0 14px;
  color: var(--pdm-muted);
  font-size: 0.72rem;
  line-height: 1.55;
}

.pdm-notes-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  max-width: 760px;
  margin: 28px auto 16px;
}

.pdm-notes-head h2 {
  margin: 0;
  font-size: 1.05rem;
}

.pdm-notes-head p {
  margin: 5px 0 0;
  color: var(--pdm-muted);
  font-size: 0.72rem;
}

.pdm-notes-head > span {
  flex: 0 0 auto;
  color: var(--pdm-muted);
  font-size: 0.66rem;
}

.pdm-block-editor,
.pdm-activity-list {
  display: grid;
  max-width: 760px;
  margin: 0 auto;
}

.pdm-document-block {
  position: relative;
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  padding: 6px 0;
}

.pdm-document-block:hover {
  border-color: var(--pdm-line);
}

.pdm-block-controls {
  display: flex;
  align-items: flex-start;
  gap: 2px;
  opacity: 0;
  transition: opacity 120ms ease;
}

.pdm-document-block:hover .pdm-block-controls,
.pdm-document-block:focus-within .pdm-block-controls {
  opacity: 1;
}

.pdm-block-controls button {
  width: 21px;
  height: 28px;
  padding: 0;
  cursor: pointer;
  color: var(--pdm-muted);
  font-size: 0.68rem;
}

.pdm-block-controls button:hover {
  background: var(--pdm-hover);
  color: var(--pdm-text);
}

.pdm-block-controls select {
  width: 0;
  min-width: 20px;
  min-height: 28px;
  border: 0;
  padding: 0;
  color: transparent;
  background: transparent;
  cursor: pointer;
}

.pdm-block-content {
  min-width: 0;
}

.pdm-block-content input:not([type="checkbox"]),
.pdm-block-content textarea {
  width: 100%;
  border: 0;
  border-radius: 4px;
  padding: 6px 8px;
  resize: vertical;
  background: transparent;
  color: var(--pdm-text);
  font: inherit;
  line-height: 1.6;
}

.pdm-heading-block {
  min-height: 39px;
  font-size: 1.15rem !important;
  font-weight: 750 !important;
}

.pdm-text-block {
  min-height: 70px;
  font-size: 0.82rem !important;
}

.pdm-callout-block {
  min-height: 62px;
  border-left: 3px solid #8da5c7 !important;
  background: var(--pdm-sidebar) !important;
  font-size: 0.8rem !important;
}

.pdm-check-block {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 4px;
  min-height: 36px;
}

.pdm-check-block input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-height: 0;
  accent-color: var(--pdm-blue);
}

.pdm-add-block {
  display: flex;
  align-items: center;
  gap: 5px;
  border-top: 1px solid var(--pdm-line);
  padding: 10px 0;
}

.pdm-add-block select {
  width: 82px;
  min-height: 30px;
  border-color: var(--pdm-line);
  background: var(--pdm-canvas);
  color: var(--pdm-text);
  font-size: 0.7rem;
}

.pdm-activity-item {
  display: grid;
  grid-template-columns: 13px minmax(0, 1fr);
  gap: 11px;
  border-bottom: 1px solid var(--pdm-line);
  padding: 13px 2px;
}

.pdm-activity-dot {
  width: 8px;
  height: 8px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--pdm-blue);
}

.pdm-activity-item strong {
  font-size: 0.78rem;
}

.pdm-activity-item p {
  margin: 4px 0;
  color: var(--pdm-text);
  font-size: 0.72rem;
}

.pdm-activity-item small {
  color: var(--pdm-muted);
  font-size: 0.66rem;
}

.pdm-inspector {
  border-left: 1px solid var(--pdm-line);
  background: var(--pdm-inspector);
}

.pdm-inspector-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 52px;
  border-bottom: 1px solid var(--pdm-line);
  padding: 7px 13px;
}

.pdm-inspector-head span,
.pdm-inspector-head strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-inspector-head span {
  color: var(--pdm-muted);
  font-size: 0.64rem;
}

.pdm-inspector-head strong {
  margin-top: 3px;
  font-size: 0.76rem;
}

.pdm-inspector-section,
.pdm-comments-section,
.pdm-cloud-results,
.pdm-manifest-details {
  border-bottom: 1px solid var(--pdm-line);
  padding: 14px;
}

.pdm-inspector-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 24px;
  margin-bottom: 7px;
  color: var(--pdm-muted);
  font-size: 0.68rem;
  font-weight: 750;
}

.pdm-inspector-section-title small {
  font-size: 0.62rem;
  font-weight: 600;
}

.pdm-inspector-properties {
  display: grid;
  gap: 3px;
  margin: 0;
}

.pdm-inspector-properties > div {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  align-items: center;
  min-height: 31px;
  border-radius: 4px;
  padding: 3px 5px;
}

.pdm-inspector-properties > div:hover {
  background: var(--pdm-hover);
}

.pdm-inspector-properties dt,
.pdm-inspector-properties dd {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  font-size: 0.68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-inspector-properties dt {
  color: var(--pdm-muted);
}

.pdm-inspector-properties dd {
  color: var(--pdm-text);
  font-weight: 650;
}

.pdm-storage-path {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--pdm-text);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.65rem;
  line-height: 1.55;
}

.pdm-inspector-form {
  display: grid;
  gap: 5px;
  margin-bottom: 8px;
}

.pdm-inspector-form label {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  color: var(--pdm-muted);
  font-size: 0.68rem;
}

.pdm-inspector-form input,
.pdm-inspector-form select {
  min-height: 31px;
  border: 0;
  border-radius: 4px;
  padding: 0 6px;
  background: transparent;
  color: var(--pdm-text);
  font-size: 0.68rem;
}

.pdm-inspector-form input:hover,
.pdm-inspector-form select:hover,
.pdm-inspector-form input:focus,
.pdm-inspector-form select:focus {
  background: var(--pdm-hover);
}

.pdm-inspector-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 10px;
}

.pdm-inspector-actions .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
  white-space: nowrap;
}

.pdm-version-list,
.pdm-comment-list {
  display: grid;
  gap: 5px;
}

.pdm-version-list button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 36px;
  padding: 5px 7px;
  cursor: pointer;
  text-align: left;
}

.pdm-version-list button:hover,
.pdm-version-list button.active {
  background: var(--pdm-hover);
}

.pdm-version-list span {
  font-size: 0.7rem;
  font-weight: 750;
}

.pdm-version-list small {
  color: var(--pdm-muted);
  font-size: 0.62rem;
}

.pdm-comment {
  border-left: 2px solid #8da5c7;
  padding: 8px 0 8px 9px;
}

.pdm-comment.resolved {
  border-left-color: #8fbc9b;
  opacity: 0.66;
}

.pdm-comment-author {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
}

.pdm-comment-author > span {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  color: #ffffff;
  background: #536d95;
  font-size: 0.65rem;
  font-weight: 800;
}

.pdm-comment-author strong,
.pdm-comment-author small {
  display: block;
}

.pdm-comment-author strong {
  font-size: 0.68rem;
}

.pdm-comment-author small {
  margin-top: 2px;
  color: var(--pdm-muted);
  font-size: 0.59rem;
}

.pdm-comment p {
  margin: 7px 0;
  color: var(--pdm-text);
  font-size: 0.69rem;
  line-height: 1.5;
}

.pdm-comment button {
  padding: 0;
  cursor: pointer;
  color: var(--pdm-blue);
  font-size: 0.62rem;
}

.pdm-comment-form {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}

.pdm-comment-form textarea {
  width: 100%;
  min-height: 65px;
  border: 1px solid var(--pdm-line);
  border-radius: 5px;
  padding: 8px;
  resize: vertical;
  background: var(--pdm-canvas);
  color: var(--pdm-text);
  font: inherit;
  font-size: 0.69rem;
}

.pdm-comment-form .button {
  justify-self: end;
  min-height: 30px;
  border-color: var(--pdm-line);
  border-radius: 5px;
  padding: 0 9px;
  background: var(--pdm-canvas);
  color: var(--pdm-text);
  box-shadow: none;
  font-size: 0.68rem;
}

.pdm-cloud-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  border-top: 1px solid var(--pdm-line);
  padding: 8px 0;
}

.pdm-cloud-result strong,
.pdm-cloud-result span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdm-cloud-result strong {
  font-size: 0.66rem;
}

.pdm-cloud-result span {
  margin-top: 3px;
  color: var(--pdm-muted);
  font-size: 0.58rem;
}

.pdm-cloud-result a,
.pdm-local-file a {
  padding: 4px 6px;
  color: var(--pdm-blue);
  font-size: 0.64rem;
}

.pdm-manifest-details {
  color: var(--pdm-muted);
  font-size: 0.67rem;
}

.pdm-manifest-details summary {
  cursor: pointer;
  font-weight: 700;
}

.pdm-manifest-details pre,
#synologyPlan pre {
  max-height: 260px;
  margin: 10px 0 0;
  overflow: auto;
  color: var(--pdm-text);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.62rem;
  line-height: 1.55;
  white-space: pre-wrap;
}

.pdm-dialog {
  width: min(620px, calc(100% - 28px));
  max-height: min(820px, calc(100vh - 36px));
  border: 1px solid var(--pdm-line);
  border-radius: 8px;
  padding: 0;
  overflow: auto;
  color: var(--pdm-text);
  background: var(--pdm-canvas);
  box-shadow: 0 18px 50px rgb(0 0 0 / 24%);
}

.pdm-dialog::backdrop {
  background: rgb(0 0 0 / 38%);
  backdrop-filter: blur(2px);
}

.pdm-settings-dialog {
  width: min(760px, calc(100% - 28px));
}

.pdm-dialog-form {
  padding: 20px;
}

.pdm-dialog .dialog-head {
  border-bottom: 1px solid var(--pdm-line);
  padding-bottom: 14px;
}

.pdm-dialog .dialog-head h2 {
  margin: 0;
  font-size: 1.15rem;
}

.pdm-dialog-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.pdm-dialog-grid label {
  color: var(--pdm-muted);
  font-size: 0.72rem;
}

.pdm-dialog-grid input,
.pdm-dialog-grid select {
  min-height: 38px;
  border-color: var(--pdm-line);
  border-radius: 5px;
  background: var(--pdm-canvas);
  color: var(--pdm-text);
}

.pdm-dialog-grid input[type="file"] {
  padding: 6px;
}

.pdm-field-wide {
  grid-column: 1 / -1;
}

.pdm-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  margin-top: 18px;
}

.pdm-dialog-actions-start {
  justify-content: flex-start;
}

.pdm-settings-section {
  border-top: 1px solid var(--pdm-line);
  padding: 18px 0;
}

.pdm-settings-section:first-of-type {
  border-top: 0;
}

.pdm-settings-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.pdm-settings-heading strong,
.pdm-settings-heading span {
  display: block;
}

.pdm-settings-heading strong {
  font-size: 0.82rem;
}

.pdm-settings-heading span {
  margin-top: 4px;
  color: var(--pdm-muted);
  font-size: 0.68rem;
}

.pdm-settings-heading > div:last-child {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
}

.pdm-settings-dialog .small-button {
  min-height: 31px;
  border-color: var(--pdm-line);
  border-radius: 5px;
  padding: 0 9px;
  background: var(--pdm-canvas);
  color: var(--pdm-text);
  box-shadow: none;
  font-size: 0.68rem;
}

.pdm-sync-summary,
.pdm-local-file {
  border: 0;
  border-bottom: 1px solid var(--pdm-line);
  border-radius: 0;
  padding: 9px 2px;
  background: transparent;
}

.pdm-sync-summary {
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
  font-size: 0.68rem;
}

.pdm-sync-summary span,
.pdm-local-file small {
  color: var(--pdm-muted);
}

.pdm-local-file-list {
  display: grid;
  max-height: 220px;
  overflow: auto;
}

.pdm-local-file {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.pdm-local-file strong,
.pdm-local-file small {
  display: block;
  overflow: hidden;
  font-size: 0.66rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 1200px) {
  .pdm-workspace {
    grid-template-columns: 220px minmax(500px, 1fr) 278px;
  }

  .pdm-project-page {
    padding-inline: 28px;
  }

  .pdm-project-properties {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }
}

@media (max-width: 980px) {
  .pdm-workspace {
    grid-template-columns: 210px minmax(0, 1fr);
  }

  .pdm-inspector {
    grid-column: 2;
    border-top: 1px solid var(--pdm-line);
    border-left: 0;
  }

  .pdm-inspector > div,
  .pdm-inspector > section,
  .pdm-inspector > details {
    max-width: 760px;
    margin-inline: auto;
  }
}

@media (max-width: 760px) {
  .pdm-notion-page .topbar {
    padding-inline: 12px;
  }

  .pdm-notion-app .platform-command-bar {
    padding-inline: 12px;
  }

  .pdm-workspace {
    display: block;
  }

  .pdm-workspace-sidebar {
    display: block;
    border-right: 0;
    border-bottom: 1px solid var(--pdm-line);
    padding: 8px 10px 10px;
  }

  .pdm-workspace-name {
    display: none;
  }

  .pdm-sidebar-actions,
  .pdm-sidebar-nav,
  .project-list {
    display: flex;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .pdm-sidebar-actions {
    border-bottom: 0;
    padding-bottom: 5px;
  }

  .pdm-sidebar-nav {
    padding-top: 3px;
  }

  .pdm-sidebar-nav p,
  .pdm-sidebar-heading,
  .pdm-repository-footer {
    display: none;
  }

  .pdm-nav-button {
    display: flex;
    width: auto;
    min-width: max-content;
    gap: 5px;
    padding-inline: 9px;
  }

  .pdm-project-entry {
    flex: 0 0 190px;
  }

  .pdm-project-link {
    min-width: 0;
  }

  .pdm-document-toolbar {
    align-items: flex-start;
    flex-direction: column;
    padding: 9px 12px;
  }

  .pdm-document-actions {
    width: 100%;
    overflow-x: auto;
  }

  .pdm-project-page {
    padding: 24px 16px 40px;
  }

  .pdm-project-title-row {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 9px;
  }

  .pdm-project-icon {
    width: 40px;
    height: 40px;
  }

  .pdm-project-title {
    min-height: 42px;
    font-size: 1.45rem;
  }

  .pdm-project-properties,
  .pdm-database-toolbar {
    grid-template-columns: 1fr;
  }

  .pdm-project-properties {
    gap: 4px;
  }

  .pdm-view-tabs {
    gap: 15px;
    margin-top: 20px;
  }

  .pdm-database-toolbar {
    padding-block: 10px;
  }

  .pdm-database-toolbar .pdm-text-action {
    justify-self: start;
  }

  .pdm-database-summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .pdm-document-block {
    grid-template-columns: 1fr;
  }

  .pdm-block-controls {
    opacity: 1;
  }

  .pdm-notes-head {
    margin-top: 20px;
  }

  .pdm-inspector {
    border-top: 1px solid var(--pdm-line);
  }

  .pdm-dialog-form {
    padding: 16px;
  }

  .pdm-dialog-grid {
    grid-template-columns: 1fr;
  }

  .pdm-field-wide {
    grid-column: auto;
  }

  .pdm-settings-heading {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* PDM project management workspace v2 */
body.pdm-pm-page {
  --pm-bg: #ffffff;
  --pm-sidebar: #f7f7f5;
  --pm-subtle: #f3f3f1;
  --pm-hover: #ededeb;
  --pm-text: #262626;
  --pm-muted: #72716e;
  --pm-faint: #aaa9a5;
  --pm-line: #e5e5e2;
  --pm-blue: #2869c7;
  --pm-blue-soft: #e8f0fb;
  --pm-green: #2f7a4b;
  --pm-green-soft: #e4f0e7;
  --pm-orange: #a76017;
  --pm-orange-soft: #f5eadb;
  --pm-red: #b33f3f;
  --pm-red-soft: #f4e4e4;
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  color: var(--pm-text);
  background: var(--pm-bg);
  font-family: Inter, ui-sans-serif, system-ui, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

body.pdm-pm-page:not(.light) {
  --pm-bg: #191919;
  --pm-sidebar: #202020;
  --pm-subtle: #252525;
  --pm-hover: #2b2b2b;
  --pm-text: #ededed;
  --pm-muted: #a6a5a2;
  --pm-faint: #74736f;
  --pm-line: #343434;
  --pm-blue: #71aaff;
  --pm-blue-soft: #243852;
  --pm-green: #76bd8a;
  --pm-green-soft: #263b2c;
  --pm-orange: #e1a260;
  --pm-orange-soft: #433423;
  --pm-red: #e28080;
  --pm-red-soft: #452929;
}

.pdm-pm-page button,
.pdm-pm-page input,
.pdm-pm-page select,
.pdm-pm-page textarea {
  font: inherit;
  letter-spacing: 0;
}

.pdm-pm-page button,
.pdm-pm-page a,
.pdm-pm-page select {
  -webkit-tap-highlight-color: transparent;
}

.pm-appbar {
  position: sticky;
  top: 0;
  z-index: 50;
  display: grid;
  grid-template-columns: auto minmax(260px, 560px) auto;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 52px;
  border-bottom: 1px solid var(--pm-line);
  padding: 6px 16px;
  background: color-mix(in srgb, var(--pm-bg) 96%, transparent);
  backdrop-filter: blur(12px);
}

.pm-appbar-left,
.pm-appbar-actions,
.pm-brand,
.pm-global-search,
.pm-sync-state {
  display: flex;
  align-items: center;
}

.pm-appbar-left {
  gap: 9px;
  min-width: 190px;
}

.pm-brand {
  gap: 8px;
  color: var(--pm-text);
  font-size: 0.82rem;
  text-decoration: none;
}

.pm-brand > span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 6px;
  color: #ffffff;
  background: #252525;
  font-weight: 850;
}

.pm-app-divider {
  width: 1px;
  height: 22px;
  background: var(--pm-line);
}

.pm-product-name {
  font-size: 0.78rem;
}

.pm-global-search {
  position: relative;
  justify-self: center;
  width: 100%;
}

.pm-global-search > span {
  position: absolute;
  left: 11px;
  z-index: 1;
  color: var(--pm-muted);
}

.pm-global-search > input {
  width: 100%;
  min-height: 36px;
  border: 1px solid var(--pm-line);
  border-radius: 6px;
  padding: 0 58px 0 34px;
  outline: none;
  color: var(--pm-text);
  background: var(--pm-subtle);
  font-size: 0.75rem;
}

.pm-global-search > input:focus {
  border-color: #a8c0e1;
  background: var(--pm-bg);
  box-shadow: 0 0 0 2px var(--pm-blue-soft);
}

.pm-global-search kbd {
  position: absolute;
  right: 8px;
  border: 1px solid var(--pm-line);
  border-radius: 4px;
  padding: 2px 5px;
  color: var(--pm-muted);
  background: var(--pm-bg);
  font-size: 0.6rem;
  font-family: inherit;
}

.pm-search-results {
  position: absolute;
  top: 42px;
  right: 0;
  left: 0;
  z-index: 80;
  max-height: min(430px, calc(100vh - 90px));
  border: 1px solid var(--pm-line);
  border-radius: 7px;
  padding: 6px;
  overflow: auto;
  background: var(--pm-bg);
  box-shadow: 0 14px 36px rgb(0 0 0 / 18%);
}

.pm-search-results[hidden] {
  display: none;
}

.pm-search-results button {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  width: 100%;
  min-height: 48px;
  border: 0;
  border-radius: 5px;
  padding: 6px 8px;
  color: var(--pm-text);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.pm-search-results button:hover {
  background: var(--pm-hover);
}

.pm-search-results button strong,
.pm-search-results button small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-search-results button strong {
  font-size: 0.72rem;
}

.pm-search-results button small {
  margin-top: 3px;
  color: var(--pm-muted);
  font-size: 0.62rem;
}

.pm-search-type {
  color: var(--pm-muted);
  font-size: 0.62rem;
  font-weight: 700;
}

.pm-search-results > p {
  margin: 0;
  padding: 18px;
  color: var(--pm-muted);
  font-size: 0.72rem;
  text-align: center;
}

.pm-appbar-actions {
  justify-content: flex-end;
  gap: 7px;
  min-width: 300px;
}

.pm-sync-state {
  gap: 6px;
  margin-right: 3px;
  color: var(--pm-muted);
  font-size: 0.68rem;
  white-space: nowrap;
}

.pm-sync-state i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #9b9a96;
}

.pm-sync-state i.online {
  background: var(--pm-green);
}

.pm-sync-state i.dirty {
  background: var(--pm-orange);
}

.pm-icon-button,
.pm-auth-button,
.pm-language {
  min-height: 32px;
  border: 1px solid var(--pm-line);
  border-radius: 6px;
  padding: 0 9px;
  color: var(--pm-text);
  background: var(--pm-bg);
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 650;
}

.pm-icon-button {
  width: 34px;
  padding: 0;
  font-size: 0.9rem;
}

.pm-auth-button.verified {
  color: var(--pm-green);
}

.pm-language {
  width: 58px;
  padding-inline: 6px;
}

.pm-icon-button:hover,
.pm-auth-button:hover,
.pm-language:hover {
  background: var(--pm-hover);
}

.pm-layout {
  display: grid;
  grid-template-columns: 244px minmax(0, 1fr);
  width: 100%;
  min-height: calc(100vh - 52px);
  margin: 0;
  padding: 0;
}

.pm-sidebar {
  position: sticky;
  top: 52px;
  display: flex;
  height: calc(100vh - 52px);
  min-width: 0;
  flex-direction: column;
  border-right: 1px solid var(--pm-line);
  padding: 11px 9px 10px;
  overflow: hidden;
  background: var(--pm-sidebar);
}

.pm-workspace-switcher {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 5px 7px 9px;
}

.pm-workspace-switcher > span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 5px;
  color: #ffffff;
  background: #347366;
  font-size: 0.64rem;
  font-weight: 800;
}

.pm-workspace-switcher strong,
.pm-workspace-switcher small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-workspace-switcher strong {
  font-size: 0.75rem;
}

.pm-workspace-switcher small {
  margin-top: 2px;
  color: var(--pm-muted);
  font-size: 0.62rem;
}

.pm-create-button {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  border: 1px solid #bbcee9;
  border-radius: 5px;
  padding: 0 10px;
  color: #245ea8;
  background: var(--pm-blue-soft);
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 700;
}

.pm-create-button:hover {
  border-color: #86acd9;
}

.pm-primary-nav,
.pm-sidebar-projects,
.pm-sidebar-projects > div:last-child,
.pm-sidebar-bottom {
  display: grid;
  gap: 3px;
}

.pm-primary-nav {
  margin-top: 12px;
  border-bottom: 1px solid var(--pm-line);
  padding-bottom: 10px;
}

.pm-primary-nav button,
.pm-sidebar-bottom > button {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  min-height: 34px;
  border: 0;
  border-radius: 5px;
  padding: 0 8px;
  color: var(--pm-text);
  background: transparent;
  cursor: pointer;
  font-size: 0.72rem;
  text-align: left;
}

.pm-primary-nav button > span,
.pm-sidebar-bottom > button > span {
  color: var(--pm-muted);
  font-size: 0.88rem;
}

.pm-primary-nav button small {
  color: var(--pm-muted);
  font-size: 0.62rem;
}

.pm-primary-nav button:hover,
.pm-primary-nav button.active,
.pm-sidebar-bottom > button:hover {
  background: var(--pm-hover);
}

.pm-primary-nav button.active {
  color: var(--pm-blue);
  font-weight: 750;
}

.pm-sidebar-projects {
  min-height: 0;
  padding-top: 12px;
}

.pm-sidebar-projects > div:last-child {
  min-height: 0;
  overflow-y: auto;
}

.pm-sidebar-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 26px;
  padding: 0 8px;
  color: var(--pm-muted);
  font-size: 0.65rem;
  font-weight: 750;
}

.pm-sidebar-heading button {
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 4px;
  color: var(--pm-muted);
  background: transparent;
  cursor: pointer;
}

.pm-sidebar-heading button:hover {
  background: var(--pm-hover);
}

.pm-sidebar-project {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 7px;
  min-height: 42px;
  width: 100%;
  border: 0;
  border-radius: 5px;
  padding: 4px 7px;
  color: var(--pm-text);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.pm-sidebar-project:hover,
.pm-sidebar-project.active {
  background: var(--pm-hover);
}

.pm-sidebar-project > span:first-child {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 4px;
  color: #ffffff;
  background: #536d95;
  font-size: 0.62rem;
  font-weight: 800;
}

.pm-sidebar-project strong,
.pm-sidebar-project small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-sidebar-project strong {
  font-size: 0.69rem;
}

.pm-sidebar-project small {
  margin-top: 3px;
  color: var(--pm-muted);
  font-size: 0.59rem;
}

.pm-sidebar-project i {
  color: var(--pm-orange);
  font-size: 0.65rem;
  font-style: normal;
}

.pm-sidebar-bottom {
  margin-top: auto;
  border-top: 1px solid var(--pm-line);
  padding-top: 9px;
}

.pm-module-links {
  display: flex;
  gap: 5px;
  padding: 7px 7px 0;
}

.pm-module-links a {
  color: var(--pm-muted);
  font-size: 0.59rem;
  text-decoration: none;
}

.pm-module-links a:hover {
  color: var(--pm-text);
}

.pm-main {
  min-width: 0;
  background: var(--pm-bg);
}

.pm-main-toolbar {
  position: sticky;
  top: 52px;
  z-index: 35;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 50px;
  border-bottom: 1px solid var(--pm-line);
  padding: 7px 22px;
  background: color-mix(in srgb, var(--pm-bg) 96%, transparent);
  backdrop-filter: blur(10px);
}

.pm-breadcrumb {
  min-width: 0;
  overflow: hidden;
  color: var(--pm-muted);
  font-size: 0.69rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-toolbar-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
}

.pm-button,
.pm-section-heading button,
.pm-view-toolbar button,
.pm-add-block button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  padding: 0 10px;
  color: var(--pm-text);
  background: var(--pm-bg);
  cursor: pointer;
  font-size: 0.7rem;
  font-weight: 680;
  text-decoration: none;
  white-space: nowrap;
}

.pm-button:hover,
.pm-section-heading button:hover,
.pm-view-toolbar button:hover,
.pm-add-block button:hover {
  background: var(--pm-hover);
}

.pm-button-primary {
  border-color: #1e5caf;
  color: #ffffff;
  background: var(--pm-blue);
}

.pm-button-primary:hover {
  background: #205ead;
}

.pm-button[hidden] {
  display: none;
}

.pm-page {
  width: min(100%, 1320px);
  margin: 0 auto;
  padding: 34px clamp(24px, 4vw, 58px) 70px;
}

.pm-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 26px;
}

.pm-page-heading h1 {
  margin: 0;
  color: var(--pm-text);
  font-size: 1.62rem;
  line-height: 1.2;
  text-shadow: none;
}

.pm-page-heading p {
  max-width: 720px;
  margin: 6px 0 0;
  color: var(--pm-muted);
  font-size: 0.75rem;
  line-height: 1.55;
}

.pm-metrics-band {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 30px;
  border-block: 1px solid var(--pm-line);
}

.pm-metrics-band > div {
  min-width: 0;
  border-right: 1px solid var(--pm-line);
  padding: 16px 18px;
}

.pm-metrics-band > div:first-child {
  padding-left: 0;
}

.pm-metrics-band > div:last-child {
  border-right: 0;
}

.pm-metrics-band span,
.pm-metrics-band strong,
.pm-metrics-band small {
  display: block;
}

.pm-metrics-band span {
  color: var(--pm-muted);
  font-size: 0.68rem;
}

.pm-metrics-band strong {
  margin-top: 8px;
  font-size: 1.45rem;
  line-height: 1;
}

.pm-metrics-band small {
  margin-top: 7px;
  color: var(--pm-muted);
  font-size: 0.62rem;
}

.pm-section {
  min-width: 0;
  margin-top: 30px;
}

.pm-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  min-height: 38px;
  margin-bottom: 10px;
}

.pm-section-heading h2 {
  margin: 0;
  color: var(--pm-text);
  font-size: 0.91rem;
}

.pm-section-heading p {
  margin: 4px 0 0;
  color: var(--pm-muted);
  font-size: 0.65rem;
}

.pm-section-heading button {
  min-height: 29px;
  border-color: transparent;
  padding-inline: 7px;
  color: var(--pm-blue);
  background: transparent;
}

.pm-table-wrap {
  min-width: 0;
  overflow-x: auto;
  border-top: 1px solid var(--pm-line);
}

.pm-data-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  table-layout: fixed;
  color: var(--pm-text);
  font-size: 0.7rem;
}

.pm-data-table th,
.pm-data-table td {
  height: 52px;
  border-bottom: 1px solid var(--pm-line);
  padding: 7px 10px;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-data-table th {
  height: 34px;
  color: var(--pm-muted);
  background: var(--pm-bg);
  font-size: 0.62rem;
  font-weight: 680;
}

.pm-data-table tbody tr:hover {
  background: color-mix(in srgb, var(--pm-blue-soft) 52%, transparent);
}

.pm-project-table th:first-child,
.pm-task-table th:first-child,
.pm-drawing-table-v2 th:first-child {
  width: 30%;
}

.pm-title-cell,
.pm-task-title {
  display: grid;
  grid-template-columns: 29px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  width: 100%;
  border: 0;
  padding: 0;
  color: var(--pm-text);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.pm-title-cell strong,
.pm-title-cell small,
.pm-task-title strong,
.pm-task-title small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-title-cell strong,
.pm-task-title strong {
  font-size: 0.7rem;
}

.pm-title-cell small,
.pm-task-title small {
  margin-top: 3px;
  color: var(--pm-muted);
  font-size: 0.6rem;
}

.pm-page-icon,
.pm-dwg-icon {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid var(--pm-line);
  border-radius: 4px;
  color: #ffffff;
  background: #536d95;
  font-size: 0.58rem;
  font-weight: 820;
}

.pm-dwg-icon {
  border-color: #b9cbe7;
  color: #315f9e;
  background: #edf3fb;
  font-size: 0.5rem;
}

.pm-task-check {
  display: grid;
  width: 19px;
  height: 19px;
  margin-left: 4px;
  place-items: center;
  border: 1px solid #b9b8b4;
  border-radius: 4px;
  color: #ffffff;
  font-size: 0.58rem;
  font-style: normal;
}

.pm-task-check.done {
  border-color: var(--pm-green);
  background: var(--pm-green);
}

.pm-tag,
.pm-priority,
.pm-revision {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  border-radius: 4px;
  padding: 0 6px;
  font-size: 0.61rem;
  font-weight: 700;
}

.pm-tag-draft,
.pm-tag-not-started,
.pm-tag-work-in-progress {
  color: #725f2f;
  background: #f1eddc;
}

.pm-tag-design-review,
.pm-tag-in-progress,
.pm-tag-checked {
  color: #315f9e;
  background: #e7effa;
}

.pm-tag-released,
.pm-tag-done {
  color: #2f7043;
  background: #e2efe5;
}

.pm-tag-archived,
.pm-tag-obsolete,
.pm-tag-blocked {
  color: #864343;
  background: #f1e3e3;
}

body.pdm-pm-page:not(.light) .pm-tag {
  color: var(--pm-text);
  background: var(--pm-subtle);
}

.pm-priority {
  min-height: 20px;
  padding-inline: 5px;
}

.pm-priority-high,
.pm-priority-dot.pm-priority-high {
  color: var(--pm-red);
  background: var(--pm-red-soft);
}

.pm-priority-medium,
.pm-priority-dot.pm-priority-medium {
  color: var(--pm-orange);
  background: var(--pm-orange-soft);
}

.pm-priority-low,
.pm-priority-dot.pm-priority-low {
  color: var(--pm-green);
  background: var(--pm-green-soft);
}

.pm-revision {
  color: var(--pm-text);
  background: var(--pm-subtle);
}

.pm-inline-select {
  width: 104px;
  min-height: 28px;
  border: 0;
  border-radius: 4px;
  padding: 0 23px 0 7px;
  color: var(--pm-text);
  background: var(--pm-subtle);
  cursor: pointer;
  font-size: 0.63rem;
  font-weight: 650;
}

.pm-project-reference {
  max-width: 100%;
  border: 0;
  padding: 0;
  overflow: hidden;
  color: var(--pm-blue);
  background: transparent;
  cursor: pointer;
  font-size: 0.66rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-progress-cell {
  display: grid;
  grid-template-columns: minmax(55px, 1fr) 30px;
  align-items: center;
  gap: 6px;
}

.pm-progress {
  display: block;
  height: 5px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--pm-subtle);
}

.pm-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--pm-blue);
}

.pm-progress-cell small {
  color: var(--pm-muted);
  font-size: 0.58rem;
}

.pm-overdue {
  color: var(--pm-red) !important;
  font-weight: 700;
}

.pm-dashboard-split,
.pm-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
  gap: 34px;
}

.pm-compact-list,
.pm-activity-compact {
  border-top: 1px solid var(--pm-line);
}

.pm-compact-list button,
.pm-activity-compact button {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-height: 51px;
  border: 0;
  border-bottom: 1px solid var(--pm-line);
  padding: 7px 4px;
  color: var(--pm-text);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.pm-compact-list button:hover,
.pm-activity-compact button:hover {
  background: var(--pm-hover);
}

.pm-compact-list strong,
.pm-compact-list small,
.pm-activity-compact strong,
.pm-activity-compact small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-compact-list strong,
.pm-activity-compact strong {
  font-size: 0.69rem;
}

.pm-compact-list small,
.pm-activity-compact small {
  margin-top: 3px;
  color: var(--pm-muted);
  font-size: 0.59rem;
}

.pm-compact-list time,
.pm-activity-compact time {
  color: var(--pm-muted);
  font-size: 0.59rem;
  white-space: nowrap;
}

.pm-priority-dot,
.pm-activity-compact i {
  display: block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

.pm-activity-compact i {
  background: var(--pm-blue);
}

.pm-empty-line {
  margin: 0;
  border-top: 1px solid var(--pm-line);
  padding: 20px 4px;
  color: var(--pm-muted);
  font-size: 0.68rem;
}

.pm-view-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 145px 145px auto;
  align-items: center;
  gap: 7px;
  min-height: 50px;
  margin-top: 6px;
  border-block: 1px solid var(--pm-line);
  padding: 8px 0;
}

.pm-filter-search {
  position: relative;
  display: block;
}

.pm-filter-search span {
  position: absolute;
  top: 7px;
  left: 10px;
  z-index: 1;
  color: var(--pm-muted);
}

.pm-filter-search input,
.pm-view-toolbar select,
.pm-view-toolbar button {
  min-height: 32px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  color: var(--pm-text);
  background: var(--pm-bg);
  font-size: 0.66rem;
}

.pm-filter-search input {
  width: 100%;
  padding: 0 9px 0 29px;
}

.pm-view-toolbar select {
  width: 100%;
  padding: 0 26px 0 9px;
}

.pm-view-toolbar > span {
  color: var(--pm-muted);
  font-size: 0.62rem;
  text-align: right;
  white-space: nowrap;
}

.pm-empty {
  display: grid;
  justify-items: center;
  max-width: 430px;
  margin: 56px auto;
  text-align: center;
}

.pm-empty > span {
  display: grid;
  width: 42px;
  height: 42px;
  margin-bottom: 12px;
  place-items: center;
  border: 1px solid var(--pm-line);
  border-radius: 6px;
  color: var(--pm-muted);
  background: var(--pm-subtle);
  font-size: 1rem;
}

.pm-empty strong {
  font-size: 0.82rem;
}

.pm-empty p {
  margin: 7px 0 13px;
  color: var(--pm-muted);
  font-size: 0.68rem;
  line-height: 1.5;
}

.pm-project-header {
  max-width: 1080px;
  margin: 0 auto;
}

.pm-project-title-line {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}

.pm-project-title-line > button {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 0;
  border-radius: 6px;
  color: #2f6f63;
  background: #e3ede8;
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 800;
}

.pm-project-title-line > input {
  min-width: 0;
  min-height: 50px;
  border: 0;
  border-radius: 4px;
  padding: 0 4px;
  outline: none;
  color: var(--pm-text);
  background: transparent;
  font-size: 1.88rem;
  font-weight: 760;
}

.pm-project-title-line > input:hover,
.pm-project-title-line > input:focus,
.pm-project-header > textarea:hover,
.pm-project-header > textarea:focus {
  background: var(--pm-subtle);
}

.pm-project-header > textarea {
  display: block;
  width: calc(100% - 60px);
  max-width: 760px;
  min-height: 52px;
  margin: 10px 0 0 60px;
  border: 0;
  border-radius: 4px;
  padding: 5px 7px;
  outline: none;
  resize: vertical;
  color: var(--pm-muted);
  background: transparent;
  font-size: 0.74rem;
  line-height: 1.55;
}

.pm-project-properties {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 3px 18px;
  margin-top: 18px;
  border-block: 1px solid var(--pm-line);
  padding: 9px 0;
}

.pm-project-properties label {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  min-height: 34px;
  color: var(--pm-muted);
  font-size: 0.65rem;
}

.pm-project-properties input,
.pm-project-properties select {
  min-height: 29px;
  min-width: 0;
  border: 0;
  border-radius: 4px;
  padding: 0 7px;
  outline: none;
  color: var(--pm-text);
  background: transparent;
  font-size: 0.66rem;
  font-weight: 650;
}

.pm-project-properties input:hover,
.pm-project-properties input:focus,
.pm-project-properties select:hover,
.pm-project-properties select:focus {
  background: var(--pm-hover);
}

.pm-project-tabs {
  display: flex;
  gap: 18px;
  margin-top: 25px;
  border-bottom: 1px solid var(--pm-line);
  overflow-x: auto;
}

.pm-project-tabs button {
  position: relative;
  min-height: 39px;
  flex: 0 0 auto;
  border: 0;
  padding: 0 2px;
  color: var(--pm-muted);
  background: transparent;
  cursor: pointer;
  font-size: 0.7rem;
  font-weight: 680;
}

.pm-project-tabs button.active {
  color: var(--pm-text);
}

.pm-project-tabs button.active::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  background: var(--pm-text);
  content: "";
}

.pm-project-view {
  max-width: 1080px;
  margin: 0 auto;
}

.pm-project-summary {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(440px, 1.35fr);
  gap: 34px;
  margin-top: 24px;
  border-bottom: 1px solid var(--pm-line);
  padding-bottom: 22px;
}

.pm-progress-overview > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.pm-progress-overview span,
.pm-progress-overview small {
  color: var(--pm-muted);
  font-size: 0.66rem;
}

.pm-progress-overview strong {
  font-size: 1.3rem;
}

.pm-progress-large {
  height: 7px;
  margin: 10px 0 7px;
}

.pm-project-summary dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}

.pm-project-summary dl > div {
  border-left: 1px solid var(--pm-line);
  padding-left: 14px;
}

.pm-project-summary dt {
  color: var(--pm-muted);
  font-size: 0.62rem;
}

.pm-project-summary dd {
  margin: 8px 0 0;
  font-size: 1.12rem;
  font-weight: 750;
}

.pm-milestone-list {
  border-top: 1px solid var(--pm-line);
}

.pm-milestone-list label {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  min-height: 52px;
  border-bottom: 1px solid var(--pm-line);
  padding: 7px 4px;
  color: var(--pm-text);
  cursor: pointer;
}

.pm-milestone-list input {
  width: 16px;
  height: 16px;
  accent-color: var(--pm-blue);
}

.pm-milestone-list strong,
.pm-milestone-list small {
  display: block;
}

.pm-milestone-list strong {
  font-size: 0.69rem;
}

.pm-milestone-list small {
  margin-top: 4px;
  color: var(--pm-muted);
  font-size: 0.6rem;
}

.pm-board-v2 {
  display: grid;
  grid-template-columns: repeat(4, minmax(210px, 1fr));
  gap: 11px;
  min-width: 900px;
  margin-top: 18px;
}

.pm-project-view:has(.pm-board-v2) {
  overflow-x: auto;
}

.pm-board-v2 > section {
  min-width: 0;
  border-right: 1px solid var(--pm-line);
  padding-right: 10px;
}

.pm-board-v2 > section:last-child {
  border-right: 0;
}

.pm-board-v2 > section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 37px;
}

.pm-board-v2 > section > header small {
  color: var(--pm-muted);
  font-size: 0.62rem;
}

.pm-board-v2 > section > div {
  display: grid;
  gap: 7px;
}

.pm-board-v2 > section > div > button {
  display: grid;
  gap: 8px;
  min-height: 116px;
  border: 1px solid var(--pm-line);
  border-radius: 6px;
  padding: 10px;
  color: var(--pm-text);
  background: var(--pm-bg);
  cursor: pointer;
  text-align: left;
}

.pm-board-v2 > section > div > button:hover {
  border-color: #a8c0e1;
  background: var(--pm-blue-soft);
}

.pm-board-v2 button strong {
  font-size: 0.7rem;
  line-height: 1.45;
}

.pm-board-v2 button > span,
.pm-board-v2 button time {
  color: var(--pm-muted);
  font-size: 0.6rem;
}

.pm-board-v2 button footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  margin-top: auto;
}

.pm-board-v2 > section > div > p {
  margin: 0;
  border: 1px dashed var(--pm-line);
  border-radius: 6px;
  padding: 20px 8px;
  color: var(--pm-muted);
  font-size: 0.64rem;
  text-align: center;
}

.pm-doc-intro {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  max-width: 760px;
  margin: 27px auto 15px;
}

.pm-doc-intro h2 {
  margin: 0;
  font-size: 0.92rem;
}

.pm-doc-intro p {
  margin: 5px 0 0;
  color: var(--pm-muted);
  font-size: 0.65rem;
}

.pm-doc-intro > span {
  color: var(--pm-muted);
  font-size: 0.61rem;
}

.pm-block-editor {
  max-width: 760px;
  margin: 0 auto;
}

.pm-doc-block {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 8px;
  border-block: 1px solid transparent;
  padding: 6px 0;
}

.pm-doc-block:hover {
  border-color: var(--pm-line);
}

.pm-block-tools {
  display: flex;
  align-items: flex-start;
  gap: 2px;
  opacity: 0;
}

.pm-doc-block:hover .pm-block-tools,
.pm-doc-block:focus-within .pm-block-tools {
  opacity: 1;
}

.pm-block-tools button {
  width: 21px;
  height: 28px;
  border: 0;
  border-radius: 4px;
  padding: 0;
  color: var(--pm-muted);
  background: transparent;
  cursor: pointer;
  font-size: 0.64rem;
}

.pm-block-tools button:hover {
  background: var(--pm-hover);
}

.pm-block-tools select {
  width: 20px;
  min-height: 28px;
  border: 0;
  padding: 0;
  color: transparent;
  background: transparent;
  cursor: pointer;
}

.pm-doc-block > div:last-child input:not([type="checkbox"]),
.pm-doc-block > div:last-child textarea {
  width: 100%;
  border: 0;
  border-radius: 4px;
  padding: 6px 8px;
  outline: none;
  resize: vertical;
  color: var(--pm-text);
  background: transparent;
  line-height: 1.6;
}

.pm-doc-block > div:last-child input:focus,
.pm-doc-block > div:last-child textarea:focus {
  background: var(--pm-subtle);
}

.pm-heading-block {
  min-height: 38px;
  font-size: 1.12rem !important;
  font-weight: 750 !important;
}

.pm-text-block {
  min-height: 72px;
  font-size: 0.76rem !important;
}

.pm-callout-block {
  min-height: 64px;
  border-left: 3px solid #8da5c7 !important;
  background: var(--pm-subtle) !important;
  font-size: 0.74rem !important;
}

.pm-check-block {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 4px;
}

.pm-check-block input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--pm-blue);
}

.pm-add-block {
  display: flex;
  align-items: center;
  gap: 6px;
  border-top: 1px solid var(--pm-line);
  padding-top: 10px;
}

.pm-add-block select {
  width: 82px;
  min-height: 30px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  padding: 0 7px;
  color: var(--pm-text);
  background: var(--pm-bg);
  font-size: 0.65rem;
}

.pm-activity-page {
  max-width: 760px;
  margin: 20px auto 0;
}

.pm-activity-page article {
  display: grid;
  grid-template-columns: 13px minmax(0, 1fr);
  gap: 10px;
  border-bottom: 1px solid var(--pm-line);
  padding: 13px 2px;
}

.pm-activity-page article > i {
  width: 8px;
  height: 8px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--pm-blue);
}

.pm-activity-page strong {
  font-size: 0.7rem;
}

.pm-activity-page p {
  margin: 4px 0;
  font-size: 0.67rem;
}

.pm-activity-page small {
  color: var(--pm-muted);
  font-size: 0.59rem;
}

.pm-cloud-section {
  border-top: 1px solid var(--pm-line);
  padding-top: 18px;
}

.pm-cloud-list {
  display: grid;
  border-top: 1px solid var(--pm-line);
}

.pm-cloud-list a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 48px;
  border-bottom: 1px solid var(--pm-line);
  padding: 7px 5px;
  color: var(--pm-text);
  text-decoration: none;
}

.pm-cloud-list a:hover {
  background: var(--pm-hover);
}

.pm-cloud-list strong,
.pm-cloud-list small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-cloud-list strong {
  font-size: 0.67rem;
}

.pm-cloud-list small {
  margin-top: 3px;
  color: var(--pm-muted);
  font-size: 0.58rem;
}

.pm-peek {
  position: fixed;
  top: 52px;
  right: 0;
  bottom: 0;
  z-index: 45;
  width: min(380px, 100vw);
  border-left: 1px solid var(--pm-line);
  overflow-y: auto;
  color: var(--pm-text);
  background: var(--pm-bg);
  box-shadow: -14px 0 36px rgb(0 0 0 / 14%);
  transform: translateX(18px);
  opacity: 0;
  transition: transform 150ms ease, opacity 150ms ease;
}

.pm-peek[hidden] {
  display: none;
}

.pm-peek.open {
  transform: translateX(0);
  opacity: 1;
}

.pm-peek > header {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 53px;
  border-bottom: 1px solid var(--pm-line);
  padding: 7px 13px;
  background: var(--pm-bg);
}

.pm-peek > header span,
.pm-peek > header strong {
  display: block;
  max-width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-peek > header span {
  color: var(--pm-muted);
  font-size: 0.59rem;
}

.pm-peek > header strong {
  margin-top: 3px;
  font-size: 0.72rem;
}

.pm-peek > header button,
.pm-dialog-head > button {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 0;
  border-radius: 5px;
  color: var(--pm-muted);
  background: transparent;
  cursor: pointer;
  font-size: 1rem;
}

.pm-peek > header button:hover,
.pm-dialog-head > button:hover {
  background: var(--pm-hover);
}

.pm-peek-section {
  border-bottom: 1px solid var(--pm-line);
  padding: 15px;
}

.pm-peek-title {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  margin-bottom: 14px;
}

.pm-peek-title textarea {
  width: 100%;
  min-height: 50px;
  border: 0;
  border-radius: 4px;
  padding: 2px 5px;
  outline: none;
  resize: vertical;
  color: var(--pm-text);
  background: transparent;
  font-size: 0.91rem;
  font-weight: 750;
  line-height: 1.4;
}

.pm-peek-title textarea:focus {
  background: var(--pm-subtle);
}

.pm-peek-fields {
  display: grid;
  gap: 3px;
}

.pm-peek-fields label {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  align-items: center;
  min-height: 35px;
  border-radius: 4px;
  padding: 2px 4px;
  color: var(--pm-muted);
  font-size: 0.65rem;
}

.pm-peek-fields label:hover {
  background: var(--pm-hover);
}

.pm-peek-fields input,
.pm-peek-fields select,
.pm-peek-fields button,
.pm-peek-fields strong {
  min-width: 0;
  min-height: 29px;
  border: 0;
  border-radius: 4px;
  padding: 0 6px;
  overflow: hidden;
  color: var(--pm-text);
  background: transparent;
  font-size: 0.65rem;
  font-weight: 650;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-peek-fields button {
  color: var(--pm-blue);
  cursor: pointer;
}

.pm-peek-description {
  display: grid;
  gap: 6px;
  margin-top: 13px;
  color: var(--pm-muted);
  font-size: 0.65rem;
}

.pm-peek-description textarea {
  width: 100%;
  min-height: 92px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  padding: 8px;
  outline: none;
  resize: vertical;
  color: var(--pm-text);
  background: var(--pm-bg);
  font-size: 0.67rem;
  line-height: 1.5;
}

.pm-linked-drawing,
.pm-drawing-peek-title {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

.pm-linked-drawing {
  width: 100%;
  min-height: 48px;
  margin-top: 12px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  padding: 7px;
  color: var(--pm-text);
  background: var(--pm-bg);
  cursor: pointer;
  text-align: left;
}

.pm-linked-drawing:hover {
  background: var(--pm-hover);
}

.pm-linked-drawing strong,
.pm-linked-drawing small,
.pm-drawing-peek-title strong,
.pm-drawing-peek-title small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-linked-drawing strong,
.pm-drawing-peek-title strong {
  font-size: 0.68rem;
}

.pm-linked-drawing small,
.pm-drawing-peek-title small {
  margin-top: 3px;
  color: var(--pm-muted);
  font-size: 0.59rem;
}

.pm-delete-button {
  min-height: 28px;
  margin-top: 16px;
  border: 0;
  padding: 0;
  color: var(--pm-red);
  background: transparent;
  cursor: pointer;
  font-size: 0.63rem;
}

.pm-peek-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 25px;
  margin-bottom: 7px;
  color: var(--pm-muted);
  font-size: 0.65rem;
  font-weight: 700;
}

.pm-peek-section-title small {
  font-size: 0.58rem;
  font-weight: 550;
}

.pm-version-list-v2 {
  display: grid;
}

.pm-version-list-v2 button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 38px;
  border: 0;
  border-radius: 4px;
  padding: 5px 7px;
  color: var(--pm-text);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.pm-version-list-v2 button:hover,
.pm-version-list-v2 button.active {
  background: var(--pm-hover);
}

.pm-version-list-v2 span {
  font-size: 0.66rem;
  font-weight: 700;
}

.pm-version-list-v2 small {
  color: var(--pm-muted);
  font-size: 0.58rem;
}

.pm-peek-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 13px;
}

.pm-peek-actions a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 31px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  color: var(--pm-text);
  background: var(--pm-bg);
  font-size: 0.63rem;
  font-weight: 650;
  text-decoration: none;
}

.pm-comment-list-v2 {
  display: grid;
  gap: 6px;
}

.pm-comment-list-v2 article {
  border-left: 2px solid #8da5c7;
  padding: 8px 0 8px 9px;
}

.pm-comment-list-v2 article.resolved {
  border-color: #8fbc9b;
  opacity: 0.62;
}

.pm-comment-list-v2 article header {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
}

.pm-comment-list-v2 article header > span {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  color: #ffffff;
  background: #536d95;
  font-size: 0.61rem;
  font-weight: 800;
}

.pm-comment-list-v2 strong,
.pm-comment-list-v2 small {
  display: block;
}

.pm-comment-list-v2 strong {
  font-size: 0.64rem;
}

.pm-comment-list-v2 small {
  margin-top: 2px;
  color: var(--pm-muted);
  font-size: 0.56rem;
}

.pm-comment-list-v2 p {
  margin: 7px 0;
  font-size: 0.65rem;
  line-height: 1.5;
}

.pm-comment-list-v2 article > button {
  border: 0;
  padding: 0;
  color: var(--pm-blue);
  background: transparent;
  cursor: pointer;
  font-size: 0.58rem;
}

.pm-comment-form-v2 {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}

.pm-comment-form-v2 textarea {
  width: 100%;
  min-height: 66px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  padding: 8px;
  resize: vertical;
  color: var(--pm-text);
  background: var(--pm-bg);
  font-size: 0.65rem;
}

.pm-comment-form-v2 button {
  justify-self: end;
  min-height: 29px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  padding: 0 8px;
  color: var(--pm-text);
  background: var(--pm-bg);
  cursor: pointer;
  font-size: 0.62rem;
}

.pm-dialog {
  width: min(620px, calc(100% - 28px));
  max-height: min(820px, calc(100vh - 32px));
  border: 1px solid var(--pm-line);
  border-radius: 8px;
  padding: 20px;
  overflow: auto;
  color: var(--pm-text);
  background: var(--pm-bg);
  box-shadow: 0 20px 54px rgb(0 0 0 / 24%);
}

.pm-dialog::backdrop {
  background: rgb(0 0 0 / 35%);
  backdrop-filter: blur(2px);
}

.pm-settings-dialog {
  width: min(760px, calc(100% - 28px));
}

.pm-dialog-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 17px;
  border-bottom: 1px solid var(--pm-line);
  padding-bottom: 13px;
}

.pm-dialog-head span {
  color: var(--pm-muted);
  font-size: 0.62rem;
  font-weight: 650;
}

.pm-dialog-head h2 {
  margin: 4px 0 0;
  font-size: 1.04rem;
}

.pm-dialog > form > label,
.pm-auth-dialog label {
  display: grid;
  gap: 6px;
  margin-top: 12px;
  color: var(--pm-muted);
  font-size: 0.68rem;
  font-weight: 650;
}

.pm-dialog-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.pm-dialog-grid label {
  display: grid;
  gap: 6px;
  color: var(--pm-muted);
  font-size: 0.68rem;
  font-weight: 650;
}

.pm-dialog input,
.pm-dialog select,
.pm-dialog textarea {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  padding: 0 10px;
  outline: none;
  color: var(--pm-text);
  background: var(--pm-bg);
  font-size: 0.7rem;
}

.pm-dialog textarea {
  padding-block: 8px;
  resize: vertical;
}

.pm-dialog input[type="file"] {
  padding-block: 6px;
}

.pm-dialog input:focus,
.pm-dialog select:focus,
.pm-dialog textarea:focus {
  border-color: #9ab6db;
  box-shadow: 0 0 0 2px var(--pm-blue-soft);
}

.pm-field-wide {
  grid-column: 1 / -1;
}

.pm-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  margin-top: 18px;
}

.pm-full-button {
  width: 100%;
  margin-top: 16px;
}

.pm-auth-copy {
  margin: 0 0 12px;
  color: var(--pm-muted);
  font-size: 0.68rem;
  line-height: 1.55;
}

.pm-auth-error {
  min-height: 18px;
  margin: 8px 0 0;
  color: var(--pm-red);
  font-size: 0.65rem;
}

.pm-settings-section {
  border-top: 1px solid var(--pm-line);
  padding: 18px 0;
}

.pm-settings-section:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.pm-settings-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.pm-settings-title strong,
.pm-settings-title span {
  display: block;
}

.pm-settings-title strong {
  font-size: 0.74rem;
}

.pm-settings-title span {
  margin-top: 4px;
  color: var(--pm-muted);
  font-size: 0.62rem;
}

.pm-settings-title > div:last-child,
.pm-settings-actions {
  display: flex;
  gap: 6px;
}

.pm-settings-title button,
.pm-settings-actions button {
  min-height: 30px;
  border: 1px solid var(--pm-line);
  border-radius: 5px;
  padding: 0 8px;
  color: var(--pm-text);
  background: var(--pm-bg);
  cursor: pointer;
  font-size: 0.62rem;
}

.pm-settings-actions {
  margin-top: 13px;
}

.pm-settings-results {
  max-height: 200px;
  margin-top: 12px;
  overflow: auto;
  color: var(--pm-muted);
  font-size: 0.64rem;
}

.pm-settings-results p {
  margin: 0;
}

.pm-settings-results strong,
.pm-settings-results span {
  display: block;
  border-bottom: 1px solid var(--pm-line);
  padding: 7px 2px;
}

.pm-settings-section details {
  margin-top: 13px;
  color: var(--pm-muted);
  font-size: 0.63rem;
}

.pm-settings-section summary {
  cursor: pointer;
}

.pm-settings-section pre {
  max-height: 230px;
  overflow: auto;
  color: var(--pm-text);
  font-size: 0.6rem;
  line-height: 1.5;
  white-space: pre-wrap;
}

.pm-toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 100;
  max-width: min(380px, calc(100vw - 36px));
  border: 1px solid var(--pm-line);
  border-radius: 6px;
  padding: 10px 12px;
  opacity: 0;
  color: var(--pm-text);
  background: var(--pm-bg);
  box-shadow: 0 10px 28px rgb(0 0 0 / 16%);
  font-size: 0.67rem;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 140ms ease, transform 140ms ease;
}

.pm-toast.visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 1100px) {
  .pm-appbar {
    grid-template-columns: auto minmax(230px, 1fr) auto;
    gap: 12px;
  }

  .pm-sync-state {
    display: none;
  }

  .pm-appbar-actions {
    min-width: 0;
  }

  .pm-layout {
    grid-template-columns: 220px minmax(0, 1fr);
  }

  .pm-project-properties {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }

  .pm-project-summary,
  .pm-dashboard-split,
  .pm-overview-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

@media (max-width: 820px) {
  .pm-appbar {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px 10px;
    padding: 7px 10px;
  }

  .pm-appbar-left {
    min-width: 0;
  }

  .pm-global-search {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .pm-appbar-actions {
    grid-column: 2;
    grid-row: 1;
  }

  .pm-language,
  .pm-appbar-actions .pm-icon-button:last-of-type {
    display: none;
  }

  .pm-layout {
    display: block;
    min-height: calc(100vh - 95px);
  }

  .pm-sidebar {
    position: static;
    display: block;
    width: 100%;
    height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--pm-line);
    padding: 8px 10px;
  }

  .pm-workspace-switcher,
  .pm-sidebar-heading,
  .pm-sidebar-bottom {
    display: none;
  }

  .pm-create-button {
    display: inline-flex;
    width: auto;
    margin-right: 5px;
  }

  .pm-primary-nav,
  .pm-sidebar-projects,
  .pm-sidebar-projects > div:last-child {
    display: inline-flex;
    max-width: 100%;
    margin: 0;
    border: 0;
    padding: 0;
    overflow-x: auto;
    vertical-align: middle;
    scrollbar-width: none;
  }

  .pm-primary-nav {
    width: calc(100% - 112px);
  }

  .pm-primary-nav button {
    display: flex;
    flex: 0 0 auto;
    gap: 5px;
    padding-inline: 9px;
  }

  .pm-sidebar-projects {
    display: flex;
    width: 100%;
    margin-top: 7px;
  }

  .pm-sidebar-project {
    flex: 0 0 184px;
  }

  .pm-main-toolbar {
    position: static;
    align-items: flex-start;
    flex-direction: column;
    padding: 8px 12px;
  }

  .pm-toolbar-actions {
    width: 100%;
    overflow-x: auto;
  }

  .pm-page {
    padding: 24px 16px 48px;
  }

  .pm-metrics-band {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pm-metrics-band > div:nth-child(2) {
    border-right: 0;
  }

  .pm-metrics-band > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--pm-line);
  }

  .pm-metrics-band > div:first-child,
  .pm-metrics-band > div:nth-child(3) {
    padding-left: 0;
  }

  .pm-page-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .pm-view-toolbar {
    grid-template-columns: 1fr;
  }

  .pm-view-toolbar > span {
    text-align: left;
  }

  .pm-project-title-line {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 9px;
  }

  .pm-project-title-line > button {
    width: 40px;
    height: 40px;
  }

  .pm-project-title-line > input {
    min-height: 44px;
    font-size: 1.38rem;
  }

  .pm-project-header > textarea {
    width: calc(100% - 49px);
    margin-left: 49px;
  }

  .pm-project-properties {
    grid-template-columns: 1fr;
  }

  .pm-project-summary {
    grid-template-columns: 1fr;
  }

  .pm-project-summary dl {
    border-top: 1px solid var(--pm-line);
    padding-top: 14px;
  }

  .pm-project-summary dl > div:first-child {
    border-left: 0;
    padding-left: 0;
  }

  .pm-doc-block {
    grid-template-columns: 1fr;
  }

  .pm-block-tools {
    opacity: 1;
  }

  .pm-peek {
    top: 95px;
    width: min(100vw, 420px);
  }

  .pm-dialog-grid {
    grid-template-columns: 1fr;
  }

  .pm-field-wide {
    grid-column: auto;
  }
}

@media (max-width: 480px) {
  .pm-brand strong,
  .pm-app-divider {
    display: none;
  }

  .pm-appbar-left {
    min-width: 64px;
  }

  .pm-appbar-actions {
    gap: 5px;
  }

  .pm-auth-button {
    padding-inline: 8px;
  }

  .pm-page-heading h1 {
    font-size: 1.35rem;
  }

  .pm-metrics-band > div {
    padding: 13px 10px;
  }

  .pm-project-tabs {
    gap: 15px;
  }

  .pm-project-summary dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 0;
  }

  .pm-project-summary dl > div:nth-child(3) {
    border-left: 0;
    padding-left: 0;
  }

  .pm-dialog {
    padding: 16px;
  }

  .pm-settings-title {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* PLM workspace and aligned PDM child module */
.plm-app-shell {
  width: min(1560px, calc(100% - 32px));
  margin: 0 auto;
  padding: 18px 0 36px;
}

.plm-app-shell .platform-command-bar {
  margin-bottom: 12px;
}

.plm-module-bar {
  display: grid;
  grid-template-columns: minmax(190px, 0.7fr) minmax(420px, 2fr) auto;
  align-items: center;
  gap: 20px;
  min-height: 58px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--line);
  padding: 0 2px 12px;
}

.plm-module-context span,
.plm-module-context strong {
  display: block;
}

.plm-module-context span {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 700;
}

.plm-module-context strong {
  margin-top: 3px;
  font-size: 0.9rem;
}

.plm-subnav {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}

.plm-subnav::-webkit-scrollbar {
  display: none;
}

.plm-subnav a {
  min-height: 34px;
  flex: 0 0 auto;
  border-bottom: 2px solid transparent;
  padding: 8px 12px 7px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
}

.plm-subnav a:hover {
  color: var(--text);
  background: color-mix(in srgb, var(--accent-2) 8%, transparent);
}

.plm-subnav a.active {
  border-bottom-color: var(--accent-2);
  color: var(--text);
}

.plm-module-actions,
.plm-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.plm-open-pdm {
  min-width: 96px;
}

.plm-overview-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  border-bottom: 1px solid var(--line);
  padding: 26px 2px 24px;
}

.plm-overview-head h1 {
  font-size: 2.05rem;
}

.plm-overview-head > div:first-child > p:last-child {
  max-width: 760px;
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.6;
}

.plm-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
}

.plm-kpis article {
  min-width: 0;
  border-right: 1px solid var(--line);
  padding: 20px 22px;
}

.plm-kpis article:first-child {
  padding-left: 2px;
}

.plm-kpis article:last-child {
  border-right: 0;
}

.plm-kpis span,
.plm-kpis strong,
.plm-kpis small {
  display: block;
}

.plm-kpis span,
.plm-kpis small {
  color: var(--muted);
}

.plm-kpis span {
  font-size: 0.75rem;
  font-weight: 700;
}

.plm-kpis strong {
  margin-top: 8px;
  font-size: 1.65rem;
  line-height: 1;
}

.plm-kpis small {
  margin-top: 7px;
  font-size: 0.7rem;
}

.plm-section {
  min-width: 0;
  margin-top: 28px;
}

.plm-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  min-height: 42px;
  margin-bottom: 10px;
}

.plm-section-heading span,
.plm-section-heading h2 {
  display: block;
}

.plm-section-heading span {
  margin-bottom: 4px;
  color: var(--accent);
  font-size: 0.68rem;
  font-weight: 850;
  text-transform: uppercase;
}

.plm-section-heading h2 {
  margin: 0;
  font-size: 1rem;
}

.plm-section-heading > a {
  color: var(--accent-2);
  font-size: 0.76rem;
  font-weight: 750;
}

.plm-lifecycle-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-block: 1px solid var(--line);
}

.plm-lifecycle-flow a {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 3px 10px;
  min-width: 0;
  border-right: 1px solid var(--line);
  padding: 16px;
}

.plm-lifecycle-flow a:first-child {
  padding-left: 2px;
}

.plm-lifecycle-flow a:last-child {
  border-right: 0;
}

.plm-lifecycle-flow a:hover {
  background: color-mix(in srgb, var(--accent-2) 7%, transparent);
}

.plm-lifecycle-flow a > span {
  grid-row: 1 / 3;
  color: var(--accent-2);
  font-size: 0.72rem;
  font-weight: 850;
}

.plm-lifecycle-flow strong {
  font-size: 0.82rem;
}

.plm-lifecycle-flow small {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plm-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr);
  gap: 34px;
}

.plm-project-list,
.plm-workspace-list {
  border-top: 1px solid var(--line);
}

.plm-project-row {
  display: grid;
  grid-template-columns: 34px minmax(160px, 1fr) 96px 140px 100px;
  align-items: center;
  gap: 12px;
  min-height: 62px;
  border-bottom: 1px solid var(--line);
  padding: 8px 4px;
}

.plm-project-row:hover,
.plm-workspace-list > a:hover {
  background: color-mix(in srgb, var(--accent-2) 7%, transparent);
}

.plm-project-row > span,
.plm-workspace-list > a > span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--accent-2);
  background: color-mix(in srgb, var(--accent-2) 9%, var(--panel));
  font-size: 0.66rem;
  font-weight: 850;
}

.plm-project-row strong,
.plm-project-row small,
.plm-workspace-list strong,
.plm-workspace-list small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plm-project-row strong,
.plm-workspace-list strong {
  font-size: 0.78rem;
}

.plm-project-row small,
.plm-workspace-list small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.68rem;
}

.plm-project-row > i,
.plm-workspace-list > a > i {
  color: var(--accent);
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 750;
}

.plm-project-row time {
  color: var(--muted);
  font-size: 0.68rem;
  text-align: right;
}

.plm-row-progress {
  display: grid;
  grid-template-columns: minmax(70px, 1fr) 34px;
  align-items: center;
  gap: 7px;
}

.plm-row-progress > span {
  display: block;
  height: 5px;
  overflow: hidden;
  border-radius: 3px;
  background: color-mix(in srgb, var(--line) 72%, transparent);
}

.plm-row-progress > span > i {
  display: block;
  height: 100%;
  background: var(--accent-2);
}

.plm-row-progress small {
  margin: 0;
}

.plm-workspace-list > a {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 62px;
  border-bottom: 1px solid var(--line);
  padding: 8px 4px;
}

.plm-empty-state {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 84px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.76rem;
}

.plm-empty-state strong {
  color: var(--text);
}

.plm-empty-state span {
  flex: 1;
}

body.pdm-pm-page.plm-module-page {
  --pm-bg: color-mix(in srgb, var(--panel) 96%, var(--bg));
  --pm-sidebar: color-mix(in srgb, var(--panel-strong) 72%, var(--panel));
  --pm-subtle: color-mix(in srgb, var(--panel-strong) 72%, var(--panel));
  --pm-hover: color-mix(in srgb, var(--accent-2) 8%, var(--panel));
  --pm-text: var(--text);
  --pm-muted: var(--muted);
  --pm-faint: color-mix(in srgb, var(--muted) 62%, transparent);
  --pm-line: var(--line);
  --pm-blue: var(--accent-2);
  --pm-blue-soft: color-mix(in srgb, var(--accent-2) 10%, var(--panel));
  --pm-green: var(--accent);
  --pm-green-soft: color-mix(in srgb, var(--accent) 10%, var(--panel));
  color: var(--text);
  background: var(--bg);
}

.plm-module-page .pm-layout {
  grid-template-columns: 212px minmax(0, 1fr);
  min-height: 680px;
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
  background: var(--pm-bg);
}

.plm-module-page .pm-sidebar {
  position: relative;
  top: auto;
  height: auto;
  min-height: 100%;
  padding: 12px 10px;
  overflow: hidden;
}

.plm-module-page .pm-workspace-switcher {
  min-height: 40px;
  padding-bottom: 8px;
}

.plm-module-page .pm-create-button {
  min-height: 36px;
  border-color: color-mix(in srgb, var(--accent-2) 36%, var(--line));
  border-radius: 6px;
  color: var(--accent-2);
  background: color-mix(in srgb, var(--accent-2) 9%, var(--pm-bg));
  font-size: 0.76rem;
}

.plm-module-page .pm-primary-nav button,
.plm-module-page .pm-sidebar-project {
  border-radius: 5px;
  font-size: 0.76rem;
}

.plm-module-page .pm-sidebar-projects {
  padding-top: 10px;
}

.plm-module-page .pm-sidebar-project strong {
  font-size: 0.72rem;
}

.plm-module-page .pm-sidebar-project small,
.plm-module-page .pm-sidebar-heading,
.plm-module-page .pm-primary-nav button small {
  font-size: 0.64rem;
}

.plm-module-page .pm-main-toolbar {
  position: relative;
  top: auto;
  min-height: 58px;
  padding: 9px 16px;
  background: var(--pm-bg);
  backdrop-filter: none;
}

.pm-toolbar-context {
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
  flex: 1;
}

.plm-module-page .pm-breadcrumb {
  flex: 0 1 auto;
  font-size: 0.72rem;
}

.plm-module-page .pm-global-search {
  width: min(390px, 44vw);
  margin-left: auto;
}

.plm-module-page .pm-global-search > input {
  min-height: 34px;
  border-color: var(--line);
  border-radius: 6px;
  background: var(--field-bg);
  font-size: 0.74rem;
}

.plm-module-page .pm-button,
.plm-module-page .pm-section-heading button,
.plm-module-page .pm-view-toolbar button,
.plm-module-page .pm-add-block button {
  min-height: 34px;
  border-radius: 6px;
  font-size: 0.75rem;
}

.plm-module-page .pm-button-primary {
  border-color: var(--accent-2);
  background: var(--accent-2);
}

.plm-module-page .pm-page {
  width: 100%;
  padding: 24px clamp(18px, 2.5vw, 36px) 46px;
}

.plm-module-page .pm-page-heading {
  margin-bottom: 18px;
}

.plm-module-page .pm-page-heading h1 {
  font-size: 1.35rem;
}

.plm-module-page .pm-page-heading p {
  margin-top: 4px;
  font-size: 0.78rem;
}

.plm-module-page .pm-metrics-band {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 22px;
}

.plm-module-page .pm-metrics-band > div {
  padding: 14px 18px;
}

.plm-module-page .pm-metrics-band span {
  font-size: 0.72rem;
}

.plm-module-page .pm-metrics-band strong {
  font-size: 1.35rem;
}

.plm-module-page .pm-metrics-band small {
  font-size: 0.66rem;
}

.plm-module-page .pm-section {
  margin-top: 22px;
}

.plm-module-page .pm-section-heading p {
  display: none;
}

.plm-module-page .pm-section-heading h2 {
  font-size: 0.9rem;
}

.plm-module-page .pm-data-table,
.plm-module-page .pm-title-cell strong,
.plm-module-page .pm-task-title strong {
  font-size: 0.73rem;
}

.plm-module-page .pm-data-table th,
.plm-module-page .pm-title-cell small,
.plm-module-page .pm-task-title small {
  font-size: 0.64rem;
}

.plm-module-page .pm-data-table th,
.plm-module-page .pm-data-table td {
  height: 48px;
}

.plm-module-page .pm-view-toolbar {
  margin-top: 0;
}

.plm-module-page .pm-project-title-line > input {
  min-height: 42px;
  font-size: 1.42rem;
}

.plm-module-page .pm-project-title-line > button {
  width: 42px;
  height: 42px;
}

.plm-module-page .pm-project-header > textarea {
  width: calc(100% - 54px);
  margin: 6px 0 0 54px;
}

.plm-module-page .pm-project-properties {
  margin-top: 12px;
}

.plm-module-page .pm-sync-state {
  font-size: 0.72rem;
}

@media (max-width: 1180px) {
  .plm-module-bar {
    grid-template-columns: minmax(170px, 0.65fr) minmax(360px, 2fr);
  }

  .plm-module-actions,
  .plm-open-pdm {
    grid-column: 1 / -1;
    justify-self: end;
  }

  .plm-overview-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .plm-project-row {
    grid-template-columns: 34px minmax(160px, 1fr) 90px 130px;
  }

  .plm-project-row time {
    display: none;
  }
}

@media (max-width: 820px) {
  .plm-app-shell {
    width: min(100% - 20px, 1560px);
    padding-top: 10px;
  }

  .plm-module-bar {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .plm-subnav {
    width: 100%;
  }

  .plm-module-actions,
  .plm-open-pdm {
    align-self: stretch;
    justify-content: space-between;
  }

  .plm-overview-head {
    align-items: flex-start;
    flex-direction: column;
    padding-top: 18px;
  }

  .plm-overview-head h1 {
    font-size: 1.6rem;
  }

  .plm-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .plm-kpis article:nth-child(2) {
    border-right: 0;
  }

  .plm-kpis article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }

  .plm-kpis article:nth-child(3) {
    padding-left: 2px;
  }

  .plm-lifecycle-flow {
    grid-template-columns: 1fr;
  }

  .plm-lifecycle-flow a,
  .plm-lifecycle-flow a:first-child {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 12px 2px;
  }

  .plm-lifecycle-flow a:last-child {
    border-bottom: 0;
  }

  .plm-module-page .pm-layout {
    display: block;
    min-height: 0;
  }

  .plm-module-page .pm-sidebar {
    min-height: 0;
  }

  .plm-module-page .pm-toolbar-context {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
    gap: 7px;
  }

  .plm-module-page .pm-global-search {
    width: 100%;
    margin-left: 0;
  }

  .plm-module-page .pm-metrics-band {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .plm-module-page .pm-metrics-band > div:nth-child(2) {
    border-right: 1px solid var(--pm-line);
  }

  .plm-module-page .pm-metrics-band > div:nth-child(-n + 2) {
    border-bottom: 0;
  }

  .plm-module-page .pm-main-toolbar {
    align-items: stretch;
  }

  .plm-project-row {
    grid-template-columns: 34px minmax(0, 1fr) 80px;
  }

  .plm-project-row .plm-row-progress {
    display: none;
  }
}

@media (max-width: 560px) {
  .plm-app-shell .platform-command-bar {
    display: flex;
    min-height: 38px;
    margin-bottom: 8px;
    padding-block: 5px;
  }

  .plm-app-shell .platform-services,
  .plm-app-shell .platform-operations,
  .plm-module-context,
  .plm-overview-page .auth-status,
  .plm-module-page .auth-status,
  .plm-overview-page .language-switch > span,
  .plm-module-page .language-switch > span {
    display: none;
  }

  .plm-overview-page .language-switch,
  .plm-module-page .language-switch {
    padding-left: 5px;
  }

  .plm-head-actions {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
  }

  .plm-kpis article {
    padding: 16px 12px;
  }

  .plm-module-page .pm-metrics-band {
    grid-template-columns: 1fr;
  }

  .plm-module-page .pm-metrics-band > div,
  .plm-module-page .pm-metrics-band > div:first-child,
  .plm-module-page .pm-metrics-band > div:nth-child(2) {
    border-right: 0;
    border-bottom: 1px solid var(--pm-line);
    padding-left: 0;
  }

  .plm-module-page .pm-metrics-band > div:last-child {
    border-bottom: 0;
  }

  .plm-project-row {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .plm-project-row > i {
    display: none;
  }

  .plm-empty-state {
    align-items: flex-start;
    flex-direction: column;
    padding: 14px 0;
  }
}

/* Seller center v2 */
.seller-center-v2 {
  --seller-orange: #ee4d2d;
  --seller-orange-dark: #d63e22;
  --seller-ink: #222222;
  --seller-muted: #6b7280;
  --seller-line: #e5e7eb;
  --seller-bg: #f5f6f8;
  --seller-surface: #ffffff;
  --seller-blue: #2563a6;
  --seller-green: #16855b;
  --seller-amber: #b86b09;
  min-width: 320px;
  background: var(--seller-bg);
  color: var(--seller-ink);
  font-family: Inter, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

body.seller-center-v2 {
  background: var(--seller-bg);
}

.seller-center-v2 .seller-main > .platform-command-bar {
  display: none;
}

.seller-center-v2 button,
.seller-center-v2 input,
.seller-center-v2 select,
.seller-center-v2 textarea {
  font: inherit;
}

.seller-center-v2 button:focus-visible,
.seller-center-v2 a:focus-visible,
.seller-center-v2 input:focus-visible,
.seller-center-v2 select:focus-visible,
.seller-center-v2 textarea:focus-visible {
  outline: 2px solid var(--seller-blue);
  outline-offset: 2px;
}

.seller-topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  display: grid;
  grid-template-columns: 232px minmax(280px, 600px) 1fr auto;
  min-height: 64px;
  align-items: center;
  gap: 20px;
  border-bottom: 1px solid #dfe3e8;
  padding: 0 22px;
  background: var(--seller-surface);
  box-shadow: 0 1px 4px rgb(15 23 42 / 7%);
}

.seller-brand {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
  color: var(--seller-ink);
  text-decoration: none;
}

.seller-brand-mark,
.seller-store-logo {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  background: var(--seller-orange);
  color: #ffffff;
  font-weight: 900;
}

.seller-brand-mark {
  width: 32px;
  height: 32px;
  border-radius: 4px;
  font-size: 18px;
}

.seller-brand > span:last-child,
.seller-store-card > span:nth-child(2) {
  display: grid;
  min-width: 0;
  gap: 1px;
}

.seller-brand strong {
  font-size: 16px;
  line-height: 1.15;
}

.seller-brand small,
.seller-store-card small {
  overflow: hidden;
  color: var(--seller-muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.seller-global-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
}

.seller-global-search > span {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  clip: rect(0 0 0 0);
}

.seller-global-search input {
  min-width: 0;
  height: 38px;
  border: 1px solid #d7dce2;
  border-right: 0;
  border-radius: 4px 0 0 4px;
  padding: 0 13px;
  background: #fafafa;
  color: var(--seller-ink);
  font-size: 13px;
}

.seller-global-search button {
  min-width: 72px;
  border: 0;
  border-radius: 0 4px 4px 0;
  background: var(--seller-orange);
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  box-shadow: none;
}

.seller-global-search button:hover,
.seller-center-v2 .button.primary:hover {
  background: var(--seller-orange-dark);
}

.seller-top-links {
  display: flex;
  min-width: 0;
  justify-content: flex-end;
  gap: 18px;
}

.seller-top-links a,
.seller-account button {
  color: #4b5563;
  font-size: 12px;
  font-weight: 650;
  text-decoration: none;
}

.seller-top-links a:hover,
.seller-account button:hover {
  color: var(--seller-orange);
}

.seller-account {
  display: flex;
  align-items: center;
  gap: 10px;
}

.seller-account .auth-status {
  display: inline-flex;
  max-width: 150px;
  align-items: center;
  gap: 6px;
  overflow: hidden;
  color: var(--seller-ink);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.seller-account button {
  border: 0;
  padding: 5px;
  background: transparent;
  box-shadow: none;
}

.seller-layout {
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  min-height: calc(100vh - 64px);
}

.seller-center-v2 .commerce-admin-sidebar {
  position: sticky;
  top: 64px;
  align-self: start;
  width: auto;
  height: calc(100vh - 64px);
  overflow-y: auto;
  border-right: 1px solid var(--seller-line);
  background: var(--seller-surface);
}

.seller-store-card {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid var(--seller-line);
  padding: 17px 15px;
}

.seller-store-logo {
  width: 38px;
  height: 38px;
  border-radius: 4px;
  background: #26364a;
  font-size: 12px;
}

.seller-store-card strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.seller-store-card > b {
  width: 8px;
  height: 8px;
  overflow: hidden;
  border-radius: 50%;
  background: var(--seller-green);
  color: transparent;
}

.seller-center-v2 .commerce-admin-sidebar nav {
  display: grid;
  gap: 0;
  padding: 8px 0;
}

.seller-center-v2 .commerce-admin-sidebar nav section {
  display: grid;
  gap: 2px;
  padding: 8px 0;
}

.seller-center-v2 .commerce-admin-sidebar nav section > span {
  padding: 0 18px 5px;
  color: #9aa1aa;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.seller-center-v2 .commerce-admin-sidebar nav button {
  display: grid;
  width: 100%;
  min-height: 48px;
  gap: 2px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0;
  padding: 8px 15px;
  background: transparent;
  color: #343a40;
  font-size: 13px;
  font-weight: 700;
  text-align: left;
  box-shadow: none;
}

.seller-center-v2 .commerce-admin-sidebar nav button small {
  color: #9299a3;
  font-size: 10px;
  font-weight: 500;
}

.seller-center-v2 .commerce-admin-sidebar nav button:hover,
.seller-center-v2 .commerce-admin-sidebar nav button.is-active {
  border-left-color: var(--seller-orange);
  background: #fff4f1;
  color: var(--seller-orange-dark);
}

.seller-center-v2 .commerce-admin-sidebar-status {
  margin: 8px 15px 18px;
  border: 1px solid var(--seller-line);
  border-radius: 4px;
  padding: 11px;
  background: #fafafa;
}

.seller-center-v2 .commerce-admin-sidebar-status span,
.seller-center-v2 .commerce-admin-sidebar-status small {
  font-size: 10px;
}

.seller-center-v2 .commerce-admin-sidebar-status strong {
  margin: 4px 0;
  color: var(--seller-blue);
  font-size: 12px;
}

.seller-center-v2 .seller-main {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 0 24px 40px;
}

.seller-pagebar {
  display: flex;
  min-height: 78px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--seller-line);
  margin-bottom: 18px;
}

.seller-pagebar > div:first-child {
  display: grid;
  gap: 4px;
}

.seller-pagebar > div:first-child > span {
  color: var(--seller-muted);
  font-size: 11px;
}

.seller-pagebar h1 {
  margin: 0;
  color: var(--seller-ink);
  font-size: 22px;
  font-weight: 750;
  letter-spacing: 0;
}

.seller-page-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}

.seller-page-actions > span {
  color: var(--seller-muted);
  font-size: 11px;
}

.seller-center-v2 .button {
  min-height: 36px;
  border-radius: 4px;
  padding: 7px 13px;
  font-size: 12px;
  font-weight: 700;
}

.seller-center-v2 .button.primary {
  border-color: var(--seller-orange);
  background: var(--seller-orange);
  color: #ffffff;
}

.seller-center-v2 .button.secondary {
  border-color: #d7dce2;
  background: var(--seller-surface);
  color: #374151;
}

.seller-center-v2 .commerce-admin-panel {
  min-width: 0;
  border: 1px solid var(--seller-line);
  border-radius: 4px;
  background: var(--seller-surface);
  box-shadow: 0 1px 2px rgb(15 23 42 / 4%);
}

.seller-center-v2 .commerce-admin-panel[hidden] {
  display: none !important;
}

.seller-center-v2 .seller-dashboard {
  display: grid;
  gap: 16px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.seller-welcome {
  display: flex;
  min-height: 96px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border: 1px solid var(--seller-line);
  border-left: 4px solid var(--seller-orange);
  border-radius: 4px;
  padding: 18px 20px;
  background: var(--seller-surface);
}

.seller-welcome > div {
  display: grid;
  gap: 4px;
}

.seller-welcome span,
.seller-center-v2 .commerce-admin-panel-head > div > span {
  color: var(--seller-orange-dark);
  font-size: 10px;
  font-weight: 800;
}

.seller-welcome h2,
.seller-center-v2 .commerce-admin-panel-head h2 {
  margin: 0;
  color: var(--seller-ink);
  font-size: 20px;
  font-weight: 750;
  letter-spacing: 0;
}

.seller-welcome p,
.seller-center-v2 .commerce-admin-panel-head p {
  max-width: none;
  border: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  color: var(--seller-muted);
  font-size: 12px;
  line-height: 1.5;
}

.seller-welcome > p {
  max-width: 440px;
  border: 1px solid #f2c8bf;
  border-radius: 4px;
  padding: 9px 11px;
  background: #fff7f5;
  color: #9b341f;
}

.seller-section,
.seller-queue-grid > section {
  border: 1px solid var(--seller-line);
  border-radius: 4px;
  background: var(--seller-surface);
}

.seller-workflow {
  border: 1px solid var(--seller-line);
  border-radius: 4px;
  background: var(--seller-surface);
}

.seller-workflow > header {
  display: flex;
  min-height: 64px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--seller-line);
  padding: 12px 16px;
}

.seller-workflow > header h3 {
  margin: 0;
  color: var(--seller-ink);
  font-size: 15px;
  letter-spacing: 0;
}

.seller-workflow > header span {
  color: var(--seller-muted);
  font-size: 10px;
}

.seller-workflow-stages {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.seller-workflow-stages button {
  display: grid;
  min-height: 98px;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 0;
  border-right: 1px solid var(--seller-line);
  border-radius: 0;
  padding: 14px;
  background: transparent;
  color: var(--seller-ink);
  text-align: left;
  box-shadow: none;
}

.seller-workflow-stages button:last-child {
  border-right: 0;
}

.seller-workflow-stages button:hover {
  background: #fff8f6;
}

.seller-workflow-stages button > b {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid #efb7aa;
  border-radius: 4px;
  color: var(--seller-orange-dark);
  font-size: 12px;
}

.seller-workflow-stages button > span {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.seller-workflow-stages strong {
  font-size: 12px;
}

.seller-workflow-stages small {
  overflow: hidden;
  color: var(--seller-muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.seller-workflow-stages em {
  min-width: 24px;
  color: var(--seller-orange);
  font-size: 20px;
  font-style: normal;
  font-weight: 800;
  text-align: right;
}

.seller-section > header,
.seller-performance > header,
.seller-center-v2 .commerce-admin-worklist > header,
.seller-analytics-grid > section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--seller-line);
  padding: 14px 16px;
}

.seller-section > header h3,
.seller-center-v2 .commerce-admin-worklist > header h3,
.seller-analytics-grid > section > header h3 {
  margin: 0;
  color: var(--seller-ink);
  font-size: 15px;
  font-weight: 750;
  letter-spacing: 0;
}

.seller-section > header span,
.seller-center-v2 .commerce-admin-worklist > header span,
.seller-analytics-grid > section > header span {
  color: var(--seller-muted);
  font-size: 10px;
}

.seller-section > header button,
.seller-center-v2 .commerce-admin-worklist > header button {
  border: 0;
  padding: 4px;
  background: transparent;
  color: var(--seller-blue);
  font-size: 11px;
  font-weight: 700;
  box-shadow: none;
}

.seller-todo-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(115px, 1fr));
}

.seller-todo-grid button {
  display: grid;
  min-height: 118px;
  place-content: center;
  gap: 5px;
  border: 0;
  border-right: 1px solid var(--seller-line);
  border-radius: 0;
  padding: 14px;
  background: transparent;
  color: var(--seller-ink);
  text-align: center;
  box-shadow: none;
}

.seller-todo-grid button:last-child {
  border-right: 0;
}

.seller-todo-grid button:hover {
  background: #fff8f6;
}

.seller-todo-grid strong {
  color: var(--seller-orange);
  font-size: 24px;
  line-height: 1;
}

.seller-todo-grid span {
  font-size: 12px;
  font-weight: 750;
}

.seller-todo-grid small {
  color: var(--seller-muted);
  font-size: 10px;
}

.seller-center-v2 .commerce-admin-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  border: 0;
  padding: 0;
}

.seller-center-v2 .commerce-admin-metrics article,
.seller-center-v2 .commerce-admin-metrics button {
  display: grid;
  min-height: 112px;
  align-content: center;
  gap: 7px;
  border: 0;
  border-right: 1px solid var(--seller-line);
  border-radius: 0;
  padding: 18px;
  background: transparent;
  color: var(--seller-ink);
  text-align: left;
  box-shadow: none;
}

.seller-center-v2 .commerce-admin-metrics > :last-child {
  border-right: 0;
}

.seller-center-v2 .commerce-admin-metrics button:hover {
  background: #f8fafc;
}

.seller-center-v2 .commerce-admin-metrics span,
.seller-center-v2 .commerce-admin-metrics small {
  color: var(--seller-muted);
  font-size: 11px;
}

.seller-center-v2 .commerce-admin-metrics strong {
  color: var(--seller-ink);
  font-size: 22px;
  font-weight: 750;
}

.seller-trend-chart {
  display: grid;
  grid-template-columns: repeat(7, minmax(34px, 1fr));
  align-items: end;
  gap: 8px;
  min-height: 150px;
  border-top: 1px solid var(--seller-line);
  padding: 16px 18px 12px;
}

.seller-trend-chart article {
  display: grid;
  min-width: 0;
  gap: 4px;
  text-align: center;
}

.seller-trend-chart article > div {
  display: flex;
  height: 84px;
  align-items: flex-end;
  justify-content: center;
  border-bottom: 1px solid #d7dce2;
}

.seller-trend-chart article > div > span {
  width: min(32px, 70%);
  min-height: 4px;
  border-radius: 3px 3px 0 0;
  background: var(--seller-orange);
}

.seller-trend-chart strong,
.seller-trend-chart small {
  overflow: hidden;
  color: var(--seller-muted);
  font-size: 10px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.seller-trend-chart small {
  color: #9aa1aa;
}

.seller-queue-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.seller-center-v2 .commerce-admin-worklist {
  min-width: 0;
  border: 1px solid var(--seller-line);
  border-radius: 4px;
  background: var(--seller-surface);
}

.seller-center-v2 .commerce-admin-worklist > div {
  min-height: 190px;
  padding: 0 16px;
}

.seller-center-v2 .commerce-admin-worklist > div > button,
.seller-center-v2 .commerce-admin-worklist > div > article {
  min-height: 44px;
  border-color: var(--seller-line);
  padding: 9px 0;
}

.seller-center-v2 .commerce-admin-worklist strong,
.seller-center-v2 .commerce-admin-worklist b {
  color: var(--seller-ink);
  font-size: 12px;
}

.seller-center-v2 .commerce-admin-worklist small,
.seller-center-v2 .commerce-admin-worklist article > span {
  color: var(--seller-muted);
  font-size: 10px;
}

.seller-center-v2 .commerce-admin-worklist b[data-stock="low"] { color: var(--seller-amber); }
.seller-center-v2 .commerce-admin-worklist b[data-stock="out"] { color: #c43c3c; }
.seller-center-v2 .commerce-worklist-empty { min-height: 160px; font-size: 12px; }

.seller-center-v2 .commerce-admin-panel-head {
  display: flex;
  min-height: 86px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--seller-line);
  padding: 17px 20px;
}

.seller-center-v2 .commerce-admin-panel-head > div {
  display: grid;
  gap: 3px;
}

.seller-center-v2 .commerce-admin-panel-head > span {
  color: var(--seller-muted);
  font-size: 11px;
}

.seller-status-tabs {
  display: flex;
  min-width: 0;
  gap: 26px;
  overflow-x: auto;
  border-bottom: 1px solid var(--seller-line);
  padding: 0 20px;
}

.seller-status-tabs button {
  min-height: 49px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0 2px;
  background: transparent;
  color: #5f6670;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: none;
}

.seller-status-tabs button.is-active {
  border-bottom-color: var(--seller-orange);
  color: var(--seller-orange-dark);
}

.seller-status-tabs b {
  margin-left: 4px;
  color: inherit;
  font-size: 11px;
}

.seller-center-v2 .commerce-admin-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) repeat(2, minmax(145px, 0.28fr)) auto;
  align-items: end;
  gap: 12px;
  border-bottom: 1px solid var(--seller-line);
  padding: 14px 20px;
  background: #fafafa;
}

.seller-center-v2 .commerce-admin-toolbar.single-filter {
  grid-template-columns: minmax(260px, 560px);
}

.seller-center-v2 .commerce-admin-toolbar label {
  gap: 5px;
}

.seller-center-v2 .commerce-admin-toolbar label > span,
.seller-center-v2 .commerce-admin-toolbar > span {
  color: var(--seller-muted);
  font-size: 10px;
  font-weight: 700;
}

.seller-center-v2 .commerce-admin-toolbar input,
.seller-center-v2 .commerce-admin-toolbar select,
.seller-center-v2 .commerce-admin-table select,
.seller-bulkbar select {
  min-height: 36px;
  border: 1px solid #d7dce2;
  border-radius: 4px;
  padding: 6px 10px;
  background: var(--seller-surface);
  color: var(--seller-ink);
  font-size: 12px;
}

.seller-bulkbar {
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid #f2c8bf;
  padding: 10px 20px;
  background: #fff7f5;
}

.seller-bulkbar[hidden] { display: none !important; }
.seller-bulkbar strong { margin-right: auto; color: #8b3726; font-size: 12px; }
.seller-bulkbar select { min-width: 150px; }

.seller-center-v2 .commerce-admin-table {
  min-width: 940px;
}

.seller-center-v2 .commerce-admin-table th,
.seller-center-v2 .commerce-admin-table td {
  border-bottom-color: var(--seller-line);
  padding: 12px 14px;
  color: #3f4650;
  font-size: 12px;
}

.seller-center-v2 .commerce-admin-table th {
  background: #fafafa;
  color: #6f7680;
  font-size: 10px;
  font-weight: 800;
}

.seller-center-v2 .commerce-admin-table td > strong,
.seller-center-v2 .commerce-admin-table td > span {
  font-size: 12px;
}

.seller-center-v2 .commerce-admin-table td > span {
  margin-top: 3px;
  color: var(--seller-muted);
  font-size: 10px;
}

.seller-center-v2 .commerce-admin-table td > button {
  min-height: 30px;
  border-color: #d7dce2;
  border-radius: 4px;
  color: var(--seller-blue);
  font-size: 11px;
}

.seller-check-cell {
  width: 36px;
  min-width: 36px;
  text-align: center !important;
}

.seller-check-cell input {
  width: 15px;
  height: 15px;
  accent-color: var(--seller-orange);
}

.seller-center-v2 .commerce-product-cell {
  grid-template-columns: 42px minmax(0, 1fr);
  min-width: 230px;
}

.seller-center-v2 .commerce-product-cell > span {
  width: 40px;
  height: 40px;
  border-radius: 3px;
  background: #edf3f8;
  color: var(--seller-blue);
  font-size: 10px;
}

.seller-center-v2 .commerce-product-cell strong { font-size: 12px; }
.seller-center-v2 .commerce-product-cell small { font-size: 10px; }

.seller-center-v2 .commerce-status {
  border-radius: 3px;
  padding: 4px 7px;
  font-size: 10px !important;
}

.seller-center-v2 .commerce-status[data-status="active"],
.seller-center-v2 .commerce-status[data-status="fulfilled"] { border-color: #b8decf; background: #f1faf6; color: var(--seller-green); }
.seller-center-v2 .commerce-status[data-status="pending"],
.seller-center-v2 .commerce-status[data-status="draft"] { border-color: #ead3ad; background: #fff9ed; color: var(--seller-amber); }
.seller-center-v2 .commerce-status[data-status="cancelled"],
.seller-center-v2 .commerce-status[data-status="inactive"] { border-color: #efc5c5; background: #fff5f5; color: #b63c3c; }

.seller-marketing-summary,
.seller-finance-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  border-bottom: 1px solid var(--seller-line);
}

.seller-marketing-summary article,
.seller-finance-metrics article {
  display: grid;
  min-height: 112px;
  align-content: center;
  gap: 6px;
  border-right: 1px solid var(--seller-line);
  padding: 18px 20px;
}

.seller-marketing-summary article:last-child,
.seller-finance-metrics article:last-child { border-right: 0; }
.seller-marketing-summary span,
.seller-marketing-summary small,
.seller-finance-metrics span,
.seller-finance-metrics small { color: var(--seller-muted); font-size: 10px; }
.seller-marketing-summary strong,
.seller-finance-metrics strong { color: var(--seller-ink); font-size: 21px; }

.seller-marketing-tools {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 12px;
  border-bottom: 1px solid var(--seller-line);
  padding: 16px 20px;
  background: #fafafa;
}

.seller-marketing-tools button {
  display: grid;
  min-height: 76px;
  gap: 5px;
  border: 1px solid #dfe3e8;
  border-radius: 4px;
  padding: 13px;
  background: var(--seller-surface);
  color: var(--seller-ink);
  text-align: left;
  box-shadow: none;
}

.seller-marketing-tools button:hover { border-color: #f0aa9a; background: #fff9f7; }
.seller-marketing-tools strong { font-size: 12px; }
.seller-marketing-tools span { color: var(--seller-muted); font-size: 10px; line-height: 1.4; }

.seller-analytics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.seller-analytics-grid > section {
  min-width: 0;
  min-height: 310px;
  border-right: 1px solid var(--seller-line);
  border-bottom: 1px solid var(--seller-line);
}

.seller-analytics-grid > section:nth-child(2n) { border-right: 0; }
.seller-analytics-grid > section:nth-last-child(-n + 2) { border-bottom: 0; }
.seller-trend-chart.is-large { min-height: 240px; border-top: 0; }
.seller-trend-chart.is-large article > div { height: 150px; }

.seller-status-breakdown,
.seller-top-products {
  display: grid;
  gap: 14px;
  padding: 20px;
}

.seller-status-breakdown article {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr) 32px;
  align-items: center;
  gap: 10px;
  font-size: 11px;
}

.seller-status-breakdown article > div {
  height: 8px;
  overflow: hidden;
  border-radius: 4px;
  background: #edf0f3;
}

.seller-status-breakdown i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--seller-blue);
}

.seller-status-breakdown strong { text-align: right; }
.seller-top-products article { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.seller-top-products article > b { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 3px; background: #edf3f8; color: var(--seller-blue); font-size: 10px; }
.seller-top-products article > span { position: relative; display: grid; gap: 3px; min-width: 0; padding-bottom: 7px; }
.seller-top-products strong,
.seller-top-products small { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.seller-top-products small { color: var(--seller-muted); font-size: 9px; }
.seller-top-products i { position: absolute; bottom: 0; left: 0; height: 3px; border-radius: 2px; background: var(--seller-orange); }
.seller-top-products em { color: var(--seller-ink); font-size: 10px; font-style: normal; font-weight: 700; }

.seller-conversion {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 30px 20px;
}

.seller-conversion article {
  display: grid;
  min-height: 130px;
  place-content: center;
  gap: 8px;
  border-right: 1px solid var(--seller-line);
  text-align: center;
}

.seller-conversion article:last-child { border-right: 0; }
.seller-conversion span { color: var(--seller-muted); font-size: 10px; }
.seller-conversion strong { color: var(--seller-orange); font-size: 24px; }

.seller-center-v2 .commerce-integration-list > article {
  grid-template-columns: 46px minmax(180px, 0.8fr) auto minmax(250px, 1fr) auto;
  padding: 19px 20px;
}

.seller-center-v2 .commerce-integration-list strong { font-size: 13px; }
.seller-center-v2 .commerce-integration-list small,
.seller-center-v2 .commerce-integration-list article > b,
.seller-center-v2 .commerce-integration-list dt,
.seller-center-v2 .commerce-integration-list dd { font-size: 10px; }

.seller-center-v2 .commerce-product-dialog,
.seller-center-v2 .commerce-order-dialog {
  border-color: var(--seller-line);
  border-radius: 6px;
  color: var(--seller-ink);
}

.seller-center-v2 .commerce-product-dialog .dialog-head h2,
.seller-center-v2 .commerce-order-dialog .dialog-head h2 {
  font-size: 19px;
  letter-spacing: 0;
}

.seller-center-v2 .commerce-product-form-grid label > span,
.seller-center-v2 .commerce-product-dialog .dialog-head span,
.seller-center-v2 .commerce-order-dialog .dialog-head span,
.seller-center-v2 .commerce-product-dialog form > footer > span { font-size: 11px; }

.seller-center-v2 .commerce-product-form-grid input,
.seller-center-v2 .commerce-product-form-grid select,
.seller-center-v2 .commerce-product-form-grid textarea {
  border-color: #d7dce2;
  border-radius: 4px;
  font-size: 12px;
}

.seller-center-v2 .commerce-campaign-dialog { width: min(760px, calc(100vw - 28px)); }
.seller-center-v2 .commerce-campaign-dialog form > footer { grid-template-columns: 1fr auto auto; }
.seller-center-v2 .icon-button { border-radius: 4px; font-size: 18px; }

@media (max-width: 1280px) {
  .seller-topbar { grid-template-columns: 210px minmax(260px, 1fr) auto; }
  .seller-top-links { display: none; }
  .seller-layout { grid-template-columns: 210px minmax(0, 1fr); }
  .seller-todo-grid { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
  .seller-todo-grid button:nth-child(3) { border-right: 0; }
  .seller-todo-grid button:nth-child(-n + 3) { border-bottom: 1px solid var(--seller-line); }
}

@media (max-width: 960px) {
  .seller-topbar { grid-template-columns: auto minmax(220px, 1fr) auto; padding: 0 14px; }
  .seller-brand > span:last-child { display: none; }
  .seller-layout { grid-template-columns: minmax(0, 1fr); }
  .seller-center-v2 .commerce-admin-sidebar { position: static; width: 100%; height: auto; overflow: visible; border-right: 0; border-bottom: 1px solid var(--seller-line); }
  .seller-store-card,
  .seller-center-v2 .commerce-admin-sidebar-status { display: none; }
  .seller-center-v2 .commerce-admin-sidebar nav { display: flex; overflow-x: auto; padding: 0 12px; }
  .seller-center-v2 .commerce-admin-sidebar nav section { display: flex; flex: 0 0 auto; padding: 0; }
  .seller-center-v2 .commerce-admin-sidebar nav section > span,
  .seller-center-v2 .commerce-admin-sidebar nav button small { display: none; }
  .seller-center-v2 .commerce-admin-sidebar nav button { width: auto; min-height: 48px; border-bottom: 2px solid transparent; border-left: 0; padding: 0 14px; white-space: nowrap; }
  .seller-center-v2 .commerce-admin-sidebar nav button:hover,
  .seller-center-v2 .commerce-admin-sidebar nav button.is-active { border-bottom-color: var(--seller-orange); border-left: 0; }
  .seller-center-v2 .seller-main { padding: 0 16px 30px; }
  .seller-center-v2 .commerce-admin-metrics,
  .seller-marketing-summary,
  .seller-finance-metrics { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
  .seller-center-v2 .commerce-admin-metrics > :nth-child(2),
  .seller-marketing-summary article:nth-child(2),
  .seller-finance-metrics article:nth-child(2) { border-right: 0; }
  .seller-center-v2 .commerce-admin-metrics > :nth-child(-n + 2),
  .seller-marketing-summary article:nth-child(-n + 2),
  .seller-finance-metrics article:nth-child(-n + 2) { border-bottom: 1px solid var(--seller-line); }
  .seller-marketing-tools { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
  .seller-center-v2 .commerce-integration-list > article { grid-template-columns: 42px minmax(160px, 1fr) auto; }
  .seller-workflow-stages { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .seller-workflow-stages button:nth-child(2) { border-right: 0; }
  .seller-workflow-stages button:nth-child(-n + 2) { border-bottom: 1px solid var(--seller-line); }
}

@media (max-width: 720px) {
  .seller-topbar { grid-template-columns: auto minmax(0, 1fr); gap: 10px; min-height: 108px; padding-block: 10px; }
  .seller-account { justify-self: end; }
  .seller-global-search { grid-column: 1 / -1; grid-row: 2; }
  .seller-pagebar { align-items: flex-start; flex-direction: column; padding: 14px 0; }
  .seller-page-actions { width: 100%; flex-wrap: wrap; }
  .seller-page-actions > span { width: 100%; }
  .seller-welcome { align-items: flex-start; flex-direction: column; }
  .seller-todo-grid { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .seller-todo-grid button:nth-child(3) { border-right: 1px solid var(--seller-line); }
  .seller-todo-grid button:nth-child(2n) { border-right: 0; }
  .seller-todo-grid button:nth-child(-n + 4) { border-bottom: 1px solid var(--seller-line); }
  .seller-queue-grid,
  .seller-analytics-grid { grid-template-columns: minmax(0, 1fr); }
  .seller-analytics-grid > section { border-right: 0; border-bottom: 1px solid var(--seller-line) !important; }
  .seller-analytics-grid > section:last-child { border-bottom: 0 !important; }
  .seller-center-v2 .commerce-admin-toolbar { grid-template-columns: minmax(0, 1fr); }
  .seller-bulkbar { align-items: stretch; flex-wrap: wrap; }
  .seller-bulkbar strong { width: 100%; }
  .seller-bulkbar select { flex: 1 1 160px; }
  .seller-marketing-tools { grid-template-columns: minmax(0, 1fr); }
  .seller-center-v2 .commerce-admin-panel-head { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 480px) {
  .seller-account .auth-status { max-width: 96px; }
  .seller-center-v2 .seller-main { padding-inline: 10px; }
  .seller-pagebar h1 { font-size: 20px; }
  .seller-center-v2 .commerce-admin-metrics,
  .seller-marketing-summary,
  .seller-finance-metrics { grid-template-columns: minmax(0, 1fr); }
  .seller-center-v2 .commerce-admin-metrics > *,
  .seller-marketing-summary article,
  .seller-finance-metrics article { border-right: 0 !important; border-bottom: 1px solid var(--seller-line); }
  .seller-todo-grid button:last-child,
  .seller-center-v2 .commerce-admin-metrics > :last-child,
  .seller-marketing-summary article:last-child,
  .seller-finance-metrics article:last-child { border-bottom: 0; }
  .seller-todo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .seller-todo-grid button { min-height: 108px; }
  .seller-trend-chart { gap: 3px; padding-inline: 8px; }
  .seller-trend-chart article > div > span { width: 18px; }
  .seller-conversion { grid-template-columns: minmax(0, 1fr); }
  .seller-conversion article { min-height: 90px; border-right: 0; border-bottom: 1px solid var(--seller-line); }
  .seller-conversion article:last-child { border-bottom: 0; }
.seller-center-v2 .commerce-product-form-grid { grid-template-columns: minmax(0, 1fr); }
  .seller-workflow > header { align-items: stretch; flex-direction: column; }
  .seller-workflow-stages { grid-template-columns: minmax(0, 1fr); }
  .seller-workflow-stages button { border-right: 0; border-bottom: 1px solid var(--seller-line); }
  .seller-workflow-stages button:last-child { border-bottom: 0; }
}

/* Engineer-first workbench and AI copilot */
.engineering-integrated-page .engx-lifecycle-metrics {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.engx-sidebar-links {
  display: grid;
  border-top: 1px solid var(--engx-line);
  padding: 10px 8px 14px;
}

.engx-sidebar-links > span {
  padding: 0 7px 6px;
  color: var(--engx-muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.engx-sidebar-links :is(button, a) {
  min-height: 34px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0;
  padding: 8px 9px;
  background: transparent;
  color: var(--engx-text);
  font-size: 11px;
  font-weight: 650;
  text-align: left;
  text-decoration: none;
  box-shadow: none;
}

.engx-sidebar-links :is(button, a):hover {
  border-left-color: var(--engx-blue);
  background: var(--engx-surface);
  color: var(--engx-blue);
}

.platform-industrial-theme .engx-work-view {
  display: grid;
  gap: 12px;
  padding: 0 0 16px;
  background: #f7f8fa;
}

.platform-industrial-theme .engx-work-view[hidden] {
  display: none;
}

.engx-work-view .engx-view-head {
  background: var(--engx-surface);
}

.engx-work-primary-grid,
.engx-work-queue-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0 12px;
}

.engx-focus-panel,
.engx-copilot-panel,
.engx-copilot-output,
.engx-work-queue-grid > section,
.engx-workflow-band {
  min-width: 0;
  border: 1px solid var(--engx-line);
  border-radius: 2px;
  background: var(--engx-surface);
}

.engx-focus-panel > header,
.engx-copilot-panel > header,
.engx-copilot-output > header,
.engx-work-queue-grid > section > header {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--engx-line);
  padding: 10px 12px;
}

.engx-focus-panel > header div,
.engx-copilot-panel > header div,
.engx-copilot-output > header > div:first-child,
.engx-work-queue-grid > section > header div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.engx-focus-panel header span,
.engx-copilot-panel header span,
.engx-copilot-output header span,
.engx-work-queue-grid > section > header span {
  color: var(--engx-muted);
  font-size: 9px;
  font-weight: 800;
}

.engx-focus-panel h3,
.engx-copilot-panel h3,
.engx-copilot-output h3,
.engx-work-queue-grid h3 {
  overflow: hidden;
  margin: 0;
  color: var(--engx-text);
  font-size: 14px;
  letter-spacing: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-focus-panel > header > b,
.engx-copilot-panel > header > b {
  border: 1px solid #cfd6df;
  border-radius: 2px;
  padding: 4px 7px;
  background: #f4f6f8;
  color: var(--engx-blue);
  font-size: 10px;
  white-space: nowrap;
}

.engx-focus-panel > header > b[data-priority="urgent"],
.engx-focus-panel > header > b[data-priority="high"] {
  border-color: #e1b5b1;
  background: #fff4f3;
  color: var(--engx-red);
}

.engx-focus-panel > p {
  min-height: 62px;
  margin: 0;
  padding: 12px;
  color: var(--engx-muted);
  font-size: 12px;
  line-height: 1.6;
}

.engx-focus-panel > dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--engx-line);
}

.engx-focus-panel > dl div {
  display: grid;
  min-width: 0;
  gap: 3px;
  border-right: 1px solid var(--engx-line);
  padding: 10px;
}

.engx-focus-panel > dl div:last-child {
  border-right: 0;
}

.engx-focus-panel dt {
  color: var(--engx-muted);
  font-size: 9px;
}

.engx-focus-panel dd {
  overflow: hidden;
  margin: 0;
  color: var(--engx-text);
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-copilot-modes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 12px 12px 0;
  border: 1px solid var(--engx-line);
}

.engx-copilot-modes button {
  min-height: 32px;
  border: 0;
  border-right: 1px solid var(--engx-line);
  border-radius: 0;
  background: #f5f6f8;
  color: var(--engx-muted);
  font-size: 11px;
  font-weight: 700;
  box-shadow: none;
}

.engx-copilot-modes button:last-child {
  border-right: 0;
}

.engx-copilot-modes button.is-active {
  background: #e8eef8;
  color: var(--engx-blue);
}

.engx-copilot-panel > label {
  display: grid;
  gap: 5px;
  padding: 10px 12px;
}

.engx-copilot-panel > label > span {
  color: var(--engx-muted);
  font-size: 10px;
  font-weight: 700;
}

.engx-copilot-panel textarea {
  width: 100%;
  min-height: 66px;
  resize: vertical;
  font-size: 11px;
  line-height: 1.5;
}

.engx-copilot-panel > .button {
  width: calc(100% - 24px);
  margin: 0 12px 12px;
}

.engx-copilot-output {
  margin: 0 12px;
}

.engx-copilot-output > header > div:last-child {
  display: flex;
  gap: 7px;
}

.engx-ai-work-summary {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  border-bottom: 1px solid var(--engx-line);
}

.engx-ai-work-summary > div {
  display: grid;
  align-content: center;
  border-right: 1px solid var(--engx-line);
  padding: 14px;
}

.engx-ai-work-summary > div span,
.engx-ai-work-summary > div small {
  color: var(--engx-muted);
  font-size: 9px;
}

.engx-ai-work-summary > div strong {
  color: var(--engx-blue);
  font-size: 24px;
}

.engx-ai-work-summary > p {
  display: grid;
  align-content: center;
  gap: 5px;
  margin: 0;
  padding: 14px;
}

.engx-ai-work-summary > p strong {
  font-size: 12px;
}

.engx-ai-work-summary > p span {
  color: var(--engx-muted);
  font-size: 11px;
  line-height: 1.5;
}

.engx-ai-work-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.engx-ai-work-columns > section {
  min-width: 0;
  border-right: 1px solid var(--engx-line);
  padding: 12px;
}

.engx-ai-work-columns > section:last-child {
  border-right: 0;
}

.engx-ai-work-columns h4 {
  margin: 0 0 8px;
  color: var(--engx-text);
  font-size: 11px;
}

.engx-ai-work-columns article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  border-top: 1px solid var(--engx-line);
  padding: 8px 0;
}

.engx-ai-work-columns article > b {
  color: var(--engx-blue);
  font-size: 9px;
}

.engx-ai-work-columns article > b[data-severity="blocker"],
.engx-ai-work-columns article > b[data-severity="high"] {
  color: var(--engx-red);
}

.engx-ai-work-columns article > span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.engx-ai-work-columns article strong,
.engx-ai-work-columns article small,
.engx-ai-work-columns li,
.engx-ai-work-columns p {
  font-size: 10px;
  line-height: 1.45;
}

.engx-ai-work-columns article small,
.engx-ai-work-columns li,
.engx-ai-work-columns p {
  color: var(--engx-muted);
}

.engx-ai-work-columns ul {
  margin: 0;
  padding-left: 16px;
}

.engx-workflow-band {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0 12px;
}

.engx-workflow-band button {
  display: grid;
  min-height: 68px;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  border: 0;
  border-right: 1px solid var(--engx-line);
  border-radius: 0;
  padding: 10px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-workflow-band button:last-child {
  border-right: 0;
}

.engx-workflow-band button:hover {
  background: #f3f6fa;
}

.engx-workflow-band button > b {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  border: 1px solid #b8c9e1;
  border-radius: 2px;
  color: var(--engx-blue);
  font-size: 10px;
}

.engx-workflow-band button > span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.engx-workflow-band strong {
  font-size: 11px;
}

.engx-workflow-band small {
  overflow: hidden;
  color: var(--engx-muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-workflow-band small[data-state="blocked"] {
  color: var(--engx-red);
}

.engx-workflow-band small[data-state="done"] {
  color: var(--engx-green);
}

.engx-work-queue-grid > section > header button {
  border: 0;
  padding: 4px;
  background: transparent;
  color: var(--engx-blue);
  font-size: 10px;
  font-weight: 700;
  box-shadow: none;
}

.engx-work-queue-grid > section > div {
  min-height: 210px;
}

.engx-work-queue-grid > section > div > button {
  display: grid;
  width: 100%;
  min-height: 52px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  border: 0;
  border-bottom: 1px solid var(--engx-line);
  border-radius: 0;
  padding: 9px 12px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-work-queue-grid > section > div > button:last-child {
  border-bottom: 0;
}

.engx-work-queue-grid > section > div > button:hover {
  background: #f5f7fa;
}

.engx-work-queue-grid button > span:not(.engx-work-check) {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.engx-work-queue-grid button strong {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-work-queue-grid button small {
  overflow: hidden;
  color: var(--engx-muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-work-queue-grid button > b {
  color: var(--engx-muted);
  font-size: 9px;
}

.engx-work-queue-grid button > b[data-priority="urgent"],
.engx-work-queue-grid button > b[data-priority="high"] {
  color: var(--engx-red);
}

.engx-work-check,
.engx-work-queue-grid button > i {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #aab2bc;
}

.engx-work-check[data-status="in-progress"] {
  background: var(--engx-blue);
}

.engx-work-check[data-status="review"] {
  background: var(--engx-amber);
}

.engx-work-queue-grid button > i[data-tone="high"] {
  background: var(--engx-red);
}

.engx-work-queue-grid button > i[data-tone="medium"] {
  background: var(--engx-amber);
}

.engx-work-empty {
  display: grid;
  min-height: 210px;
  place-content: center;
  gap: 4px;
  padding: 20px;
  color: var(--engx-muted);
  text-align: center;
}

.engx-work-empty strong {
  color: var(--engx-text);
  font-size: 12px;
}

.engx-work-empty span {
  font-size: 10px;
}

.engx-ai-office-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(230px, 0.7fr);
  align-items: start;
  gap: 12px;
  padding: 0 12px;
}

.engx-ai-office {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--engx-line);
  border-radius: 2px;
  background: var(--engx-surface);
}

.engx-ai-office > header {
  display: flex;
  min-height: 58px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--engx-line);
  padding: 9px 12px;
}

.engx-ai-office-title {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
}

.engx-ai-office-title > span {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 2px;
  background: #173b75;
  color: #ffffff;
  font-size: 10px;
  font-weight: 800;
}

.engx-ai-office-title > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.engx-ai-office-title strong {
  color: var(--engx-text);
  font-size: 13px;
}

.engx-ai-office-title small {
  color: var(--engx-green);
  font-size: 9px;
}

.engx-ai-office > header .engx-copilot-modes {
  width: 138px;
  flex: 0 0 auto;
  margin: 0;
}

.engx-ai-conversation {
  display: grid;
  max-height: 440px;
  min-height: 330px;
  align-content: start;
  gap: 16px;
  overflow-y: auto;
  padding: 18px 16px;
  background: #fbfcfd;
}

.engx-ai-message {
  display: grid;
  width: min(86%, 680px);
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: start;
  gap: 9px;
}

.engx-ai-message.is-user {
  width: min(76%, 580px);
  margin-left: auto;
  grid-template-columns: minmax(0, 1fr);
}

.engx-ai-message.is-user .engx-ai-avatar {
  display: none;
}

.engx-ai-avatar {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 2px;
  background: #173b75;
  color: #ffffff;
  font-size: 9px;
  font-weight: 800;
}

.engx-ai-message > div:last-child {
  min-width: 0;
}

.engx-ai-message > div:last-child > header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
}

.engx-ai-message header strong {
  color: var(--engx-text);
  font-size: 10px;
}

.engx-ai-message header time {
  color: var(--engx-muted);
  font-size: 8px;
}

.engx-ai-message > div:last-child > p {
  margin: 0;
  border: 1px solid #d8dee7;
  border-radius: 2px;
  padding: 10px 12px;
  background: #ffffff;
  color: var(--engx-text);
  font-size: 11px;
  line-height: 1.6;
}

.engx-ai-message.is-user > div > header {
  justify-content: flex-end;
}

.engx-ai-message.is-user > div > p {
  border-color: #26384f;
  background: #26384f;
  color: #ffffff;
}

.engx-ai-message.is-error > div > p {
  border-color: #e4c1bd;
  background: #fff7f6;
  color: #8d2d25;
}

.engx-ai-message.is-system {
  display: flex;
  width: 100%;
  justify-content: center;
}

.engx-ai-message.is-system span {
  border: 1px solid #d9dee5;
  border-radius: 2px;
  padding: 5px 9px;
  background: #f2f4f6;
  color: var(--engx-muted);
  font-size: 9px;
}

.engx-ai-inline-result {
  margin-top: 8px;
  border-left: 3px solid #d7a719;
  padding: 10px 12px;
  background: #f7f8fa;
}

.engx-ai-inline-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 7px;
}

.engx-ai-inline-meta strong {
  color: #173b75;
  font-size: 18px;
}

.engx-ai-inline-meta span,
.engx-ai-inline-result section > span {
  color: var(--engx-muted);
  font-size: 9px;
  font-weight: 700;
}

.engx-ai-inline-result section {
  border-top: 1px solid #dfe3e8;
  padding: 7px 0 2px;
}

.engx-ai-inline-result section p {
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr);
  gap: 7px;
  margin: 5px 0 0;
  color: var(--engx-text);
  font-size: 10px;
  line-height: 1.4;
}

.engx-ai-inline-result section p b {
  color: #9d6d00;
  font-size: 8px;
  text-transform: uppercase;
}

.engx-ai-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.engx-ai-inline-actions .button {
  min-height: 30px;
  padding: 6px 10px;
  font-size: 9px;
}

.engx-ai-suggestions {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  border-top: 1px solid var(--engx-line);
  padding: 9px 12px;
  background: #ffffff;
}

.engx-ai-suggestions button {
  min-height: 28px;
  flex: 0 0 auto;
  border: 1px solid #cfd6df;
  border-radius: 2px;
  padding: 5px 9px;
  background: #ffffff;
  color: #324760;
  font-size: 9px;
  font-weight: 650;
  box-shadow: none;
}

.engx-ai-suggestions button:hover {
  border-color: #173b75;
  color: #173b75;
}

.engx-ai-composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px;
  align-items: end;
  gap: 8px;
  border-top: 1px solid var(--engx-line);
  padding: 10px 12px 12px;
  background: #ffffff;
}

.engx-ai-composer label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.engx-ai-composer textarea {
  width: 100%;
  min-height: 54px;
  max-height: 140px;
  resize: vertical;
  border-color: #bfc8d3;
  font-size: 11px;
  line-height: 1.5;
}

.engx-ai-composer .button {
  min-height: 40px;
}

.engx-ai-office-layout > .engx-focus-panel > dl {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.engx-ai-office-layout > .engx-focus-panel > dl div:nth-child(2) {
  border-right: 0;
}

.engx-ai-office-layout > .engx-focus-panel > dl div:nth-child(-n + 2) {
  border-bottom: 1px solid var(--engx-line);
}

@media (max-width: 1080px) {
  .engineering-integrated-page .engx-lifecycle-metrics {
    grid-template-columns: repeat(5, minmax(140px, 1fr));
    overflow-x: auto;
  }

  .engx-work-primary-grid,
  .engx-work-queue-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-ai-office-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-ai-work-columns {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-ai-work-columns > section {
    border-right: 0;
    border-bottom: 1px solid var(--engx-line);
  }

  .engx-ai-work-columns > section:last-child {
    border-bottom: 0;
  }
}

@media (max-width: 900px) {
  .engineering-integrated-page .engx-shell > .engx-main {
    order: -2;
  }

  .engineering-integrated-page .engx-shell > .engx-sidebar {
    order: -1;
  }
}

@media (max-width: 680px) {
  .engx-ai-office-layout {
    padding-inline: 8px;
  }

  .engx-ai-office > header {
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
  }

  .engx-ai-office > header .engx-copilot-modes {
    width: 100%;
  }

  .engx-ai-conversation {
    min-height: 220px;
    padding: 14px 10px;
  }

  .engx-ai-message,
  .engx-ai-message.is-user {
    width: 94%;
  }

  .engx-ai-composer {
    grid-template-columns: minmax(0, 1fr) 64px;
    padding-inline: 9px;
  }

  .engx-work-primary-grid,
  .engx-work-queue-grid {
    padding-inline: 8px;
  }

  .engx-copilot-output,
  .engx-workflow-band {
    margin-inline: 8px;
  }

  .engx-focus-panel > dl,
  .engx-workflow-band {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .engx-focus-panel > dl div:nth-child(2),
  .engx-workflow-band button:nth-child(2) {
    border-right: 0;
  }

  .engx-focus-panel > dl div:nth-child(-n + 2),
  .engx-workflow-band button:nth-child(-n + 2) {
    border-bottom: 1px solid var(--engx-line);
  }

  .engx-ai-work-summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-ai-work-summary > div {
    border-right: 0;
    border-bottom: 1px solid var(--engx-line);
  }

  .engx-copilot-output > header {
    align-items: stretch;
    flex-direction: column;
  }

  .engx-copilot-output > header > div:last-child {
    flex-wrap: wrap;
  }
}

/* Engineering change board with a 3D parts finder */
.plm-overview-page {
  background: var(--bg);
}

.plm-overview-page .platform-command-bar {
  grid-template-columns: minmax(138px, 0.6fr) minmax(360px, 2fr) auto;
  min-height: 42px;
  margin-bottom: 8px;
  padding-block: 5px;
}

.plm-overview-page .platform-operations {
  grid-column: auto;
  justify-content: flex-end;
}

.plm-workbench-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 0.8fr) minmax(340px, 1.5fr) auto;
  align-items: center;
  gap: 18px;
  min-height: 64px;
  border: 1px solid var(--line);
  border-bottom: 0;
  padding: 9px 12px;
  background: var(--panel);
}

.plm-workbench-title,
.plm-workbench-actions,
.plm-workbench-search,
.plm-smartbar,
.plm-space-header,
.plm-view-switch,
.plm-findit-panel > header,
.plm-cad-preview-toolbar,
.plm-cad-info > div:first-child,
.plm-cad-actions,
.plm-eco-column > header,
.plm-eco-column > header > div,
.plm-eco-card footer,
.plm-eco-card footer > div,
.plm-eco-card-actions,
.plm-linked-projects > header,
.plm-eco-dialog-head,
.plm-eco-dialog-actions {
  display: flex;
  align-items: center;
}

.plm-workbench-title {
  gap: 10px;
  min-width: 0;
}

.plm-app-icon {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 6px;
  color: #ffffff;
  background: #4c7b70;
  font-size: 0.7rem;
  font-weight: 900;
}

.plm-workbench-title > div {
  min-width: 0;
}

.plm-workbench-title > div > span,
.plm-space-header span,
.plm-findit-panel > header span,
.plm-linked-projects > header span,
.plm-eco-dialog-head span {
  display: block;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 800;
  text-transform: uppercase;
}

.plm-workbench-title h1 {
  margin: 3px 0 0;
  overflow: hidden;
  font-size: 1.08rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  text-shadow: none;
  white-space: nowrap;
}

.plm-workbench-search {
  position: relative;
  min-width: 0;
}

.plm-workbench-search > span {
  position: absolute;
  left: 12px;
  color: var(--muted);
  font-size: 1rem;
}

.plm-workbench-search input {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 62px 0 36px;
  outline: none;
  color: var(--text);
  background: var(--field-bg);
  font-size: 0.8rem;
}

.plm-workbench-search input:focus {
  border-color: var(--accent-2);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-2) 13%, transparent);
}

.plm-workbench-search kbd {
  position: absolute;
  right: 8px;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 3px 6px;
  color: var(--muted);
  background: var(--panel);
  font-family: inherit;
  font-size: 0.62rem;
}

.plm-workbench-actions {
  justify-content: flex-end;
  gap: 6px;
}

.plm-workbench-actions .button {
  min-height: 36px;
  font-size: 0.75rem;
}

.plm-smartbar {
  min-height: 58px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--panel-strong) 42%, var(--panel));
}

.plm-smartbar > button,
.plm-smartbar > a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 56px;
  flex: 1;
  border: 0;
  border-right: 1px solid var(--line);
  padding: 0 14px;
  color: var(--text);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.plm-smartbar > :last-child {
  border-right: 0;
}

.plm-smartbar > button:hover,
.plm-smartbar > a:hover,
.plm-smartbar > button.active {
  background: color-mix(in srgb, var(--accent-2) 8%, var(--panel));
}

.plm-smartbar > button.active {
  box-shadow: inset 0 -2px 0 var(--accent-2);
}

.plm-smartbar span {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 720;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plm-smartbar strong {
  font-size: 1.05rem;
}

.plm-workbench {
  display: grid;
  grid-template-columns: 194px minmax(0, 1fr) 360px;
  min-height: 720px;
  border: 1px solid var(--line);
  border-top: 0;
  overflow: hidden;
  background: var(--panel);
}

.plm-workbench-nav {
  min-width: 0;
  border-right: 1px solid var(--line);
  padding: 12px 9px;
  background: color-mix(in srgb, var(--panel-strong) 70%, var(--panel));
}

.plm-workbench-nav section {
  display: grid;
  gap: 3px;
  margin-bottom: 16px;
}

.plm-nav-label {
  display: block;
  padding: 5px 8px;
  color: var(--muted);
  font-size: 0.65rem;
  font-weight: 850;
  text-transform: uppercase;
}

.plm-workbench-nav button,
.plm-workbench-nav a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  border: 0;
  border-radius: 5px;
  padding: 0 8px;
  color: var(--text);
  background: transparent;
  cursor: pointer;
  font-size: 0.74rem;
  text-align: left;
}

.plm-workbench-nav button:hover,
.plm-workbench-nav a:hover,
.plm-workbench-nav button.active {
  background: color-mix(in srgb, var(--accent-2) 9%, var(--panel));
}

.plm-workbench-nav button.active {
  color: var(--accent-2);
  font-weight: 800;
}

.plm-workbench-nav small {
  color: var(--muted);
  font-size: 0.62rem;
}

.plm-data-source {
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.plm-data-source p {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 5px 8px;
  color: var(--muted);
  font-size: 0.66rem;
}

.plm-data-source i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--warning);
}

.plm-data-source i.online {
  background: var(--accent);
}

.plm-change-space {
  min-width: 0;
  padding: 14px;
  overflow: hidden;
}

.plm-space-header,
.plm-findit-panel > header,
.plm-linked-projects > header {
  justify-content: space-between;
  gap: 14px;
}

.plm-space-header {
  min-height: 42px;
  margin-bottom: 10px;
}

.plm-space-header h2,
.plm-findit-panel > header h2,
.plm-linked-projects > header h2 {
  margin: 3px 0 0;
  font-size: 0.92rem;
}

.plm-view-switch {
  gap: 2px;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 2px;
  background: var(--field-bg);
}

.plm-view-switch button {
  min-height: 28px;
  border: 0;
  border-radius: 3px;
  padding: 0 9px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  font-size: 0.68rem;
  font-weight: 750;
}

.plm-view-switch button.active {
  color: var(--text);
  background: color-mix(in srgb, var(--accent-2) 12%, var(--panel));
}

.plm-eco-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(170px, 1fr));
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 5px;
  scrollbar-width: thin;
}

.plm-eco-board.list-view {
  display: block;
}

.plm-eco-column {
  min-width: 170px;
  border-top: 3px solid #8a98a3;
  background: color-mix(in srgb, var(--panel-strong) 55%, var(--panel));
}

.plm-eco-column.plm-eco-progress {
  border-top-color: var(--accent-2);
}

.plm-eco-column.plm-eco-validation {
  border-top-color: #d69535;
}

.plm-eco-column.plm-eco-effective {
  border-top-color: var(--accent);
}

.plm-eco-column > header {
  justify-content: space-between;
  min-height: 38px;
  border-bottom: 1px solid var(--line);
  padding: 0 9px;
}

.plm-eco-column > header > div {
  gap: 7px;
}

.plm-eco-column > header i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #8a98a3;
}

.plm-eco-progress > header i {
  background: var(--accent-2);
}

.plm-eco-validation > header i {
  background: #d69535;
}

.plm-eco-effective > header i {
  background: var(--accent);
}

.plm-eco-column > header strong {
  font-size: 0.73rem;
}

.plm-eco-column > header > span {
  color: var(--muted);
  font-size: 0.65rem;
}

.plm-eco-column > div {
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 360px;
  padding: 7px;
}

.plm-eco-column > div > p {
  margin: 16px 4px;
  color: var(--muted);
  font-size: 0.66rem;
  text-align: center;
}

.plm-eco-card {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 9px;
  background: var(--panel);
  box-shadow: 0 2px 8px rgb(25 55 76 / 6%);
}

.plm-eco-card:hover {
  border-color: color-mix(in srgb, var(--accent-2) 42%, var(--line));
}

.plm-eco-open {
  display: block;
  width: 100%;
  border: 0;
  padding: 0;
  color: var(--text);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.plm-eco-open span,
.plm-eco-open strong,
.plm-eco-open small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}

.plm-eco-reference {
  color: var(--accent-2);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.61rem;
  white-space: nowrap;
}

.plm-eco-open strong {
  min-height: 36px;
  margin-top: 5px;
  font-size: 0.75rem;
  line-height: 1.42;
}

.plm-eco-open small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 0.63rem;
  white-space: nowrap;
}

.plm-eco-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}

.plm-eco-tags span,
.plm-stage-tag {
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 3px 5px;
  color: var(--muted);
  background: color-mix(in srgb, var(--panel-strong) 70%, var(--panel));
  font-size: 0.58rem;
  font-weight: 750;
}

.plm-eco-card footer {
  justify-content: space-between;
  gap: 8px;
  margin-top: 10px;
  border-top: 1px solid var(--line);
  padding-top: 7px;
}

.plm-eco-card footer > div:first-child {
  gap: 6px;
}

.plm-eco-card footer > div:first-child > span {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 50%;
  color: #ffffff;
  background: #58788d;
  font-size: 0.58rem;
  font-weight: 850;
}

.plm-eco-card footer small {
  color: var(--muted);
  font-size: 0.59rem;
}

.plm-eco-card-actions {
  gap: 3px;
}

.plm-eco-card-actions button {
  display: grid;
  width: 26px;
  height: 24px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--text);
  background: var(--field-bg);
  cursor: pointer;
  font-size: 0.75rem;
}

.plm-eco-card-actions button:hover {
  border-color: var(--accent-2);
  color: var(--accent-2);
}

.plm-eco-card-actions button:disabled {
  opacity: 0.28;
}

.plm-eco-table-wrap {
  overflow-x: auto;
  border-top: 1px solid var(--line);
}

.plm-eco-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-size: 0.7rem;
}

.plm-eco-table th,
.plm-eco-table td {
  height: 46px;
  border-bottom: 1px solid var(--line);
  padding: 7px 9px;
  text-align: left;
}

.plm-eco-table th {
  color: var(--muted);
  font-size: 0.62rem;
}

.plm-eco-table tbody tr {
  cursor: pointer;
}

.plm-eco-table tbody tr:hover {
  background: color-mix(in srgb, var(--accent-2) 7%, transparent);
}

.plm-eco-table td strong,
.plm-eco-table td small {
  display: block;
}

.plm-eco-table td small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 0.6rem;
}

.plm-stage-effective {
  color: var(--accent);
}

.plm-stage-validation {
  color: #a76514;
}

.plm-linked-projects {
  margin-top: 18px;
}

.plm-linked-projects > header {
  min-height: 40px;
  border-bottom: 1px solid var(--line);
}

.plm-linked-projects > header a,
.plm-findit-panel > header a {
  color: var(--accent-2);
  font-size: 0.68rem;
  font-weight: 750;
}

.plm-linked-projects > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.plm-linked-project {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-width: 0;
  min-height: 52px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 6px 8px;
}

.plm-linked-project:nth-child(2n) {
  border-right: 0;
}

.plm-linked-project:hover {
  background: color-mix(in srgb, var(--accent-2) 7%, transparent);
}

.plm-linked-project > span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 5px;
  color: #ffffff;
  background: #58788d;
  font-size: 0.62rem;
  font-weight: 850;
}

.plm-linked-project strong,
.plm-linked-project small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plm-linked-project strong {
  font-size: 0.7rem;
}

.plm-linked-project small,
.plm-linked-project > i {
  margin-top: 3px;
  color: var(--muted);
  font-size: 0.59rem;
  font-style: normal;
}

.plm-linked-empty {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 58px;
  border-bottom: 1px solid var(--line);
  padding: 0 8px;
  color: var(--muted);
  font-size: 0.7rem;
}

.plm-linked-empty a {
  color: var(--accent-2);
  font-weight: 750;
}

.plm-findit-panel {
  min-width: 0;
  border-left: 1px solid var(--line);
  background: color-mix(in srgb, var(--panel-strong) 38%, var(--panel));
}

.plm-findit-panel > header {
  min-height: 54px;
  border-bottom: 1px solid var(--line);
  padding: 0 12px;
  background: var(--panel);
}

.plm-cad-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  padding: 10px;
}

.plm-cad-search label {
  position: relative;
}

.plm-cad-search label > span {
  position: absolute;
  top: 8px;
  left: 10px;
  color: var(--muted);
}

.plm-cad-search input,
.plm-cad-filters select {
  width: 100%;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 5px;
  outline: none;
  color: var(--text);
  background: var(--field-bg);
  font-size: 0.7rem;
}

.plm-cad-search input {
  padding: 0 9px 0 30px;
}

.plm-cad-search input:focus,
.plm-cad-filters select:focus {
  border-color: var(--accent-2);
}

.plm-cad-search button {
  min-height: 34px;
  border: 1px solid var(--accent-2);
  border-radius: 5px;
  padding: 0 10px;
  color: #ffffff;
  background: var(--accent-2);
  cursor: pointer;
  font-size: 0.7rem;
  font-weight: 750;
}

.plm-cad-filters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  border-bottom: 1px solid var(--line);
  padding: 0 10px 10px;
}

.plm-cad-filters label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 0.61rem;
}

.plm-cad-preview {
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}

.plm-cad-preview-toolbar {
  justify-content: space-between;
  min-height: 34px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 0 10px;
  color: var(--muted);
  font-size: 0.64rem;
  font-weight: 750;
}

.plm-cad-preview-toolbar button {
  border: 0;
  padding: 4px;
  color: var(--accent-2);
  background: transparent;
  cursor: pointer;
  font: inherit;
}

#plmCadViewer {
  width: 100%;
  height: 260px;
  border-bottom: 1px solid var(--line);
  background: #f1f4f6;
  touch-action: none;
}

#plmCadViewer canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.plm-cad-info {
  padding: 11px;
}

.plm-cad-info > div:first-child {
  justify-content: space-between;
  gap: 8px;
}

.plm-cad-info > div:first-child span {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plm-cad-info > div:first-child i {
  border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--line));
  border-radius: 3px;
  padding: 2px 5px;
  color: var(--accent);
  font-size: 0.56rem;
  font-style: normal;
  font-weight: 850;
}

.plm-cad-info h3 {
  margin: 6px 0 3px;
  font-size: 0.86rem;
  line-height: 1.35;
}

.plm-cad-info > p {
  margin: 0;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.66rem;
}

.plm-cad-info dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 10px 0;
  border-block: 1px solid var(--line);
}

.plm-cad-info dl > div {
  min-width: 0;
  border-right: 1px solid var(--line);
  padding: 7px 8px;
}

.plm-cad-info dl > div:first-child {
  padding-left: 0;
}

.plm-cad-info dl > div:last-child {
  border-right: 0;
}

.plm-cad-info dt {
  color: var(--muted);
  font-size: 0.58rem;
}

.plm-cad-info dd {
  margin: 3px 0 0;
  overflow: hidden;
  font-size: 0.64rem;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plm-cad-actions {
  gap: 6px;
}

.plm-cad-actions .button {
  min-height: 34px;
  flex: 1;
  padding-inline: 8px;
  font-size: 0.68rem;
}

.plm-cad-results {
  display: grid;
  max-height: 326px;
  overflow-y: auto;
  background: var(--panel);
}

.plm-cad-result-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 34px;
  border-bottom: 1px solid var(--line);
  padding: 0 10px;
  color: var(--muted);
  font-size: 0.62rem;
  font-weight: 750;
}

.plm-cad-results > button {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 53px;
  border: 0;
  border-bottom: 1px solid var(--line);
  padding: 6px 10px;
  color: var(--text);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.plm-cad-results > button:hover,
.plm-cad-results > button.active {
  background: color-mix(in srgb, var(--accent-2) 8%, var(--panel));
}

.plm-cad-results > button.active {
  box-shadow: inset 3px 0 0 var(--accent-2);
}

.plm-cad-results > button > span {
  display: grid;
  width: 29px;
  height: 29px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--accent-2);
  background: color-mix(in srgb, var(--accent-2) 8%, var(--panel));
  font-size: 0.56rem;
  font-weight: 850;
}

.plm-cad-results > button strong,
.plm-cad-results > button small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plm-cad-results > button strong {
  font-size: 0.68rem;
}

.plm-cad-results > button small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 0.58rem;
}

.plm-cad-results > button > i {
  color: var(--muted);
  font-size: 0.58rem;
  font-style: normal;
  font-weight: 800;
}

.plm-cad-empty,
.plm-eco-empty {
  margin: 0;
  padding: 22px 12px;
  color: var(--muted);
  font-size: 0.68rem;
  text-align: center;
}

.plm-eco-empty {
  display: grid;
  gap: 5px;
  min-height: 180px;
  place-content: center;
}

.plm-eco-empty strong {
  color: var(--text);
}

.plm-eco-dialog {
  width: min(720px, calc(100% - 28px));
  max-height: calc(100vh - 28px);
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 20px;
  overflow: auto;
  color: var(--text);
  background: var(--panel);
  box-shadow: var(--shadow);
}

.plm-eco-dialog::backdrop {
  background: rgb(5 14 20 / 44%);
  backdrop-filter: blur(4px);
}

.plm-eco-dialog-head {
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 12px;
}

.plm-eco-dialog-head h2 {
  margin: 4px 0 0;
  font-size: 1.05rem;
}

.plm-eco-dialog-head > button {
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 5px;
  color: var(--text);
  background: var(--field-bg);
  cursor: pointer;
  font-size: 1rem;
}

.plm-eco-dialog form > label,
.plm-eco-dialog-grid label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 700;
}

.plm-eco-dialog-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
  margin-top: 13px;
}

.plm-eco-dialog input,
.plm-eco-dialog select,
.plm-eco-dialog textarea {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 0 10px;
  outline: none;
  color: var(--text);
  background: var(--field-bg);
  font: inherit;
  font-size: 0.76rem;
}

.plm-eco-dialog textarea {
  min-height: 92px;
  padding-block: 9px;
  resize: vertical;
}

.plm-eco-dialog input:focus,
.plm-eco-dialog select:focus,
.plm-eco-dialog textarea:focus {
  border-color: var(--accent-2);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-2) 12%, transparent);
}

.plm-eco-dialog .plm-field-wide {
  grid-column: 1 / -1;
}

.plm-eco-dialog-actions {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  gap: 7px;
  margin-top: 18px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.plm-delete-eco {
  color: var(--danger);
}

.plm-delete-eco[hidden] {
  display: none;
}

@media (max-width: 1280px) {
  .plm-workbench {
    grid-template-columns: 176px minmax(0, 1fr) 326px;
  }

  .plm-eco-board {
    grid-template-columns: repeat(4, minmax(168px, 1fr));
  }
}

@media (max-width: 980px) {
  .plm-workbench-toolbar {
    grid-template-columns: minmax(230px, 0.75fr) minmax(300px, 1.25fr);
  }

  .plm-workbench-actions {
    display: none;
  }

  .plm-smartbar {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .plm-smartbar > :nth-child(3) {
    border-right: 0;
  }

  .plm-smartbar > :nth-child(-n + 3) {
    border-bottom: 1px solid var(--line);
  }

  .plm-workbench {
    display: block;
  }

  .plm-workbench-nav {
    display: flex;
    gap: 8px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    overflow-x: auto;
    scrollbar-width: none;
  }

  .plm-workbench-nav section {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 3px;
    margin: 0;
  }

  .plm-workbench-nav .plm-data-source {
    display: none;
  }

  .plm-workbench-nav button,
  .plm-workbench-nav a {
    display: flex;
    min-width: max-content;
  }

  .plm-nav-label {
    display: none;
  }

  .plm-findit-panel {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  #plmCadViewer {
    height: 360px;
  }
}

@media (max-width: 680px) {
  .plm-overview-page .topbar {
    position: relative;
  }

  .plm-workbench-toolbar {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 10px;
  }

  .plm-workbench-search {
    width: 100%;
  }

  .plm-workbench-title h1 {
    font-size: 0.95rem;
  }

  .plm-smartbar > button,
  .plm-smartbar > a {
    min-height: 48px;
    padding-inline: 9px;
  }

  .plm-smartbar span {
    font-size: 0.64rem;
  }

  .plm-smartbar strong {
    font-size: 0.86rem;
  }

  .plm-change-space {
    padding: 10px;
  }

  .plm-eco-board {
    grid-template-columns: repeat(4, 250px);
  }

  .plm-linked-projects > div {
    grid-template-columns: 1fr;
  }

  .plm-linked-project {
    border-right: 0;
  }

  #plmCadViewer {
    height: 300px;
  }

  .plm-eco-dialog-grid {
    grid-template-columns: 1fr;
  }

  .plm-eco-dialog .plm-field-wide {
    grid-column: auto;
  }

  .plm-eco-dialog-actions {
    grid-template-columns: 1fr 1fr;
  }

  .plm-eco-dialog-actions > span {
    display: none;
  }
}

/* Integrated engineering, AI selection, and PLM workspace */
.engineering-integrated-page {
  --engx-canvas: #f4f6f8;
  --engx-surface: #ffffff;
  --engx-surface-muted: #f8fafb;
  --engx-sidebar: #f1f3f5;
  --engx-text: #1f2933;
  --engx-muted: #6c7887;
  --engx-line: #dce1e6;
  --engx-blue: #1769aa;
  --engx-green: #237a4b;
  --engx-amber: #b26a00;
  --engx-red: #b42318;
  background: var(--engx-canvas);
  color: var(--engx-text);
  font-family: Inter, ui-sans-serif, system-ui, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

.engineering-integrated-page:not(.light) {
  --engx-canvas: #12161c;
  --engx-surface: #191f27;
  --engx-surface-muted: #202731;
  --engx-sidebar: #171c24;
  --engx-text: #edf2f7;
  --engx-muted: #a8b2bf;
  --engx-line: #333c48;
  --engx-blue: #75b2e5;
  --engx-green: #64c990;
  --engx-amber: #efb65c;
  --engx-red: #ff9288;
}

.engineering-integrated-page main {
  width: min(1600px, calc(100% - 28px));
  padding-top: 14px;
}

.engineering-integrated-page .topbar {
  border-color: var(--engx-line);
  background: color-mix(in srgb, var(--engx-surface) 95%, transparent);
}

.engineering-integrated-page .brand,
.engineering-integrated-page .topnav a,
.engineering-integrated-page .auth-button,
.engineering-integrated-page .icon-button,
.engineering-integrated-page .language-switch select {
  color: var(--engx-text);
}

.engineering-integrated-page .button.primary {
  border-color: var(--engx-blue);
  background: var(--engx-blue);
  color: #ffffff;
  box-shadow: none;
}

.engineering-integrated-page .button.secondary {
  border-color: var(--engx-line);
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: none;
}

.engx-commandbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(220px, 0.7fr) auto;
  align-items: center;
  gap: 18px;
  min-height: 68px;
  border: 1px solid var(--engx-line);
  padding: 10px 14px;
  background: var(--engx-surface);
}

.engx-command-title {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
}

.engx-command-icon {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  place-items: center;
  background: var(--engx-blue);
  color: #ffffff;
  font-size: 0.67rem;
  font-weight: 900;
}

.engx-command-title div,
.engx-project-context {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.engx-command-title div > span,
.engx-project-context > span {
  color: var(--engx-muted);
  font-size: 0.62rem;
  font-weight: 800;
}

.engx-command-title h1 {
  overflow: hidden;
  margin: 0;
  color: var(--engx-text);
  font-size: 0.95rem;
  text-overflow: ellipsis;
  text-shadow: none;
  white-space: nowrap;
}

.engx-project-context {
  border-left: 1px solid var(--engx-line);
  padding-left: 16px;
}

.engx-project-context strong,
.engx-project-context small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-project-context strong {
  font-size: 0.82rem;
}

.engx-project-context small {
  color: var(--engx-muted);
  font-size: 0.68rem;
}

.engx-command-actions,
.engx-view-actions {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
}

.engx-command-actions .button,
.engx-view-actions .button,
.engx-section-head .button,
.engx-view-head .button {
  min-height: 34px;
  padding-inline: 11px;
  font-size: 0.72rem;
}

.engx-module-strip {
  display: flex;
  overflow-x: auto;
  min-height: 44px;
  align-items: stretch;
  border-right: 1px solid var(--engx-line);
  border-bottom: 1px solid var(--engx-line);
  border-left: 1px solid var(--engx-line);
  background: var(--engx-surface-muted);
}

.engx-module-strip button,
.engx-module-strip a {
  display: inline-flex;
  min-width: max-content;
  min-height: 43px;
  align-items: center;
  border: 0;
  border-right: 1px solid var(--engx-line);
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0 15px;
  background: transparent;
  color: var(--engx-muted);
  font-size: 0.73rem;
  font-weight: 750;
  box-shadow: none;
}

.engx-module-strip button:hover,
.engx-module-strip button.is-active,
.engx-module-strip a:hover {
  border-bottom-color: var(--engx-blue);
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-lifecycle-metrics {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  margin: 12px 0;
  border-top: 1px solid var(--engx-line);
  border-left: 1px solid var(--engx-line);
  background: var(--engx-surface);
}

.engx-lifecycle-metrics button {
  display: grid;
  min-width: 0;
  min-height: 78px;
  align-content: center;
  border: 0;
  border-right: 1px solid var(--engx-line);
  border-bottom: 1px solid var(--engx-line);
  border-radius: 0;
  padding: 10px 14px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-lifecycle-metrics button:hover {
  background: var(--engx-surface-muted);
}

.engx-lifecycle-metrics span,
.engx-lifecycle-metrics small {
  overflow: hidden;
  color: var(--engx-muted);
  font-size: 0.66rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-lifecycle-metrics strong {
  overflow: hidden;
  margin: 3px 0;
  color: var(--engx-text);
  font-size: 1.16rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-shell {
  display: grid;
  grid-template-columns: 228px minmax(0, 1fr) 292px;
  align-items: stretch;
  border: 1px solid var(--engx-line);
  background: var(--engx-surface);
}

.engx-shell.is-context-hidden {
  grid-template-columns: 228px minmax(0, 1fr);
}

.engx-context[hidden],
.engx-context-section[hidden] {
  display: none !important;
}

.engx-sidebar,
.engx-context {
  min-width: 0;
  background: var(--engx-sidebar);
}

.engx-sidebar {
  border-right: 1px solid var(--engx-line);
}

.engx-context {
  border-left: 1px solid var(--engx-line);
}

.engx-sidebar-head,
.engx-context-head,
.engx-section-head,
.engx-view-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.engx-sidebar-head {
  min-height: 58px;
  border-bottom: 1px solid var(--engx-line);
  padding: 10px 12px;
}

.engx-sidebar-head > div,
.engx-context-head > div {
  display: grid;
  gap: 2px;
}

.engx-sidebar-head span,
.engx-context-head span,
.engx-sidebar-section > span {
  color: var(--engx-muted);
  font-size: 0.62rem;
  font-weight: 800;
  text-transform: uppercase;
}

.engx-sidebar-head strong,
.engx-context-head h2 {
  margin: 0;
  color: var(--engx-text);
  font-size: 0.8rem;
}

.engx-icon-action,
.engx-row-action {
  display: grid;
  place-items: center;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: none;
}

.engx-icon-action {
  width: 30px;
  height: 30px;
  padding: 0;
  font-size: 0.65rem;
}

.engx-compact-action {
  min-height: 30px;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  padding: 0 9px;
  background: var(--engx-surface);
  color: var(--engx-text);
  font-size: 0.68rem;
  font-weight: 700;
  box-shadow: none;
}

.engx-row-action {
  width: 27px;
  height: 27px;
  min-height: 27px;
  padding: 0;
  font-size: 0.72rem;
}

.engx-project-list {
  display: grid;
  max-height: 260px;
  overflow-y: auto;
  border-bottom: 1px solid var(--engx-line);
  padding: 6px;
}

.engx-project-item {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 52px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0;
  padding: 6px 8px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-project-item:hover,
.engx-project-item.is-active {
  border-left-color: var(--engx-blue);
  background: color-mix(in srgb, var(--engx-blue) 8%, var(--engx-surface));
}

.engx-project-item > span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  background: color-mix(in srgb, var(--engx-blue) 13%, var(--engx-surface));
  color: var(--engx-blue);
  font-size: 0.68rem;
  font-weight: 900;
}

.engx-project-item div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.engx-project-item strong,
.engx-project-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-project-item strong {
  font-size: 0.73rem;
}

.engx-project-item small {
  color: var(--engx-muted);
  font-size: 0.62rem;
}

.engx-sidebar-section {
  display: grid;
  gap: 2px;
  padding: 12px 8px;
}

.engx-sidebar-section > span {
  padding: 0 7px 6px;
}

.engx-sidebar-section button {
  display: grid;
  gap: 2px;
  min-height: 50px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0;
  padding: 7px 9px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-sidebar-section button:hover,
.engx-sidebar-section button.is-active {
  border-left-color: var(--engx-blue);
  background: var(--engx-surface);
}

.engx-sidebar-section strong {
  font-size: 0.72rem;
}

.engx-sidebar-section small {
  color: var(--engx-muted);
  font-size: 0.62rem;
}

.engx-main {
  min-width: 0;
  background: var(--engx-surface);
}

.engx-view {
  min-width: 0;
  min-height: 680px;
}

.engx-view[hidden] {
  display: none;
}

.engx-view-head {
  min-height: 78px;
  border-bottom: 1px solid var(--engx-line);
  padding: 14px 16px;
}

.engx-view-head h2,
.engx-section-head h2 {
  margin: 2px 0;
  color: var(--engx-text);
  font-size: 0.9rem;
}

.engx-view-head p {
  margin: 0;
  color: var(--engx-muted);
  font-size: 0.69rem;
}

.engx-view-state {
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  padding: 5px 8px;
  color: var(--engx-muted);
  font-size: 0.65rem;
}

.engx-project-form,
.engx-ai-fields,
.engx-eco-dialog-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.engx-project-form {
  border-bottom: 1px solid var(--engx-line);
  padding: 16px;
}

.engx-project-form label,
.engx-ai-requirement label,
.engx-ai-fields label,
.engx-upload label,
.engx-file-search,
.engx-catalog-search,
.engx-eco-dialog-grid label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.engx-project-form label > span,
.engx-ai-requirement label > span,
.engx-ai-fields label > span,
.engx-upload label > span,
.engx-file-search > span,
.engx-catalog-search > span,
.engx-eco-dialog-grid label > span {
  color: var(--engx-muted);
  font-size: 0.64rem;
  font-weight: 750;
}

.engx-project-form input,
.engx-project-form select,
.engx-project-form textarea,
.engx-ai-requirement textarea,
.engx-ai-fields input,
.engx-ai-fields select,
.engx-upload input,
.engx-file-search input,
.engx-catalog-search input,
.engx-eco-dialog-grid input,
.engx-eco-dialog-grid select,
.engx-eco-dialog-grid textarea {
  width: 100%;
  min-width: 0;
  border-color: var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-wide-field {
  grid-column: 1 / -1;
}

.engx-work-section {
  border-bottom: 1px solid var(--engx-line);
  padding: 16px;
}

.engx-section-head {
  margin-bottom: 10px;
}

.engx-bom-table-wrap {
  border: 1px solid var(--engx-line);
}

.engx-bom-table {
  min-width: 760px;
}

.engx-bom-table th,
.engx-bom-table td {
  border-color: var(--engx-line);
}

.engx-bom-table input {
  min-width: 76px;
  border-color: transparent;
  background: transparent;
  color: var(--engx-text);
}

.engx-bom-table input:focus {
  border-color: var(--engx-blue);
  background: var(--engx-surface);
}

.engx-bom-name-field {
  display: grid;
  min-width: 150px;
  gap: 2px;
}

.engx-bom-name-field small {
  color: var(--engx-muted);
  font-size: 0.58rem;
  font-weight: 750;
}

.engx-bom-name-field small[data-state="review"] {
  color: var(--engx-amber);
}

.engx-bom-name-field small[data-state="approved"] {
  color: var(--engx-green);
}

.engineering-integrated-page .bom-summary {
  border-color: var(--engx-line);
  color: var(--engx-muted);
}

.engx-ai-layout {
  display: grid;
  grid-template-columns: minmax(320px, 0.85fr) minmax(360px, 1.15fr);
  border-bottom: 1px solid var(--engx-line);
}

.engx-decision-run {
  display: flex;
  align-items: center;
  gap: 9px;
}

.engx-decision-run > span,
.engx-decision-banner strong {
  color: var(--engx-amber);
}

.engx-decision-run > span {
  border-left: 3px solid currentColor;
  padding: 5px 8px;
  background: var(--engx-surface-muted);
  font-size: 0.68rem;
  font-weight: 800;
  white-space: nowrap;
}

.engx-decision-run > span[data-state="verified"],
.engx-decision-banner[data-state="verified"] strong {
  color: var(--engx-green);
}

.engx-decision-run > span[data-state="incomplete"],
.engx-decision-banner[data-state="incomplete"] strong {
  color: var(--engx-red);
}

.engx-decision-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(110px, 1fr));
  margin: 0;
  overflow-x: auto;
  border-bottom: 1px solid var(--engx-line);
  padding: 0;
  background: var(--engx-surface);
  list-style: none;
}

.engx-decision-flow li {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  min-height: 58px;
  align-items: center;
  gap: 8px;
  border-right: 1px solid var(--engx-line);
  padding: 8px 12px;
}

.engx-decision-flow li:last-child {
  border-right: 0;
}

.engx-decision-flow li > span {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border: 1px solid var(--engx-line);
  border-radius: 50%;
  color: var(--engx-muted);
  font-size: 0.66rem;
  font-weight: 800;
}

.engx-decision-flow li div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.engx-decision-flow strong {
  color: var(--engx-text);
  font-size: 0.7rem;
}

.engx-decision-flow small {
  color: var(--engx-muted);
  font-size: 0.6rem;
}

.engx-decision-flow li[data-state="done"] > span {
  border-color: var(--engx-green);
  background: var(--engx-green);
  color: #fff;
}

.engx-decision-flow li[data-state="active"] > span {
  border-color: var(--engx-blue);
  color: var(--engx-blue);
}

.engx-decision-flow li[data-state="review"] > span {
  border-color: var(--engx-amber);
  background: color-mix(in srgb, var(--engx-amber) 12%, var(--engx-surface));
  color: var(--engx-amber);
}

.engx-source-strip {
  display: grid;
  grid-template-columns: minmax(190px, 0.35fr) minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid var(--engx-line);
  padding: 10px 16px;
  background: var(--engx-surface-muted);
}

.engx-source-strip > div:first-child {
  display: grid;
  gap: 2px;
}

.engx-source-strip > div:first-child span,
.engx-source-strip > div:first-child small {
  color: var(--engx-muted);
  font-size: 0.61rem;
}

.engx-source-strip > div:first-child > span {
  color: var(--engx-blue);
  font-weight: 800;
  text-transform: uppercase;
}

.engx-source-strip > div:first-child strong {
  color: var(--engx-text);
  font-size: 0.73rem;
}

.engx-source-coverage {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.engx-source-coverage > span {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  gap: 5px;
  border: 1px solid var(--engx-line);
  padding: 4px 7px;
  background: var(--engx-surface);
  color: var(--engx-muted);
  font-size: 0.61rem;
}

.engx-source-coverage i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--engx-green);
}

.engx-source-coverage .is-pending i {
  background: var(--engx-amber);
}

.engx-source-coverage .is-error {
  color: var(--engx-red);
}

.engx-source-coverage b {
  color: var(--engx-text);
}

.engx-ai-requirement,
.engx-ai-result {
  min-width: 0;
  padding: 16px;
}

.engx-ai-requirement {
  border-right: 1px solid var(--engx-line);
  background: var(--engx-surface-muted);
}

.engx-ai-fields {
  margin-top: 10px;
}

.engx-constraint-details {
  margin-top: 12px;
  border-top: 1px solid var(--engx-line);
  padding-top: 10px;
}

.engx-constraint-details summary {
  cursor: pointer;
  color: var(--engx-blue);
  font-size: 0.68rem;
  font-weight: 750;
}

.engx-selection-card {
  border: 1px solid var(--engx-line);
  background: var(--engx-surface);
}

.engx-decision-banner {
  display: flex;
  min-height: 39px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--engx-line);
  padding: 8px 13px;
  background: var(--engx-surface-muted);
}

.engx-decision-banner strong,
.engx-decision-banner span {
  font-size: 0.65rem;
}

.engx-decision-banner span {
  color: var(--engx-muted);
  text-align: right;
}

.engx-selection-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--engx-line);
  padding: 14px;
}

.engx-selection-card header div {
  min-width: 0;
}

.engx-selection-card header span {
  color: var(--engx-green);
  font-size: 0.63rem;
  font-weight: 800;
}

.engx-selection-card h3 {
  margin: 4px 0;
  color: var(--engx-text);
  font-size: 1rem;
}

.engx-selection-card p {
  margin: 0;
  color: var(--engx-muted);
  font-size: 0.7rem;
}

.engx-selection-card header > strong {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--engx-green) 35%, var(--engx-line));
  color: var(--engx-green);
  font-size: 1rem;
}

.engx-selection-card dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.engx-selection-card dl div {
  min-width: 0;
  border-right: 1px solid var(--engx-line);
  border-bottom: 1px solid var(--engx-line);
  padding: 10px;
}

.engx-selection-card dt {
  color: var(--engx-muted);
  font-size: 0.62rem;
}

.engx-selection-card dd {
  margin: 4px 0 0;
  color: var(--engx-text);
  font-size: 0.72rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.engx-selection-evidence {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  border-top: 1px solid var(--engx-line);
  padding: 11px 14px;
  background: var(--engx-surface-muted);
}

.engx-selection-evidence strong {
  color: var(--engx-text);
  font-size: 0.67rem;
}

.engx-selection-evidence span {
  color: var(--engx-muted);
  font-size: 0.65rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.engx-ai-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-bottom: 1px solid var(--engx-line);
  padding: 10px 16px;
}

.engx-ai-actions[hidden] {
  display: none;
}

.engx-ai-actions .button {
  min-height: 34px;
  padding-inline: 11px;
  font-size: 0.72rem;
}

.engx-ai-support-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.engx-ai-support-grid > section {
  min-width: 0;
  border-right: 1px solid var(--engx-line);
  padding: 16px;
}

.engx-rule-list,
.engx-alternative-list {
  display: grid;
  border-top: 1px solid var(--engx-line);
}

.engx-rule-list article,
.engx-alternative-list article {
  display: grid;
  min-height: 50px;
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid var(--engx-line);
  padding: 8px 4px;
}

.engx-rule-list article {
  grid-template-columns: 9px minmax(0, 1fr);
}

.engx-rule-list article i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--engx-amber);
}

.engx-rule-list article.is-ok i {
  background: var(--engx-green);
}

.engx-rule-list article div,
.engx-alternative-list article div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.engx-rule-list strong,
.engx-alternative-list strong {
  color: var(--engx-text);
  font-size: 0.7rem;
}

.engx-rule-list span,
.engx-alternative-list span {
  color: var(--engx-muted);
  font-size: 0.63rem;
}

.engx-alternative-list article {
  grid-template-columns: minmax(0, 1fr) auto;
}

.engx-eco-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(190px, 1fr));
  min-height: 580px;
  overflow-x: auto;
  background: var(--engx-surface-muted);
}

.engx-eco-column {
  min-width: 190px;
  border-right: 1px solid var(--engx-line);
}

.engx-eco-column > header {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--engx-line);
  padding: 7px 9px;
  background: var(--engx-surface);
}

.engx-eco-column > header div {
  display: flex;
  align-items: center;
  gap: 7px;
}

.engx-eco-column > header i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--engx-muted);
}

.engx-eco-in-progress > header i {
  background: var(--engx-blue);
}

.engx-eco-validation > header i {
  background: var(--engx-amber);
}

.engx-eco-effective > header i {
  background: var(--engx-green);
}

.engx-eco-column > header strong,
.engx-eco-column > header span {
  font-size: 0.68rem;
}

.engx-eco-column > header span {
  color: var(--engx-muted);
}

.engx-eco-column > div {
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 8px;
}

.engx-eco-column > div > p {
  margin: 8px 2px;
  color: var(--engx-muted);
  font-size: 0.65rem;
}

.engx-eco-card {
  border: 1px solid var(--engx-line);
  border-radius: 5px;
  background: var(--engx-surface);
}

.engx-eco-open {
  display: grid;
  width: 100%;
  gap: 4px;
  border: 0;
  border-radius: 0;
  padding: 10px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-eco-open span {
  color: var(--engx-blue);
  font-size: 0.62rem;
  font-weight: 800;
}

.engx-eco-open strong {
  font-size: 0.72rem;
  line-height: 1.4;
}

.engx-eco-open small {
  overflow: hidden;
  color: var(--engx-muted);
  font-size: 0.61rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-eco-card > div {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  border-top: 1px solid var(--engx-line);
  padding: 7px 9px;
}

.engx-eco-card > div span {
  border: 1px solid var(--engx-line);
  border-radius: 3px;
  padding: 2px 4px;
  color: var(--engx-muted);
  font-size: 0.57rem;
}

.engx-eco-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid var(--engx-line);
  padding: 6px 9px;
}

.engx-eco-card footer small {
  color: var(--engx-muted);
  font-size: 0.6rem;
}

.engx-eco-card footer div {
  display: flex;
  gap: 4px;
}

.engx-eco-card footer button {
  width: 26px;
  height: 26px;
  min-height: 26px;
  border: 1px solid var(--engx-line);
  border-radius: 3px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: none;
}

.engx-eco-empty {
  grid-column: 1 / -1;
  display: grid;
  min-height: 280px;
  place-content: center;
  justify-items: center;
  gap: 7px;
  padding: 20px;
  text-align: center;
}

.engx-eco-empty strong {
  font-size: 0.9rem;
}

.engx-eco-empty span {
  max-width: 460px;
  color: var(--engx-muted);
  font-size: 0.7rem;
}

.engx-upload {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(260px, 1fr) auto;
  align-items: end;
  gap: 9px;
  margin-bottom: 12px;
}

.engx-file-search {
  margin-bottom: 10px;
}

.engx-file-results {
  border: 1px solid var(--engx-line);
}

.engx-file-results .design-file-result {
  border-color: var(--engx-line);
}

.engx-procurement-preview {
  max-height: 340px;
  border: 1px solid var(--engx-line);
  background: var(--engx-surface-muted);
}

.engx-context-section {
  border-bottom: 1px solid var(--engx-line);
  padding: 13px 12px;
}

.engx-context-head {
  margin-bottom: 10px;
}

.engx-catalog-search {
  margin-bottom: 8px;
}

.engx-part-results {
  display: grid;
  max-height: 390px;
  overflow-y: auto;
  border-top: 1px solid var(--engx-line);
}

.engx-part-result {
  grid-template-columns: minmax(0, 1fr) auto;
  border-color: var(--engx-line);
  padding: 8px 2px;
  background: transparent;
}

.engx-part-result strong {
  font-size: 0.68rem;
}

.engx-part-result span {
  font-size: 0.6rem;
}

.engx-context-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--engx-line);
  border-left: 1px solid var(--engx-line);
}

.engx-context-metrics div {
  min-width: 0;
  border-right: 1px solid var(--engx-line);
  border-bottom: 1px solid var(--engx-line);
  padding: 9px;
}

.engx-context-metrics dt {
  color: var(--engx-muted);
  font-size: 0.59rem;
}

.engx-context-metrics dd {
  overflow: hidden;
  margin: 4px 0 0;
  color: var(--engx-text);
  font-size: 0.7rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-message-section p {
  margin: 0;
  border-left: 3px solid var(--engx-line);
  padding: 5px 0 5px 9px;
  color: var(--engx-muted);
  font-size: 0.67rem;
  line-height: 1.5;
}

.engx-message-section p[data-tone="success"] {
  border-left-color: var(--engx-green);
  color: var(--engx-green);
}

.engx-message-section p[data-tone="warning"] {
  border-left-color: var(--engx-amber);
  color: var(--engx-amber);
}

.engx-message-section p[data-tone="danger"] {
  border-left-color: var(--engx-red);
  color: var(--engx-red);
}

.engx-eco-dialog {
  width: min(680px, calc(100vw - 28px));
  max-height: calc(100vh - 36px);
  overflow: auto;
  border: 1px solid var(--engx-line);
  border-radius: 7px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: 0 24px 70px rgb(0 0 0 / 24%);
}

.engx-eco-dialog::backdrop {
  background: rgb(15 23 42 / 46%);
}

.engx-eco-dialog form {
  padding: 16px;
}

.engx-eco-dialog-grid {
  margin-top: 14px;
}

.engx-eco-dialog-actions {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  gap: 8px;
  margin-top: 16px;
  border-top: 1px solid var(--engx-line);
  padding-top: 12px;
}

.engx-eco-dialog-actions .danger {
  color: var(--engx-red);
}

.engx-collaboration-head {
  min-height: 84px;
}

.engx-segmented {
  display: inline-flex;
  min-height: 34px;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface-muted);
}

.engx-segmented button {
  min-width: 56px;
  min-height: 32px;
  border: 0;
  border-right: 1px solid var(--engx-line);
  border-radius: 0;
  padding: 0 10px;
  background: transparent;
  color: var(--engx-muted);
  font-size: 0.68rem;
  font-weight: 750;
  box-shadow: none;
}

.engx-segmented button:last-child {
  border-right: 0;
}

.engx-segmented button.is-active {
  background: var(--engx-surface);
  color: var(--engx-blue);
}

.engx-design-brief,
.engx-task-section {
  border-bottom: 1px solid var(--engx-line);
  padding: 16px;
}

.engx-design-brief {
  background: var(--engx-surface-muted);
}

.engx-sync-state {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  padding: 0 8px;
  color: var(--engx-muted);
  background: var(--engx-surface);
  font-size: 0.61rem;
  font-weight: 750;
}

.engx-sync-state[data-tone="success"] {
  border-color: color-mix(in srgb, var(--engx-green) 40%, var(--engx-line));
  color: var(--engx-green);
}

.engx-sync-state[data-tone="warning"],
.engx-sync-state[data-tone="pending"] {
  border-color: color-mix(in srgb, var(--engx-amber) 40%, var(--engx-line));
  color: var(--engx-amber);
}

.engx-sync-state[data-tone="danger"] {
  border-color: color-mix(in srgb, var(--engx-red) 40%, var(--engx-line));
  color: var(--engx-red);
}

.engx-design-brief label,
.engx-brief-grid label {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.engx-design-brief label > span,
.engx-brief-grid label > span {
  color: var(--engx-muted);
  font-size: 0.64rem;
  font-weight: 750;
}

.engx-design-brief textarea {
  width: 100%;
  min-width: 0;
  resize: vertical;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
  font-size: 0.72rem;
  line-height: 1.6;
}

.engx-brief-summary {
  margin-bottom: 10px;
}

.engx-brief-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.engx-task-summary {
  display: flex;
  align-items: baseline;
  gap: 7px;
}

.engx-task-summary strong {
  color: var(--engx-blue);
  font-size: 0.9rem;
}

.engx-task-summary span {
  color: var(--engx-muted);
  font-size: 0.64rem;
}

.engx-task-workspace {
  min-width: 0;
  border: 1px solid var(--engx-line);
  background: var(--engx-surface);
}

.engx-task-table-wrap {
  overflow-x: auto;
}

.engx-task-table {
  width: 100%;
  min-width: 850px;
  border-collapse: collapse;
}

.engx-task-table th,
.engx-task-table td {
  height: 46px;
  border-bottom: 1px solid var(--engx-line);
  padding: 6px 9px;
  color: var(--engx-text);
  font-size: 0.66rem;
  text-align: left;
  vertical-align: middle;
}

.engx-task-table th {
  height: 36px;
  background: var(--engx-surface-muted);
  color: var(--engx-muted);
  font-weight: 800;
}

.engx-task-table tbody tr:last-child td {
  border-bottom: 0;
}

.engx-task-table tbody tr:hover {
  background: color-mix(in srgb, var(--engx-blue) 5%, var(--engx-surface));
}

.engx-task-table tr.is-done .engx-task-title strong {
  color: var(--engx-muted);
  text-decoration: line-through;
}

.engx-task-check-column,
.engx-task-table td:first-child {
  width: 48px;
  text-align: center;
}

.engx-task-check {
  width: 16px;
  height: 16px;
  accent-color: var(--engx-blue);
}

.engx-task-title {
  display: grid;
  width: 100%;
  min-width: 180px;
  gap: 2px;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-task-title-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 26px;
  align-items: center;
  gap: 5px;
}

.engx-task-share,
.engx-task-card footer button {
  display: grid;
  width: 24px;
  height: 24px;
  min-height: 24px;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 3px;
  padding: 0;
  background: transparent;
  color: var(--engx-muted);
  font-size: 0.7rem;
  box-shadow: none;
}

.engx-task-share:hover,
.engx-task-card footer button:hover {
  border-color: var(--engx-line);
  background: var(--engx-surface);
  color: var(--engx-blue);
}

.engx-task-title strong,
.engx-task-title small {
  overflow: hidden;
  max-width: 330px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-task-title strong {
  font-size: 0.7rem;
}

.engx-task-title small {
  color: var(--engx-muted);
  font-size: 0.59rem;
}

.engx-inline-select {
  min-width: 88px;
  min-height: 28px;
  border: 1px solid var(--engx-line);
  border-radius: 3px;
  padding: 0 5px;
  background: var(--engx-surface);
  color: var(--engx-text);
  font-size: 0.63rem;
}

.engx-priority {
  display: inline-flex;
  min-width: 34px;
  min-height: 22px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--engx-line);
  border-radius: 3px;
  padding: 0 5px;
  color: var(--engx-muted);
  background: var(--engx-surface-muted);
  font-size: 0.58rem;
  font-weight: 800;
}

.engx-priority-high,
.engx-priority-urgent {
  color: var(--engx-red);
  border-color: color-mix(in srgb, var(--engx-red) 28%, var(--engx-line));
  background: color-mix(in srgb, var(--engx-red) 6%, var(--engx-surface));
}

.engx-priority-high {
  color: var(--engx-amber);
  border-color: color-mix(in srgb, var(--engx-amber) 30%, var(--engx-line));
}

.engx-task-assignee,
.engx-task-deadline,
.engx-task-hours {
  display: inline-block;
  max-width: 110px;
  overflow: hidden;
  color: var(--engx-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-task-deadline[data-tone="warning"] {
  color: var(--engx-amber);
}

.engx-task-deadline[data-tone="danger"] {
  color: var(--engx-red);
}

.engx-task-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(210px, 1fr));
  min-height: 420px;
  overflow-x: auto;
  background: var(--engx-surface-muted);
}

.engx-task-column {
  min-width: 210px;
  border-right: 1px solid var(--engx-line);
}

.engx-task-column:last-child {
  border-right: 0;
}

.engx-task-column > header {
  display: flex;
  min-height: 40px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--engx-line);
  padding: 7px 9px;
  background: var(--engx-surface);
}

.engx-task-column > header div {
  display: flex;
  align-items: center;
  gap: 7px;
}

.engx-task-column > header i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--engx-muted);
}

.engx-task-column[data-task-drop-status="in-progress"] > header i {
  background: var(--engx-blue);
}

.engx-task-column[data-task-drop-status="review"] > header i {
  background: var(--engx-amber);
}

.engx-task-column[data-task-drop-status="done"] > header i {
  background: var(--engx-green);
}

.engx-task-column > header strong,
.engx-task-column > header span {
  font-size: 0.66rem;
}

.engx-task-column > header span {
  color: var(--engx-muted);
}

.engx-task-column > div {
  display: grid;
  align-content: start;
  min-height: 378px;
  gap: 8px;
  padding: 8px;
}

.engx-task-column.is-drag-over > div {
  background: color-mix(in srgb, var(--engx-blue) 8%, var(--engx-surface-muted));
}

.engx-task-column > div > p {
  margin: 8px 2px;
  color: var(--engx-muted);
  font-size: 0.61rem;
}

.engx-task-card {
  border: 1px solid var(--engx-line);
  border-radius: 5px;
  background: var(--engx-surface);
}

.engx-task-card.is-dragging {
  opacity: 0.46;
}

.engx-task-card > button {
  display: grid;
  width: 100%;
  gap: 6px;
  border: 0;
  border-radius: 0;
  padding: 10px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-task-card > button strong {
  font-size: 0.69rem;
  line-height: 1.45;
}

.engx-task-card > button small {
  display: -webkit-box;
  overflow: hidden;
  color: var(--engx-muted);
  font-size: 0.59rem;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.engx-task-card footer {
  display: flex;
  min-height: 32px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-top: 1px solid var(--engx-line);
  padding: 6px 9px;
  color: var(--engx-muted);
  font-size: 0.58rem;
}

.engx-task-card footer time[data-tone="warning"] {
  color: var(--engx-amber);
}

.engx-task-card footer time[data-tone="danger"] {
  color: var(--engx-red);
}

.engx-collaboration-empty {
  display: grid;
  min-height: 240px;
  place-content: center;
  justify-items: center;
  gap: 7px;
  padding: 20px;
  text-align: center;
}

.engx-collaboration-empty strong {
  font-size: 0.86rem;
}

.engx-collaboration-empty span,
.engx-context-empty {
  color: var(--engx-muted);
  font-size: 0.63rem;
  line-height: 1.5;
}

.engx-member-list,
.engx-comment-list,
.engx-activity-list {
  display: grid;
}

.engx-member-list article {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 8px;
  min-height: 43px;
  border-top: 1px solid var(--engx-line);
}

.engx-member-list article > span {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--engx-blue) 13%, var(--engx-surface));
  color: var(--engx-blue);
  font-size: 0.62rem;
  font-weight: 850;
}

.engx-member-list article div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.engx-member-list strong,
.engx-member-list small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-member-list strong {
  font-size: 0.66rem;
}

.engx-member-list small {
  color: var(--engx-muted);
  font-size: 0.58rem;
}

.engx-member-list button,
.engx-member-form button {
  display: grid;
  width: 24px;
  height: 24px;
  min-height: 24px;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 3px;
  padding: 0;
  background: transparent;
  color: var(--engx-muted);
  box-shadow: none;
}

.engx-member-list button:hover,
.engx-member-form button:hover {
  border-color: var(--engx-line);
  background: var(--engx-surface);
  color: var(--engx-blue);
}

.engx-member-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px 26px;
  gap: 5px;
  margin-top: 8px;
}

.engx-member-form input,
.engx-comment-form textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--engx-line);
  border-radius: 3px;
  background: var(--engx-surface);
  color: var(--engx-text);
  font-size: 0.62rem;
}

.engx-member-form input {
  height: 30px;
  padding: 0 7px;
}

.engx-member-form button {
  width: 30px;
  height: 30px;
  min-height: 30px;
  border-color: var(--engx-line);
  background: var(--engx-surface);
}

.engx-comment-form {
  display: grid;
  gap: 6px;
  margin-bottom: 8px;
}

.engx-comment-form textarea {
  resize: vertical;
  line-height: 1.45;
}

.engx-comment-form .button {
  min-height: 30px;
  justify-self: end;
  padding-inline: 12px;
  font-size: 0.63rem;
}

.engx-comment-list {
  max-height: 330px;
  overflow-y: auto;
}

.engx-comment-list article {
  border-top: 1px solid var(--engx-line);
  padding: 9px 1px;
}

.engx-comment-list article.is-resolved {
  opacity: 0.62;
}

.engx-comment-list header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
}

.engx-comment-list strong,
.engx-comment-list time,
.engx-comment-list button {
  font-size: 0.59rem;
}

.engx-comment-list time {
  color: var(--engx-muted);
}

.engx-comment-list p {
  margin: 5px 0;
  color: var(--engx-text);
  font-size: 0.63rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.engx-comment-list button {
  min-height: 24px;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: var(--engx-blue);
  box-shadow: none;
}

.engx-chat-section {
  position: relative;
}

.engx-chat-section [hidden] {
  display: none !important;
}

.engx-chat-head-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.engx-chat-online {
  color: var(--engx-green);
  font-size: 0.58rem;
  font-weight: 750;
}

.engx-chat-head-actions button {
  display: grid;
  width: 26px;
  height: 26px;
  min-height: 26px;
  place-items: center;
  border: 1px solid var(--engx-line);
  border-radius: 3px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: none;
}

.engx-chat-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0 -12px 8px;
  border-top: 1px solid var(--engx-line);
  border-bottom: 1px solid var(--engx-line);
}

.engx-chat-tabs button {
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 0;
  border-right: 1px solid var(--engx-line);
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0 8px;
  background: transparent;
  color: var(--engx-muted);
  font-size: 0.63rem;
  font-weight: 750;
  box-shadow: none;
}

.engx-chat-tabs button:last-child {
  border-right: 0;
}

.engx-chat-tabs button.is-active {
  border-bottom-color: var(--engx-blue);
  color: var(--engx-blue);
  background: var(--engx-surface);
}

.engx-chat-tabs button span {
  display: inline-grid;
  min-width: 17px;
  height: 17px;
  place-items: center;
  border-radius: 50%;
  padding: 0 4px;
  background: var(--engx-red);
  color: #ffffff;
  font-size: 0.53rem;
}

.engx-chat-panel,
.engx-review-panel {
  min-width: 0;
}

.engx-chat-presence {
  display: flex;
  min-height: 27px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--engx-muted);
  font-size: 0.57rem;
}

.engx-chat-presence span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-chat-presence small[data-tone="success"] {
  color: var(--engx-green);
}

.engx-chat-presence small[data-tone="pending"] {
  color: var(--engx-amber);
}

.engx-chat-presence small[data-tone="danger"] {
  color: var(--engx-red);
}

.engx-chat-messages {
  display: grid;
  align-content: start;
  max-height: 350px;
  min-height: 190px;
  overflow-y: auto;
  gap: 8px;
  margin: 0 -5px;
  border-top: 1px solid var(--engx-line);
  border-bottom: 1px solid var(--engx-line);
  padding: 9px 5px;
  background: var(--engx-surface-muted);
}

.engx-chat-empty {
  display: grid;
  min-height: 170px;
  place-content: center;
  justify-items: center;
  gap: 5px;
  padding: 16px;
  color: var(--engx-muted);
  text-align: center;
}

.engx-chat-empty strong {
  color: var(--engx-text);
  font-size: 0.7rem;
}

.engx-chat-empty span {
  max-width: 230px;
  font-size: 0.59rem;
  line-height: 1.5;
}

.engx-chat-day {
  display: flex;
  justify-content: center;
}

.engx-chat-day span {
  border-radius: 3px;
  padding: 2px 6px;
  background: color-mix(in srgb, var(--engx-muted) 12%, var(--engx-surface));
  color: var(--engx-muted);
  font-size: 0.53rem;
}

.engx-chat-message {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: start;
  gap: 7px;
}

.engx-chat-message.is-mine {
  grid-template-columns: minmax(0, 1fr) 26px;
}

.engx-chat-avatar {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--engx-blue) 13%, var(--engx-surface));
  color: var(--engx-blue);
  font-size: 0.6rem;
  font-weight: 850;
}

.engx-chat-message.is-mine .engx-chat-avatar {
  grid-column: 2;
  background: color-mix(in srgb, var(--engx-green) 14%, var(--engx-surface));
  color: var(--engx-green);
}

.engx-chat-message-body {
  display: grid;
  min-width: 0;
  justify-items: start;
}

.engx-chat-message.is-mine .engx-chat-message-body {
  grid-column: 1;
  grid-row: 1;
  justify-items: end;
}

.engx-chat-message-body > header {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 6px;
  margin-bottom: 3px;
}

.engx-chat-message.is-mine .engx-chat-message-body > header {
  justify-content: flex-end;
}

.engx-chat-message-body > header strong,
.engx-chat-message-body > header time {
  font-size: 0.54rem;
}

.engx-chat-message-body > header time {
  color: var(--engx-muted);
}

.engx-chat-message-body > p,
.engx-chat-task-card {
  max-width: 100%;
  margin: 0;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  padding: 7px 8px;
  background: var(--engx-surface);
  color: var(--engx-text);
  font-size: 0.62rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.engx-chat-message.is-mine .engx-chat-message-body > p {
  border-color: color-mix(in srgb, var(--engx-green) 28%, var(--engx-line));
  background: color-mix(in srgb, var(--engx-green) 11%, var(--engx-surface));
}

.engx-chat-message-body mark {
  border-radius: 2px;
  padding: 0 2px;
  background: color-mix(in srgb, var(--engx-amber) 24%, var(--engx-surface));
  color: var(--engx-text);
}

.engx-chat-message-body blockquote {
  display: grid;
  width: min(100%, 250px);
  gap: 2px;
  margin: 0 0 4px;
  border-left: 2px solid var(--engx-blue);
  padding: 4px 6px;
  background: color-mix(in srgb, var(--engx-blue) 5%, var(--engx-surface));
  color: var(--engx-muted);
  font-size: 0.55rem;
}

.engx-chat-message-body blockquote span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-chat-task-card {
  display: grid;
  width: min(100%, 260px);
  gap: 3px;
  border-left: 3px solid var(--engx-blue);
  text-align: left;
  box-shadow: none;
}

.engx-chat-task-card span,
.engx-chat-task-card small {
  color: var(--engx-muted);
  font-size: 0.54rem;
}

.engx-chat-task-card strong {
  font-size: 0.63rem;
}

.engx-chat-message-body > p.engx-recalled-text {
  border-style: dashed;
  background: transparent;
  color: var(--engx-muted);
  font-style: italic;
}

.engx-chat-message-body > footer {
  display: flex;
  width: 100%;
  min-height: 21px;
  align-items: center;
  gap: 7px;
}

.engx-chat-message.is-mine .engx-chat-message-body > footer {
  justify-content: flex-end;
}

.engx-chat-message-body > footer button {
  min-height: 20px;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: var(--engx-blue);
  font-size: 0.53rem;
  box-shadow: none;
}

.engx-chat-message-body > footer span {
  margin-left: auto;
  color: var(--engx-muted);
  font-size: 0.51rem;
}

.engx-chat-message.is-mine .engx-chat-message-body > footer span {
  margin-left: 0;
}

.engx-chat-reply {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px;
  align-items: center;
  gap: 7px;
  border-bottom: 1px solid var(--engx-line);
  padding: 6px 2px;
  background: var(--engx-surface-muted);
}

.engx-chat-reply div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.engx-chat-reply span,
.engx-chat-reply strong {
  overflow: hidden;
  font-size: 0.55rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-chat-reply span {
  color: var(--engx-blue);
}

.engx-chat-reply button {
  width: 24px;
  height: 24px;
  min-height: 24px;
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--engx-muted);
  box-shadow: none;
}

.engx-chat-form {
  display: grid;
  gap: 5px;
  padding-top: 7px;
}

.engx-chat-form textarea {
  width: 100%;
  min-width: 0;
  resize: vertical;
  border: 1px solid var(--engx-line);
  border-radius: 3px;
  background: var(--engx-surface);
  color: var(--engx-text);
  font-size: 0.62rem;
  line-height: 1.45;
}

.engx-chat-form footer {
  display: grid;
  grid-template-columns: 28px 28px 1fr auto;
  align-items: center;
  gap: 4px;
}

.engx-chat-form footer > button:not(.button),
.engx-chat-form footer > a {
  display: grid;
  width: 28px;
  height: 28px;
  min-height: 28px;
  place-items: center;
  border: 1px solid var(--engx-line);
  border-radius: 3px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
  font-size: 0.66rem;
  font-weight: 800;
  box-shadow: none;
}

.engx-chat-form footer .button {
  min-height: 29px;
  padding-inline: 12px;
  font-size: 0.62rem;
}

.engx-mention-menu {
  position: absolute;
  right: 12px;
  bottom: 108px;
  left: 12px;
  z-index: 3;
  max-height: 190px;
  overflow-y: auto;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  padding: 4px;
  background: var(--engx-surface);
  box-shadow: 0 12px 30px rgb(15 23 42 / 16%);
}

.engx-mention-menu button {
  display: grid;
  width: 100%;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 2px 7px;
  border: 0;
  border-radius: 3px;
  padding: 6px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-mention-menu button:hover {
  background: var(--engx-surface-muted);
}

.engx-mention-menu button > span {
  display: grid;
  width: 24px;
  height: 24px;
  grid-row: 1 / span 2;
  place-items: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--engx-blue) 13%, var(--engx-surface));
  color: var(--engx-blue);
  font-size: 0.55rem;
}

.engx-mention-menu strong,
.engx-mention-menu small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-mention-menu strong {
  font-size: 0.61rem;
}

.engx-mention-menu small {
  color: var(--engx-muted);
  font-size: 0.53rem;
}

.engx-chat-section.is-expanded {
  position: fixed;
  z-index: 80;
  top: 72px;
  right: 20px;
  bottom: 20px;
  width: min(520px, calc(100vw - 40px));
  overflow: hidden;
  border: 1px solid var(--engx-line);
  border-radius: 6px;
  padding: 14px;
  background: var(--engx-surface);
  box-shadow: 0 24px 70px rgb(15 23 42 / 28%);
}

.engx-chat-section.is-expanded .engx-chat-panel {
  display: grid;
  height: calc(100% - 78px);
  grid-template-rows: auto minmax(0, 1fr) auto auto;
}

.engx-chat-section.is-expanded .engx-chat-messages {
  max-height: none;
  min-height: 0;
}

.engx-chat-section.is-expanded .engx-review-panel {
  height: calc(100% - 78px);
  overflow-y: auto;
}

body.engx-chat-open {
  overflow: hidden;
}

.engx-activity-list {
  max-height: 270px;
  overflow-y: auto;
}

.engx-activity-list article {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr);
  gap: 7px;
  border-top: 1px solid var(--engx-line);
  padding: 8px 1px;
}

.engx-activity-list article i {
  width: 7px;
  height: 7px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--engx-blue);
}

.engx-activity-list p {
  margin: 0;
  color: var(--engx-text);
  font-size: 0.61rem;
  line-height: 1.45;
}

.engx-activity-list time {
  color: var(--engx-muted);
  font-size: 0.56rem;
}

.engx-task-dialog {
  width: min(620px, calc(100vw - 28px));
  max-height: calc(100vh - 36px);
  overflow: auto;
  border: 1px solid var(--engx-line);
  border-radius: 7px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: 0 24px 70px rgb(0 0 0 / 24%);
}

.engx-task-dialog::backdrop {
  background: rgb(15 23 42 / 46%);
}

.engx-task-dialog [hidden] {
  display: none !important;
}

.engx-task-dialog form {
  padding: 16px;
}

.engx-task-dialog label {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.engx-task-dialog label > span {
  color: var(--engx-muted);
  font-size: 0.64rem;
  font-weight: 750;
}

.engx-task-dialog input,
.engx-task-dialog select,
.engx-task-dialog textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-task-title-field {
  margin-top: 14px;
}

.engx-task-dialog-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.engx-task-notes-field {
  grid-column: 1 / -1;
}

.engx-task-dialog footer {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  gap: 8px;
  margin-top: 16px;
  border-top: 1px solid var(--engx-line);
  padding-top: 12px;
}

.engx-task-dialog .danger {
  color: var(--engx-red);
}

.engx-team-head-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.engx-team-head-actions > span {
  color: var(--engx-muted);
  font-size: 0.59rem;
}

.engx-team-head-actions .engx-compact-action {
  min-height: 27px;
  padding-inline: 7px;
  font-size: 0.59rem;
}

.engx-directory-dialog {
  width: min(860px, calc(100vw - 30px));
  max-height: calc(100vh - 36px);
  overflow: hidden;
  border: 1px solid var(--engx-line);
  border-radius: 7px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: 0 24px 70px rgb(15 23 42 / 28%);
}

.engx-directory-dialog::backdrop {
  background: rgb(15 23 42 / 46%);
}

.engx-directory-shell {
  display: grid;
  grid-template-rows: auto auto auto auto minmax(220px, 1fr) auto;
  max-height: calc(100vh - 38px);
  padding: 16px;
}

.engx-directory-shell .dialog-head span {
  color: var(--engx-muted);
  font-size: 0.62rem;
}

.engx-directory-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  align-items: end;
  gap: 12px;
  margin-top: 14px;
  border-top: 1px solid var(--engx-line);
  padding-top: 12px;
}

.engx-directory-toolbar label {
  display: grid;
  gap: 5px;
}

.engx-directory-toolbar label span {
  color: var(--engx-muted);
  font-size: 0.62rem;
  font-weight: 750;
}

.engx-directory-toolbar input {
  width: 100%;
  min-width: 0;
  height: 36px;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-directory-filters {
  display: inline-flex;
  min-height: 36px;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface-muted);
}

.engx-directory-filters button {
  min-width: 72px;
  min-height: 34px;
  border: 0;
  border-right: 1px solid var(--engx-line);
  border-radius: 0;
  padding: 0 9px;
  background: transparent;
  color: var(--engx-muted);
  font-size: 0.63rem;
  font-weight: 750;
  box-shadow: none;
}

.engx-directory-filters button:last-child {
  border-right: 0;
}

.engx-directory-filters button.is-active {
  background: var(--engx-surface);
  color: var(--engx-blue);
}

.engx-directory-summary {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--engx-text);
  font-size: 0.66rem;
}

.engx-directory-summary small {
  color: var(--engx-muted);
  font-size: 0.58rem;
}

.engx-directory-list {
  min-height: 220px;
  overflow-y: auto;
  border: 1px solid var(--engx-line);
  background: var(--engx-surface);
}

.engx-directory-member {
  display: grid;
  grid-template-columns: 40px minmax(190px, 1.4fr) minmax(150px, 0.9fr) auto;
  min-height: 78px;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--engx-line);
  padding: 10px 12px;
}

.engx-directory-member:last-child {
  border-bottom: 0;
}

.engx-directory-member:hover {
  background: var(--engx-surface-muted);
}

.engx-directory-avatar {
  position: relative;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--engx-blue) 13%, var(--engx-surface));
  color: var(--engx-blue);
  font-size: 0.76rem;
  font-weight: 850;
}

.engx-directory-avatar i {
  position: absolute;
  right: 0;
  bottom: 1px;
  width: 10px;
  height: 10px;
  border: 2px solid var(--engx-surface);
  border-radius: 50%;
  background: var(--engx-muted);
}

.engx-directory-member.is-online .engx-directory-avatar i {
  background: var(--engx-green);
}

.engx-directory-identity {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.engx-directory-identity strong,
.engx-directory-identity a,
.engx-directory-identity small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-directory-identity strong {
  font-size: 0.7rem;
}

.engx-directory-identity a {
  color: var(--engx-blue);
  font-size: 0.62rem;
}

.engx-directory-identity small {
  color: var(--engx-muted);
  font-size: 0.56rem;
}

.engx-directory-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.engx-directory-tags span {
  border: 1px solid color-mix(in srgb, var(--engx-blue) 25%, var(--engx-line));
  border-radius: 3px;
  padding: 3px 5px;
  background: color-mix(in srgb, var(--engx-blue) 5%, var(--engx-surface));
  color: var(--engx-blue);
  font-size: 0.54rem;
}

.engx-directory-tags span.is-muted {
  border-color: var(--engx-line);
  background: var(--engx-surface-muted);
  color: var(--engx-muted);
}

.engx-directory-actions {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
}

.engx-directory-actions .button {
  min-width: 76px;
  min-height: 31px;
  padding-inline: 9px;
  font-size: 0.6rem;
}

.engx-directory-actions .button:disabled {
  opacity: 0.48;
}

.engx-directory-empty {
  display: grid;
  min-height: 240px;
  place-content: center;
  justify-items: center;
  gap: 5px;
  padding: 20px;
  color: var(--engx-muted);
  text-align: center;
}

.engx-directory-empty strong {
  color: var(--engx-text);
  font-size: 0.78rem;
}

.engx-directory-empty span {
  font-size: 0.61rem;
}

.engx-directory-shell > footer {
  display: flex;
  min-height: 48px;
  align-items: end;
  justify-content: space-between;
  gap: 10px;
  border-top: 1px solid var(--engx-line);
  margin-top: 12px;
  color: var(--engx-muted);
  font-size: 0.6rem;
}

.engx-directory-shell > footer .button {
  min-height: 32px;
  padding-inline: 13px;
  font-size: 0.62rem;
}

.engx-directory-shell > footer > div {
  display: flex;
  gap: 7px;
}

.engx-message-entry {
  position: relative;
}

.engx-message-entry b {
  display: inline-grid;
  min-width: 17px;
  height: 17px;
  place-items: center;
  border-radius: 9px;
  margin-left: 3px;
  padding: 0 4px;
  background: var(--engx-red);
  color: #fff;
  font-size: 0.5rem;
}

.engx-message-entry b[hidden] {
  display: none;
}

.engx-directory-scope {
  display: flex;
  gap: 18px;
  min-height: 38px;
  align-items: end;
  border-bottom: 1px solid var(--engx-line);
  margin-top: 12px;
}

.engx-directory-scope button {
  min-height: 37px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0 2px;
  background: transparent;
  color: var(--engx-muted);
  font-size: 0.66rem;
  font-weight: 800;
  box-shadow: none;
}

.engx-directory-scope button.is-active {
  border-bottom-color: var(--engx-blue);
  color: var(--engx-blue);
}

.engx-global-engineer .engx-directory-identity > span {
  overflow: hidden;
  color: var(--engx-text);
  font-size: 0.61rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-directory-tags span.is-relationship {
  border-color: color-mix(in srgb, var(--engx-green) 38%, var(--engx-line));
  background: color-mix(in srgb, var(--engx-green) 8%, var(--engx-surface));
  color: var(--engx-green);
}

.engx-directory-empty .button {
  min-height: 32px;
  margin-top: 6px;
  font-size: 0.61rem;
}

.engx-profile-dialog {
  width: min(680px, calc(100vw - 30px));
  max-height: calc(100vh - 36px);
  overflow: auto;
  border: 1px solid var(--engx-line);
  border-radius: 7px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: 0 24px 70px rgb(15 23 42 / 28%);
}

.engx-profile-dialog::backdrop,
.engx-direct-dialog::backdrop {
  background: rgb(15 23 42 / 46%);
}

.engx-profile-dialog form {
  padding: 17px;
}

.engx-profile-dialog .dialog-head span {
  color: var(--engx-muted);
  font-size: 0.6rem;
}

.engx-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  border-top: 1px solid var(--engx-line);
  margin-top: 14px;
  padding-top: 14px;
}

.engx-profile-grid > label {
  display: grid;
  gap: 5px;
}

.engx-profile-grid > label > span:first-child {
  color: var(--engx-muted);
  font-size: 0.61rem;
  font-weight: 750;
}

.engx-profile-grid input:not([type="checkbox"]),
.engx-profile-grid select,
.engx-profile-grid textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-profile-grid input:not([type="checkbox"]),
.engx-profile-grid select {
  min-height: 36px;
}

.engx-profile-grid textarea {
  resize: vertical;
}

.engx-profile-grid .engx-profile-visibility {
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  padding: 8px 10px;
  background: var(--engx-surface-muted);
}

.engx-profile-visibility input {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}

.engx-profile-visibility > span {
  display: grid;
  gap: 2px;
}

.engx-profile-visibility strong {
  font-size: 0.63rem;
}

.engx-profile-visibility small {
  color: var(--engx-muted);
  font-size: 0.54rem;
}

.engx-profile-dialog form > footer {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 8px;
  border-top: 1px solid var(--engx-line);
  margin-top: 16px;
  padding-top: 12px;
}

.engx-profile-dialog form > footer > span {
  color: var(--engx-muted);
  font-size: 0.6rem;
}

.engx-profile-dialog form > footer .button {
  min-height: 34px;
  font-size: 0.63rem;
}

.engx-direct-dialog {
  width: min(1040px, calc(100vw - 30px));
  height: min(720px, calc(100vh - 34px));
  max-width: none;
  max-height: none;
  overflow: hidden;
  border: 1px solid var(--engx-line);
  border-radius: 7px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: 0 24px 70px rgb(15 23 42 / 28%);
}

.engx-direct-shell {
  display: grid;
  grid-template-columns: 310px minmax(0, 1fr);
  height: 100%;
}

.engx-direct-shell > aside {
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  min-width: 0;
  border-right: 1px solid var(--engx-line);
  background: var(--engx-surface-muted);
}

.engx-direct-shell > aside > header {
  display: flex;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--engx-line);
  padding: 12px 14px;
}

.engx-direct-shell > aside h2 {
  margin: 2px 0 0;
  font-size: 0.84rem;
}

.engx-messenger-head-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.engx-messenger-head-actions .icon-button {
  min-width: 32px;
  width: 32px;
  height: 32px;
  font-size: 0.7rem;
}

.engx-message-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-height: 38px;
  border-bottom: 1px solid var(--engx-line);
  padding: 0 10px;
  background: var(--engx-surface);
}

.engx-message-tabs button {
  min-width: 0;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0 4px;
  background: transparent;
  color: var(--engx-muted);
  font-size: 0.59rem;
  font-weight: 750;
  box-shadow: none;
}

.engx-message-tabs button.is-active {
  border-bottom-color: var(--engx-blue);
  color: var(--engx-blue);
}

.engx-direct-summary {
  display: flex;
  min-height: 45px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 1px solid var(--engx-line);
  padding: 0 12px;
  color: var(--engx-muted);
  font-size: 0.58rem;
}

.engx-direct-summary button {
  border: 0;
  padding: 3px;
  background: transparent;
  color: var(--engx-blue);
  font-size: 0.58rem;
  font-weight: 750;
}

.engx-direct-conversations {
  min-height: 0;
  overflow-y: auto;
}

.engx-direct-conversation {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 70px;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  border: 0;
  border-bottom: 1px solid var(--engx-line);
  border-radius: 0;
  padding: 9px 11px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-direct-conversation:hover,
.engx-direct-conversation.is-active {
  background: var(--engx-surface);
}

.engx-direct-conversation.is-active {
  box-shadow: inset 3px 0 0 var(--engx-blue);
}

.engx-direct-conversation > span:nth-child(2) {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.engx-direct-conversation strong,
.engx-direct-conversation small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-direct-conversation strong {
  font-size: 0.65rem;
}

.engx-direct-conversation small,
.engx-direct-conversation time {
  color: var(--engx-muted);
  font-size: 0.53rem;
}

.engx-direct-conversation b {
  position: absolute;
  right: 10px;
  bottom: 9px;
  display: grid;
  min-width: 16px;
  height: 16px;
  place-items: center;
  border-radius: 8px;
  padding: 0 4px;
  background: var(--engx-red);
  color: #fff;
  font-size: 0.48rem;
}

.engx-directory-avatar.is-online i,
.engx-direct-peer .engx-directory-avatar.is-online i {
  background: var(--engx-green);
}

.engx-directory-avatar.is-group {
  border-radius: 5px;
  background: color-mix(in srgb, var(--engx-green) 13%, var(--engx-surface));
  color: var(--engx-green);
}

.engx-direct-list-empty {
  display: grid;
  min-height: 180px;
  place-content: center;
  gap: 4px;
  padding: 18px;
  text-align: center;
}

.engx-direct-list-empty strong {
  font-size: 0.7rem;
}

.engx-direct-list-empty span {
  color: var(--engx-muted);
  font-size: 0.56rem;
}

.engx-direct-main {
  display: grid;
  min-width: 0;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  background: var(--engx-surface);
}

.engx-direct-peer {
  display: flex;
  min-height: 68px;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--engx-line);
  padding: 10px 16px;
}

.engx-direct-peer > div {
  display: grid;
  gap: 3px;
}

.engx-direct-peer strong {
  font-size: 0.72rem;
}

.engx-direct-peer span {
  color: var(--engx-muted);
  font-size: 0.57rem;
}

.engx-direct-peer .engx-group-info-button {
  min-height: 30px;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  margin-left: auto;
  padding: 0 10px;
  background: var(--engx-surface);
  color: var(--engx-muted);
  font-size: 0.58rem;
  font-weight: 750;
  box-shadow: none;
}

.engx-direct-messages {
  min-height: 0;
  overflow-y: auto;
  padding: 16px 18px;
  background: color-mix(in srgb, var(--engx-surface-muted) 55%, var(--engx-surface));
}

.engx-direct-empty {
  display: grid;
  height: 100%;
  min-height: 220px;
  place-content: center;
  gap: 5px;
  color: var(--engx-muted);
  text-align: center;
}

.engx-direct-empty strong {
  color: var(--engx-text);
  font-size: 0.78rem;
}

.engx-direct-empty span {
  font-size: 0.61rem;
}

.engx-direct-message {
  display: grid;
  grid-template-columns: 30px minmax(0, 520px);
  align-items: start;
  gap: 8px;
  margin-bottom: 13px;
}

.engx-direct-message.is-mine {
  grid-template-columns: minmax(0, 520px) 30px;
  justify-content: end;
}

.engx-direct-message.is-mine > .engx-chat-avatar {
  grid-column: 2;
  grid-row: 1;
}

.engx-direct-message.is-mine > div {
  grid-column: 1;
  grid-row: 1;
}

.engx-direct-message > div {
  min-width: 0;
}

.engx-direct-message header {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 4px;
}

.engx-direct-message.is-mine header {
  justify-content: flex-end;
}

.engx-direct-message header strong {
  font-size: 0.58rem;
}

.engx-direct-message header time {
  color: var(--engx-muted);
  font-size: 0.51rem;
}

.engx-direct-message p,
.engx-direct-message blockquote {
  width: fit-content;
  max-width: 100%;
  margin: 0;
  border: 1px solid var(--engx-line);
  border-radius: 5px;
  padding: 8px 10px;
  background: var(--engx-surface);
  color: var(--engx-text);
  font-size: 0.64rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.engx-direct-message.is-mine p {
  margin-left: auto;
  border-color: color-mix(in srgb, var(--engx-blue) 30%, var(--engx-line));
  background: color-mix(in srgb, var(--engx-blue) 8%, var(--engx-surface));
}

.engx-direct-message blockquote {
  margin-bottom: 4px;
  border-left: 3px solid var(--engx-blue);
  color: var(--engx-muted);
  font-size: 0.56rem;
}

.engx-direct-message.is-recalled p {
  color: var(--engx-muted);
  font-style: italic;
}

.engx-direct-message footer {
  display: flex;
  gap: 8px;
  margin-top: 3px;
}

.engx-direct-message.is-mine footer {
  justify-content: flex-end;
}

.engx-direct-message footer button {
  border: 0;
  padding: 2px 0;
  background: transparent;
  color: var(--engx-muted);
  font-size: 0.52rem;
}

.engx-group-system {
  display: flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 5px 0 12px;
  color: var(--engx-muted);
  text-align: center;
}

.engx-group-system span {
  border-radius: 3px;
  padding: 4px 7px;
  background: color-mix(in srgb, var(--engx-line) 42%, transparent);
  font-size: 0.54rem;
}

.engx-group-system time {
  font-size: 0.49rem;
}

.engx-direct-reply {
  display: flex;
  min-height: 40px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-top: 1px solid var(--engx-line);
  padding: 6px 14px;
  background: var(--engx-surface-muted);
}

.engx-direct-reply[hidden] {
  display: none;
}

.engx-direct-reply > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.engx-direct-reply span,
.engx-direct-reply strong {
  overflow: hidden;
  color: var(--engx-muted);
  font-size: 0.54rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-direct-reply button {
  border: 0;
  background: transparent;
  color: var(--engx-muted);
}

.engx-direct-form {
  position: relative;
  border-top: 1px solid var(--engx-line);
  padding: 10px 14px;
}

.engx-direct-form textarea {
  width: 100%;
  min-height: 62px;
  resize: none;
  border: 0;
  padding: 4px 0;
  background: transparent;
  color: var(--engx-text);
  font-size: 0.65rem;
  outline: none;
}

.engx-direct-form footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.engx-direct-form footer > div {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
}

.engx-direct-form footer > div > button {
  display: grid;
  width: 26px;
  height: 26px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-blue);
  font-size: 0.64rem;
  font-weight: 800;
}

.engx-direct-form footer > div > button:disabled {
  color: var(--engx-muted);
  opacity: 0.5;
}

.engx-direct-form footer span {
  color: var(--engx-muted);
  font-size: 0.54rem;
}

.engx-direct-form .button {
  min-width: 70px;
  min-height: 32px;
  font-size: 0.62rem;
}

.engx-direct-mention-menu {
  position: absolute;
  right: 14px;
  bottom: 116px;
  z-index: 4;
  display: grid;
  width: min(300px, calc(100% - 28px));
  max-height: 230px;
  overflow-y: auto;
  border: 1px solid var(--engx-line);
  border-radius: 5px;
  padding: 5px;
  background: var(--engx-surface);
  box-shadow: 0 14px 34px rgb(15 23 42 / 20%);
}

.engx-direct-mention-menu[hidden] {
  display: none;
}

.engx-direct-mention-menu button {
  display: grid;
  min-height: 46px;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  border: 0;
  border-radius: 3px;
  padding: 6px 8px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-direct-mention-menu button:hover {
  background: var(--engx-surface-muted);
}

.engx-direct-mention-menu button > span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--engx-blue) 12%, var(--engx-surface));
  color: var(--engx-blue);
  font-size: 0.58rem;
  font-weight: 800;
}

.engx-direct-mention-menu strong {
  font-size: 0.61rem;
}

.engx-direct-mention-menu small {
  color: var(--engx-muted);
  font-size: 0.52rem;
}

.engx-group-dialog {
  width: min(720px, calc(100vw - 30px));
  max-height: calc(100vh - 36px);
  overflow: auto;
  border: 1px solid var(--engx-line);
  border-radius: 7px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
  box-shadow: 0 24px 70px rgb(15 23 42 / 28%);
}

.engx-group-dialog::backdrop {
  background: rgb(15 23 42 / 46%);
}

.engx-group-dialog > form {
  padding: 17px;
}

.engx-group-dialog .dialog-head span {
  color: var(--engx-muted);
  font-size: 0.6rem;
}

.engx-group-fields {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(180px, 0.7fr);
  gap: 11px;
  border-top: 1px solid var(--engx-line);
  margin-top: 14px;
  padding-top: 14px;
}

.engx-group-fields label {
  display: grid;
  gap: 5px;
}

.engx-group-fields label > span {
  color: var(--engx-muted);
  font-size: 0.6rem;
  font-weight: 750;
}

.engx-group-fields input,
.engx-group-fields textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-group-fields input {
  min-height: 36px;
}

.engx-group-membership {
  margin-top: 14px;
  border: 1px solid var(--engx-line);
}

.engx-group-membership > header {
  display: flex;
  min-height: 56px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--engx-line);
  padding: 8px 10px;
  background: var(--engx-surface-muted);
}

.engx-group-membership > header > div {
  display: grid;
  gap: 3px;
}

.engx-group-membership > header strong {
  font-size: 0.65rem;
}

.engx-group-membership > header span {
  color: var(--engx-muted);
  font-size: 0.54rem;
}

.engx-group-membership > header input {
  width: min(270px, 48%);
  min-height: 34px;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
}

#engineeringGroupCandidates {
  max-height: 290px;
  overflow-y: auto;
}

.engx-group-candidate {
  display: grid;
  min-height: 58px;
  grid-template-columns: 18px 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid var(--engx-line);
  padding: 7px 10px;
  cursor: pointer;
}

.engx-group-candidate:last-child {
  border-bottom: 0;
}

.engx-group-candidate:hover {
  background: var(--engx-surface-muted);
}

.engx-group-candidate.is-joined {
  cursor: default;
  opacity: 0.68;
}

.engx-group-candidate input {
  width: 15px;
  height: 15px;
}

.engx-group-candidate .engx-directory-avatar {
  width: 34px;
  height: 34px;
}

.engx-group-candidate > span:nth-of-type(2) {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.engx-group-candidate strong,
.engx-group-candidate small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-group-candidate strong {
  font-size: 0.63rem;
}

.engx-group-candidate small,
.engx-group-candidate em {
  color: var(--engx-muted);
  font-size: 0.53rem;
  font-style: normal;
}

.engx-group-candidate-empty {
  display: grid;
  min-height: 150px;
  place-content: center;
  color: var(--engx-muted);
  font-size: 0.61rem;
}

.engx-group-dialog form > footer {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 8px;
  border-top: 1px solid var(--engx-line);
  margin-top: 14px;
  padding-top: 12px;
}

.engx-group-dialog form > footer > span {
  color: var(--engx-muted);
  font-size: 0.58rem;
}

.engx-group-dialog form > footer .button {
  min-height: 34px;
  font-size: 0.62rem;
}

.engx-service-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  border-bottom: 1px solid var(--engx-line);
  background: var(--engx-surface-muted);
}

.engx-service-metrics > div {
  display: grid;
  gap: 2px;
  border-right: 1px solid var(--engx-line);
  padding: 10px 16px;
}

.engx-service-metrics > div:last-child {
  border-right: 0;
}

.engx-service-metrics dt,
.engx-service-metrics dd {
  margin: 0;
}

.engx-service-metrics dt {
  color: var(--engx-muted);
  font-size: 0.61rem;
  font-weight: 750;
}

.engx-service-metrics dd {
  color: var(--engx-text);
  font-size: 1rem;
  font-weight: 800;
}

.engx-service-workspace {
  display: grid;
  grid-template-columns: minmax(250px, 34%) minmax(0, 1fr);
  min-height: 585px;
}

.engx-service-index {
  min-width: 0;
  border-right: 1px solid var(--engx-line);
  background: var(--engx-surface-muted);
}

.engx-service-toolbar {
  display: grid;
  gap: 10px;
  border-bottom: 1px solid var(--engx-line);
  padding: 12px;
}

.engx-service-toolbar .engx-segmented {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.engx-service-toolbar .engx-segmented button {
  min-width: 0;
  padding: 7px 3px;
  font-size: 0.55rem;
}

.engx-service-toolbar label {
  display: grid;
  gap: 4px;
}

.engx-service-toolbar label span {
  color: var(--engx-muted);
  font-size: 0.58rem;
  font-weight: 700;
}

.engx-service-toolbar input {
  width: 100%;
  min-width: 0;
  border-color: var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-service-list {
  display: grid;
  align-content: start;
  max-height: 520px;
  overflow-y: auto;
}

.engx-service-item {
  display: grid;
  min-width: 0;
  gap: 5px;
  border: 0;
  border-bottom: 1px solid var(--engx-line);
  border-left: 3px solid transparent;
  border-radius: 0;
  padding: 12px;
  background: transparent;
  color: var(--engx-text);
  text-align: left;
  box-shadow: none;
}

.engx-service-item:hover,
.engx-service-item.is-active {
  border-left-color: var(--engx-blue);
  background: var(--engx-surface);
}

.engx-service-item > strong,
.engx-service-item > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-service-item > strong {
  font-size: 0.71rem;
}

.engx-service-item > small,
.engx-service-item-meta {
  color: var(--engx-muted);
  font-size: 0.57rem;
}

.engx-service-item-top,
.engx-service-item-meta {
  display: flex;
  align-items: center;
  gap: 7px;
}

.engx-service-item-top {
  justify-content: space-between;
}

.engx-service-item-top em,
.engx-service-item-top i {
  color: var(--engx-muted);
  font-size: 0.54rem;
  font-style: normal;
  font-weight: 750;
}

.engx-service-item-top i[data-status="delivery"],
.engx-service-item-top i[data-status="completed"] {
  color: var(--engx-green);
}

.engx-service-item-meta b {
  margin-left: auto;
  color: var(--engx-amber);
  font-weight: 800;
}

.engx-service-list-empty,
.engx-service-empty {
  display: grid;
  min-height: 220px;
  place-content: center;
  gap: 6px;
  padding: 24px;
  color: var(--engx-muted);
  text-align: center;
}

.engx-service-list-empty strong,
.engx-service-empty strong {
  color: var(--engx-text);
  font-size: 0.75rem;
}

.engx-service-list-empty span,
.engx-service-empty span {
  max-width: 320px;
  font-size: 0.62rem;
}

.engx-service-detail {
  min-width: 0;
  background: var(--engx-surface);
}

.engx-service-record {
  min-width: 0;
}

.engx-service-record-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--engx-line);
  padding: 16px;
}

.engx-service-record-head > div {
  min-width: 0;
}

.engx-service-record-head span,
.engx-service-record-head p {
  margin: 0;
  color: var(--engx-muted);
  font-size: 0.58rem;
}

.engx-service-record-head h2 {
  margin: 4px 0;
  color: var(--engx-text);
  font-size: 1rem;
  line-height: 1.35;
}

.engx-service-status-control {
  display: grid;
  flex: 0 0 120px;
  gap: 4px;
}

.engx-service-status-control span {
  font-weight: 750;
}

.engx-service-status-control select,
.engx-service-milestones select {
  min-width: 0;
  border-color: var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
  font-size: 0.6rem;
}

.engx-service-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 12px 16px 0;
}

.engx-service-tags span {
  border: 1px solid var(--engx-line);
  border-radius: 3px;
  padding: 3px 7px;
  color: var(--engx-muted);
  font-size: 0.55rem;
}

.engx-service-summary {
  margin: 0;
  padding: 12px 16px;
  color: var(--engx-text);
  font-size: 0.68rem;
  line-height: 1.65;
  white-space: pre-wrap;
}

.engx-service-summary.is-masked {
  color: var(--engx-muted);
  font-style: italic;
}

.engx-service-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--engx-line);
  border-bottom: 1px solid var(--engx-line);
}

.engx-service-facts > div {
  min-width: 0;
  border-right: 1px solid var(--engx-line);
  padding: 10px 12px;
}

.engx-service-facts > div:last-child {
  border-right: 0;
}

.engx-service-facts dt,
.engx-service-facts dd {
  overflow: hidden;
  margin: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-service-facts dt,
.engx-service-deliverables > span {
  color: var(--engx-muted);
  font-size: 0.54rem;
  font-weight: 750;
}

.engx-service-facts dd {
  margin-top: 3px;
  color: var(--engx-text);
  font-size: 0.63rem;
  font-weight: 700;
}

.engx-service-deliverables {
  display: grid;
  gap: 3px;
  border-bottom: 1px solid var(--engx-line);
  padding: 10px 16px;
}

.engx-service-deliverables p {
  margin: 0;
  color: var(--engx-text);
  font-size: 0.62rem;
}

.engx-service-primary-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
  min-height: 12px;
  padding: 10px 16px;
}

.engx-service-primary-actions:empty {
  display: none;
}

.engx-service-primary-actions .button {
  min-height: 33px;
  font-size: 0.61rem;
}

.engx-service-section {
  border-top: 1px solid var(--engx-line);
  padding: 14px 16px;
}

.engx-service-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 9px;
}

.engx-service-section > header span,
.engx-service-section > header small {
  color: var(--engx-muted);
  font-size: 0.54rem;
}

.engx-service-section > header h3 {
  margin: 2px 0 0;
  color: var(--engx-text);
  font-size: 0.74rem;
}

.engx-service-section > header button,
.engx-service-matches button,
.engx-service-invites button,
.engx-service-milestones button {
  min-height: 28px;
  border: 1px solid var(--engx-line);
  border-radius: 4px;
  padding: 4px 9px;
  background: var(--engx-surface);
  color: var(--engx-blue);
  font-size: 0.56rem;
  font-weight: 750;
  box-shadow: none;
}

.engx-service-section button:disabled {
  color: var(--engx-muted);
  opacity: 0.7;
}

.engx-service-milestones {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}

.engx-service-milestones li {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid var(--engx-line);
  padding: 9px 0;
}

.engx-service-milestones li:last-child {
  border-bottom: 0;
}

.engx-service-milestones li > span:first-child {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border: 1px solid var(--engx-line);
  border-radius: 50%;
  color: var(--engx-muted);
  font-size: 0.55rem;
  font-weight: 800;
}

.engx-service-milestones li[data-state="accepted"] > span:first-child {
  border-color: var(--engx-green);
  color: var(--engx-green);
}

.engx-service-milestones li > div,
.engx-service-matches article > div,
.engx-service-invites > div > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.engx-service-milestones strong,
.engx-service-matches strong,
.engx-service-invites strong {
  color: var(--engx-text);
  font-size: 0.62rem;
}

.engx-service-milestones small,
.engx-service-matches small,
.engx-service-invites small {
  overflow: hidden;
  color: var(--engx-muted);
  font-size: 0.54rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.engx-service-matches,
.engx-service-invites {
  display: grid;
}

.engx-service-matches article,
.engx-service-invites > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--engx-line);
  padding: 9px 0;
}

.engx-service-matches article:last-child,
.engx-service-invites > div:last-child {
  border-bottom: 0;
}

.engx-service-matches p {
  margin: 1px 0 0;
  color: var(--engx-muted);
  font-size: 0.53rem;
}

.engx-service-score {
  display: grid;
  width: 38px;
  height: 38px;
  place-content: center;
  border: 1px solid color-mix(in srgb, var(--engx-green) 45%, var(--engx-line));
  border-radius: 50%;
  color: var(--engx-green);
  font-size: 0.68rem;
  font-weight: 850;
  text-align: center;
}

.engx-service-score small {
  color: var(--engx-muted);
  font-size: 0.43rem;
  font-weight: 700;
}

.engx-service-invites b {
  color: var(--engx-muted);
  font-size: 0.55rem;
}

.engx-service-inline-empty {
  padding: 18px 0;
  color: var(--engx-muted);
  font-size: 0.6rem;
  text-align: center;
}

.engx-service-dialog,
.engx-milestone-dialog {
  width: min(860px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  border: 1px solid var(--engx-line);
  border-radius: 6px;
  padding: 0;
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-milestone-dialog {
  width: min(520px, calc(100vw - 28px));
}

.engx-service-dialog::backdrop,
.engx-milestone-dialog::backdrop {
  background: rgb(10 18 28 / 58%);
}

.engx-service-dialog > form,
.engx-milestone-dialog > form {
  padding: 18px;
}

.engx-service-dialog .dialog-head span {
  color: var(--engx-muted);
  font-size: 0.6rem;
}

.engx-service-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  max-height: calc(100vh - 210px);
  overflow-y: auto;
  padding: 2px;
}

.engx-service-form-grid label,
.engx-milestone-dialog label {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.engx-service-form-grid label > span,
.engx-milestone-dialog label > span {
  color: var(--engx-muted);
  font-size: 0.59rem;
  font-weight: 750;
}

.engx-service-form-grid input,
.engx-service-form-grid select,
.engx-service-form-grid textarea,
.engx-milestone-dialog input,
.engx-milestone-dialog textarea {
  width: 100%;
  min-width: 0;
  border-color: var(--engx-line);
  border-radius: 4px;
  background: var(--engx-surface);
  color: var(--engx-text);
}

.engx-service-form-grid .engx-wide-field {
  grid-column: 1 / -1;
}

.engx-service-dialog form > footer,
.engx-milestone-dialog form > footer {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 8px;
  border-top: 1px solid var(--engx-line);
  margin-top: 14px;
  padding-top: 12px;
}

.engx-service-dialog form > footer > span,
.engx-milestone-dialog form > footer > span {
  color: var(--engx-muted);
  font-size: 0.58rem;
}

.engx-milestone-dialog form {
  display: grid;
  gap: 10px;
}

.engx-milestone-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

@media (max-width: 1280px) {
  .engx-shell {
    grid-template-columns: 210px minmax(0, 1fr);
  }

  .engx-context {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-column: 1 / -1;
    border-top: 1px solid var(--engx-line);
    border-left: 0;
  }

  .engx-context-section {
    border-right: 1px solid var(--engx-line);
    border-bottom: 0;
  }

  .engx-part-results {
    max-height: 240px;
  }
}

@media (max-width: 900px) {
  .engineering-integrated-page main {
    width: min(100% - 20px, 860px);
  }

  .engx-commandbar {
    grid-template-columns: 1fr auto;
  }

  .engx-project-context {
    grid-column: 1 / -1;
    grid-row: 2;
    border-top: 1px solid var(--engx-line);
    border-left: 0;
    padding: 8px 0 0;
  }

  .engx-lifecycle-metrics {
    grid-template-columns: repeat(7, 150px);
    overflow-x: auto;
  }

  .engx-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-service-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-service-index {
    border-right: 0;
    border-bottom: 1px solid var(--engx-line);
  }

  .engx-service-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: 320px;
  }

  .engx-sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--engx-line);
  }

  .engx-project-list {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    max-height: none;
  }

  .engx-sidebar-section {
    grid-template-columns: repeat(6, minmax(150px, 1fr));
    overflow-x: auto;
  }

  .engx-sidebar-section > span {
    display: none;
  }

  .engx-context {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-context-section {
    min-width: 0;
    border-right: 0;
    border-bottom: 1px solid var(--engx-line);
  }

  .engx-directory-member {
    grid-template-columns: 40px minmax(0, 1fr) auto;
  }

  .engx-directory-tags {
    grid-column: 2;
  }

  .engx-directory-actions {
    grid-column: 3;
    grid-row: 1 / span 2;
  }

  .engx-direct-dialog {
    width: calc(100vw - 20px);
  }

  .engx-direct-shell {
    grid-template-columns: 260px minmax(0, 1fr);
  }
}

@media (max-width: 680px) {
  .engineering-integrated-page .topbar {
    position: relative;
  }

  .engineering-integrated-page .header-actions {
    gap: 8px;
  }

  .engineering-integrated-page .auth-status {
    min-width: 0;
    padding-inline: 8px;
  }

  .engineering-integrated-page .language-switch {
    min-width: 0;
    padding: 3px;
  }

  .engineering-integrated-page .language-switch > span {
    display: none;
  }

  .engineering-integrated-page .language-switch select {
    min-width: 0;
    width: 100%;
  }

  .engx-commandbar {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .engx-command-actions {
    justify-content: stretch;
  }

  .engx-command-actions .button {
    flex: 1 1 0;
    min-width: 0;
    padding-inline: 7px;
  }

  .engx-project-context {
    grid-column: auto;
    grid-row: auto;
  }

  .engx-view {
    min-height: 520px;
  }

  .engx-view-head,
  .engx-section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .engx-decision-run {
    width: 100%;
    justify-content: space-between;
  }

  .engx-decision-flow {
    grid-template-columns: repeat(5, 118px);
  }

  .engx-source-strip {
    grid-template-columns: 1fr;
  }

  .engx-source-coverage {
    justify-content: flex-start;
  }

  .engx-decision-banner {
    align-items: flex-start;
    flex-direction: column;
  }

  .engx-decision-banner span {
    text-align: left;
  }

  .engx-service-metrics,
  .engx-service-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .engx-service-metrics > div:nth-child(2),
  .engx-service-facts > div:nth-child(2) {
    border-right: 0;
  }

  .engx-service-metrics > div:nth-child(-n + 2),
  .engx-service-facts > div:nth-child(-n + 2) {
    border-bottom: 1px solid var(--engx-line);
  }

  .engx-service-list {
    grid-template-columns: minmax(0, 1fr);
  }

  .engx-service-record-head {
    flex-direction: column;
  }

  .engx-service-status-control {
    width: 100%;
    flex-basis: auto;
  }

  .engx-service-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .engx-service-dialog form > footer,
  .engx-milestone-dialog form > footer {
    grid-template-columns: 1fr 1fr;
  }

  .engx-service-dialog form > footer > span,
  .engx-milestone-dialog form > footer > span {
    grid-column: 1 / -1;
  }

  .engx-view-actions {
    width: 100%;
    justify-content: stretch;
  }

  .engx-view-actions .button {
    flex: 1 1 0;
  }

  .engx-project-form,
  .engx-ai-fields,
  .engx-eco-dialog-grid,
  .engx-brief-grid,
  .engx-task-dialog-grid {
    grid-template-columns: 1fr;
  }

  .engx-wide-field {
    grid-column: auto;
  }

  .engx-task-notes-field {
    grid-column: auto;
  }

  .engx-task-board {
    grid-template-columns: repeat(4, 236px);
  }

  .engx-ai-layout,
  .engx-ai-support-grid {
    grid-template-columns: 1fr;
  }

  .engx-ai-requirement {
    border-right: 0;
    border-bottom: 1px solid var(--engx-line);
  }

  .engx-selection-card dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .engx-selection-evidence {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .engx-eco-board {
    grid-template-columns: repeat(4, 240px);
  }

  .engx-upload {
    grid-template-columns: 1fr;
  }

  .engx-eco-dialog-actions {
    grid-template-columns: 1fr 1fr;
  }

  .engx-eco-dialog-actions > span {
    display: none;
  }

  .engx-task-dialog footer {
    grid-template-columns: 1fr 1fr;
  }

  .engx-task-dialog footer > span {
    display: none;
  }

  .engx-directory-shell {
    padding: 12px;
  }

  .engx-directory-toolbar {
    grid-template-columns: 1fr;
  }

  .engx-directory-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .engx-directory-filters button {
    min-width: 0;
  }

  .engx-directory-member {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 8px;
  }

  .engx-directory-tags,
  .engx-directory-actions {
    grid-column: 2;
    grid-row: auto;
    justify-content: flex-start;
  }

  .engx-directory-actions {
    flex-wrap: wrap;
  }

  .engx-profile-grid {
    grid-template-columns: 1fr;
  }

  .engx-profile-grid .engx-wide-field {
    grid-column: auto;
  }

  .engx-profile-dialog form > footer {
    grid-template-columns: 1fr 1fr;
  }

  .engx-profile-dialog form > footer > span {
    grid-column: 1 / -1;
  }

  .engx-direct-dialog {
    width: calc(100vw - 12px);
    height: calc(100vh - 12px);
  }

  .engx-direct-shell {
    grid-template-columns: 1fr;
    grid-template-rows: 190px minmax(0, 1fr);
  }

  .engx-direct-shell > aside {
    grid-template-rows: auto auto minmax(0, 1fr);
    border-right: 0;
    border-bottom: 1px solid var(--engx-line);
  }

  .engx-direct-shell > aside > header {
    min-height: 56px;
    padding: 8px 10px;
  }

  .engx-direct-summary {
    position: absolute;
    top: 16px;
    right: 48px;
    min-height: 32px;
    border: 0;
    padding: 0;
  }

  .engx-direct-summary > span {
    display: none;
  }

  .engx-direct-conversations {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
  }

  .engx-direct-conversation {
    width: 210px;
    min-width: 210px;
    border-right: 1px solid var(--engx-line);
  }

  .engx-direct-peer {
    min-height: 58px;
    padding: 8px 12px;
  }

  .engx-direct-messages {
    padding: 12px 10px;
  }

  .engx-direct-form {
    padding: 8px 10px;
  }

  .engx-group-dialog > form {
    padding: 12px;
  }

  .engx-group-fields {
    grid-template-columns: 1fr;
  }

  .engx-group-fields .engx-wide-field {
    grid-column: auto;
  }

  .engx-group-membership > header {
    align-items: stretch;
    flex-direction: column;
  }

  .engx-group-membership > header input {
    width: 100%;
  }

  .engx-group-dialog form > footer {
    grid-template-columns: 1fr 1fr;
  }

  .engx-group-dialog form > footer > span {
    grid-column: 1 / -1;
  }

  .engx-chat-section.is-expanded {
    inset: 8px;
    width: auto;
    padding: 12px;
  }

  .engx-chat-section.is-expanded .engx-chat-panel,
  .engx-chat-section.is-expanded .engx-review-panel {
    height: calc(100% - 74px);
  }
}

/* Keep the industrial catalog visual system above the legacy CAD marketplace layer. */
body.misumi-marketplace-page {
  background: var(--mi-bg);
  color: var(--mi-text);
}

.misumi-marketplace-page main {
  width: min(calc(100% - 28px), 1580px);
  padding: 14px 0 34px;
}

.misumi-marketplace-page .topbar {
  min-height: 62px;
  border-color: var(--mi-line);
  background: rgb(255 255 255 / 96%);
  box-shadow: 0 3px 14px rgb(25 42 58 / 9%);
  backdrop-filter: blur(12px);
}

.misumi-marketplace-page .brand,
.misumi-marketplace-page .topnav a,
.misumi-marketplace-page .header-project-link {
  color: var(--mi-text);
}

.misumi-marketplace-page .brand strong {
  color: var(--mi-blue);
}

.misumi-marketplace-page .brand-mark,
.misumi-marketplace-page .button.primary {
  border-color: var(--mi-blue);
  background: var(--mi-blue);
  color: #fff;
}

.misumi-marketplace-page .topnav,
.misumi-marketplace-page .header-project-link {
  border: 1px solid var(--mi-line);
  border-radius: 5px;
  background: var(--mi-surface);
}

.misumi-marketplace-page .button.secondary,
.misumi-marketplace-page .small-button {
  border-color: var(--mi-line-strong);
  background: var(--mi-surface);
  color: var(--mi-blue);
}

@media (max-width: 680px) {
  .misumi-marketplace-page main {
    width: min(calc(100% - 16px), 1580px);
    padding-top: 8px;
  }
}

/* MISUMI-style industrial catalog shell */
.mi-procurement-page {
  --mi-yellow: #f3c52b;
  --mi-yellow-dark: #d9ab0e;
  --mi-navy: #123b8d;
  --mi-navy-dark: #082c72;
  --mi-charcoal: #3e4144;
  --mi-header-gray: #666b70;
  --mi-page: #f1f1f1;
  --mi-rule: #d6d6d6;
  background: var(--mi-page);
  color: #333;
}

.mi-procurement-page [hidden] {
  display: none !important;
}

.mi-procurement-page main {
  width: min(calc(100% - 80px), 1200px);
  padding: 10px 0 36px;
}

.mi-site-header {
  color: #fff;
  font-family: Arial, "Microsoft YaHei", sans-serif;
}

.mi-utility-bar,
.mi-masthead,
.mi-primary-catalog-nav {
  padding-right: max(40px, calc((100vw - 1200px) / 2));
  padding-left: max(40px, calc((100vw - 1200px) / 2));
}

.mi-utility-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 28px;
  background: #56595c;
  font-size: 11px;
}

.mi-utility-bar > div,
.mi-utility-bar nav {
  display: flex;
  align-items: center;
  gap: 14px;
}

.mi-account-summary {
  min-width: 0;
}

.mi-account-entry {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 7px;
  color: #fff !important;
  text-decoration: none !important;
}

.mi-account-avatar {
  display: inline-grid;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid #f3c52b;
  background: #414448;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
}

.mi-account-entry > span:last-child {
  display: grid;
  min-width: 0;
}

.mi-account-entry strong {
  overflow: hidden;
  max-width: 150px;
  color: #fff;
  font-size: 11px;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mi-account-entry small {
  overflow: hidden;
  max-width: 220px;
  margin-top: 2px;
  color: #d8d8d8;
  font-size: 9px;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mi-account-summary > button {
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  font: inherit;
  font-size: 10px;
  text-decoration: underline;
  cursor: pointer;
}

.mi-procurement-page a.is-auth-required:not(.mi-account-entry) {
  opacity: 0.82;
}

.mi-utility-bar a {
  color: #fff;
}

.mi-utility-bar > div a {
  color: #ffe675;
  text-decoration: underline;
}

.mi-masthead {
  display: grid;
  grid-template-columns: 290px minmax(320px, 1fr) 122px 104px;
  align-items: center;
  gap: 12px;
  min-height: 90px;
  background: var(--mi-header-gray);
}

.mi-wordmark {
  display: grid;
  grid-template-columns: 42px auto;
  align-items: center;
  color: #fff;
}

.mi-wordmark > span {
  display: grid;
  grid-row: 1 / 3;
  width: 36px;
  height: 36px;
  place-items: center;
  transform: rotate(45deg);
  border: 3px solid var(--mi-yellow);
  background: #173b7d;
  color: #fff;
  font-size: 18px;
  font-weight: 900;
}

.mi-wordmark > span::first-letter {
  transform: rotate(-45deg);
}

.mi-wordmark strong {
  font-size: 25px;
  line-height: 1;
}

.mi-wordmark small {
  color: #e8e8e8;
  font-size: 10px;
}

.mi-search-stack {
  min-width: 0;
}

.mi-header-search {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr) 48px;
  height: 42px;
}

.mi-header-search select,
.mi-header-search input {
  min-width: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  color: #333;
}

.mi-header-search select {
  border-right: 1px solid #ddd;
  padding: 0 30px 0 10px;
}

.mi-header-search input {
  padding: 0 14px;
  font-size: 13px;
}

.mi-header-search button {
  border: 0;
  border-radius: 0;
  background: var(--mi-yellow);
  color: #17233a;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}

.mi-hot-keywords {
  display: flex;
  gap: 16px;
  margin-top: 7px;
  overflow: hidden;
  font-size: 10px;
  white-space: nowrap;
}

.mi-hot-keywords a {
  color: #f3f3f3;
}

.mi-bulk-order,
.mi-header-cart {
  display: grid;
  min-height: 42px;
  place-items: center;
  border: 1px solid transparent;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
}

.mi-bulk-order {
  background: var(--mi-navy);
}

.mi-header-cart {
  border-color: #ead05f;
  background: var(--mi-yellow);
  color: #473b00;
}

.mi-primary-catalog-nav {
  display: flex;
  min-width: 0;
  min-height: 40px;
  overflow-x: auto;
  background: var(--mi-charcoal);
}

.mi-primary-catalog-nav a {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-height: 40px;
  padding: 0 17px;
  color: #fff;
  font-size: 12px;
}

.mi-primary-catalog-nav a:hover {
  background: #555;
}

.mi-primary-catalog-nav .is-category {
  background: var(--mi-yellow);
  color: #343000;
  font-size: 13px;
  font-weight: 900;
}

.mi-quick-rail {
  position: fixed;
  z-index: 20;
  top: 205px;
  right: 0;
  display: grid;
  width: 48px;
  border: 1px solid #d3d3d3;
  background: #fff;
  box-shadow: 0 2px 8px rgb(0 0 0 / 10%);
}

.mi-quick-rail a {
  display: grid;
  min-height: 54px;
  place-content: center;
  border-bottom: 1px solid #e2e2e2;
  color: #333;
  text-align: center;
}

.mi-quick-rail strong {
  font-size: 10px;
}

.mi-quick-rail span {
  margin-top: 2px;
  color: #777;
  font-size: 9px;
}

.mi-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 26px;
  color: #777;
  font-size: 11px;
}

.mi-breadcrumb a {
  color: #777;
}

.mi-catalog-intro {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  border: 1px solid #ddd;
  padding: 0 12px;
  background: #fff;
}

.mi-catalog-intro p {
  overflow: hidden;
  margin: 0;
  color: #666;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mi-catalog-intro button {
  border: 0;
  background: transparent;
  color: #888;
  font-size: 10px;
}

.mi-visual-filter {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  margin-top: 10px;
  border: 1px solid #d5d9df;
  background: #fff;
}

.gb-screw-classification {
  margin-top: 10px;
  border: 1px solid #d5d9df;
  background: #fff;
}

.gb-screw-classification-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 18px;
  min-height: 58px;
  border-bottom: 1px solid #d5d9df;
  padding: 9px 14px;
}

.gb-screw-classification-head > div {
  display: grid;
  gap: 2px;
}

.gb-screw-classification-head span,
.gb-screw-classification-head p {
  margin: 0;
  color: #5f6368;
  font-size: 11px;
}

.gb-screw-classification-head h2 {
  margin: 0;
  color: #202124;
  font-size: 15px;
  letter-spacing: 0;
}

.gb-screw-classification-head > a {
  color: #1769aa;
  font-size: 12px;
  font-weight: 700;
}

.gb-screw-classification-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(128px, 1fr));
  gap: 1px;
  overflow-x: auto;
  background: #e4e7eb;
}

.vacuum-oring-classification .gb-screw-classification-grid {
  grid-template-columns: repeat(3, minmax(210px, 1fr));
}

.bearing-classification .gb-screw-classification-grid {
  grid-template-columns: repeat(5, minmax(176px, 1fr));
}

.equipment-label-classification .gb-screw-classification-grid {
  grid-template-columns: repeat(4, minmax(210px, 1fr));
}

.vacuum-oring-classification .gb-screw-classification-grid > a:hover,
.vacuum-oring-classification .gb-screw-classification-grid > a.is-active {
  box-shadow: inset 0 -3px #188038;
  background: #f7fbf8;
}

.gb-screw-classification-grid > a {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  grid-template-rows: 1fr 1fr;
  align-items: center;
  min-width: 128px;
  min-height: 76px;
  padding: 6px;
  background: #fff;
  color: #202124;
}

.gb-screw-classification-grid > a:hover,
.gb-screw-classification-grid > a.is-active {
  box-shadow: inset 0 -3px #1a73e8;
  background: #f8fbff;
}

.gb-screw-classification-grid [data-cad-viewer] {
  position: relative;
  grid-row: 1 / 3;
  width: 60px;
  height: 60px;
  overflow: hidden;
  background: #f7f9fb;
}

.gb-screw-classification-grid canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.gb-screw-classification-grid span {
  align-self: end;
  overflow-wrap: anywhere;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
}

.gb-screw-classification-grid strong {
  align-self: start;
  color: #5f6368;
  font-size: 9px;
  font-weight: 600;
}

.mi-visual-filter-title {
  display: grid;
  align-content: center;
  gap: 5px;
  border-right: 1px solid #d5d9df;
  padding: 16px 12px;
  background: #edf3fa;
  text-align: center;
}

.mi-visual-filter-title span {
  color: #555;
  font-size: 11px;
}

.mi-visual-filter-title strong {
  color: #222;
  font-size: 12px;
}

.mi-shape-filter-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(108px, 1fr));
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding: 10px;
}

.mi-shape-filter-grid a {
  display: grid;
  min-width: 108px;
  border: 1px solid transparent;
  padding: 3px;
  color: #555;
}

.mi-shape-filter-grid a:hover,
.mi-shape-filter-grid a.is-active {
  border-color: var(--mi-yellow-dark);
  background: #fffbea;
}

.mi-shape-filter-grid [data-cad-viewer] {
  position: relative;
  height: 70px;
  overflow: hidden;
  background: #f7f7f7;
}

.mi-shape-filter-grid canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.mi-shape-filter-grid span {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 6px 2px 2px;
  font-size: 10px;
}

.mi-shape-filter-grid i {
  width: 13px;
  height: 13px;
  border: 1px solid #aaa;
  background: #fff;
}

.mi-procurement-page .misumi-catalog-status {
  margin-top: 10px;
  border-color: #d2d2d2;
}

.mi-procurement-page .misumi-catalog-status > div {
  min-height: 38px;
}

.mi-procurement-page .misumi-catalog-shell {
  grid-template-columns: 220px minmax(0, 1fr);
  margin-top: 10px;
  border-color: #d2d2d2;
}

.mi-procurement-page .misumi-catalog-sidebar {
  background: #f6f7f8;
}

.mi-procurement-page .misumi-category-panel nav a:hover,
.mi-procurement-page .misumi-category-panel nav a.is-active {
  border-left-color: var(--mi-yellow-dark);
  background: #e9f0f8;
}

.mi-procurement-page .misumi-filter-panel select,
.mi-procurement-page .misumi-filter-panel input {
  min-height: 32px;
  border-radius: 0;
  font-size: 11px;
}

.mi-procurement-page .misumi-result-toolbar {
  min-height: 48px;
  border-top: 3px solid var(--mi-navy);
}

.mi-procurement-page .misumi-result-list {
  gap: 7px;
  background: #f3f3f3;
}

.catalog-pagination {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 92px;
  align-items: center;
  gap: 8px;
  min-height: 50px;
  border-top: 1px solid #d5d9df;
  padding: 8px 12px;
  background: #fff;
  text-align: center;
}

.catalog-pagination a,
.catalog-pagination span {
  display: grid;
  place-items: center;
  min-height: 32px;
  border: 1px solid #c5c9cf;
  color: #174ea6;
  font-size: 12px;
  font-weight: 700;
}

.catalog-pagination span {
  color: #9aa0a6;
  background: #f5f6f7;
}

.catalog-pagination strong {
  color: #3c4043;
  font-size: 12px;
}

.mi-procurement-page .misumi-product-row {
  border-radius: 0;
  border-color: #d6d6d6;
}

.mi-procurement-page .misumi-product-main h2,
.mi-procurement-page .misumi-series-code strong,
.mi-procurement-page .misumi-related a strong {
  color: var(--mi-navy);
}

.mi-procurement-page .misumi-product-actions .button.primary,
.mi-procurement-page .misumi-filter-panel .button.primary {
  border-color: var(--mi-navy);
  background: var(--mi-navy);
}

.mi-procurement-page .misumi-procurement-sidebar {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-column: 1 / -1;
  border-top: 1px solid #d2d2d2;
  border-left: 0;
  background: #fff;
}

.mi-procurement-page .misumi-procurement-sidebar > section {
  border-right: 1px solid #d2d2d2;
  border-bottom: 0;
}

.mi-product-stage {
  position: relative;
  display: grid;
  grid-template-columns: minmax(300px, 0.82fr) minmax(380px, 1.18fr);
  align-items: stretch;
  gap: 8px;
  border: 1px solid #d5d5d5;
  padding: 10px 303px 10px 10px;
  background: #fff;
}

.mi-product-media {
  min-width: 0;
}

.mi-product-media .misumi-detail-viewer {
  width: 100%;
  min-height: 290px;
  max-height: 360px;
  aspect-ratio: 1 / 1;
  border-color: #d4d4d4;
  background: #fff;
}

.mi-product-media-actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 7px;
}

.mi-product-media-actions form,
.mi-product-media-actions button,
.mi-product-media-actions a {
  width: 100%;
}

.mi-product-media-actions button,
.mi-product-media-actions a {
  display: grid;
  min-height: 29px;
  place-items: center;
  border: 0;
  border-right: 1px solid #ddd;
  background: #fff;
  color: var(--mi-navy);
  font-size: 11px;
  cursor: pointer;
}

.mi-product-offer {
  min-width: 0;
  padding: 4px 2px;
}

.mi-product-offer .misumi-detail-heading {
  display: block;
  border: 0;
  padding: 0;
}

.mi-product-offer .misumi-detail-heading > span {
  color: #777;
  font-size: 10px;
}

.mi-product-offer .misumi-detail-heading h1 {
  margin: 7px 0 10px;
  font-size: 18px;
}

.mi-product-offer .misumi-detail-heading p,
.mi-product-offer .misumi-detail-heading small {
  display: block;
  margin: 0 0 7px;
  color: #666;
  font-size: 11px;
  line-height: 1.5;
}

.mi-product-rating {
  display: flex;
  align-items: center;
  gap: 12px;
  border-top: 1px solid #e3e3e3;
  padding: 8px 0;
  font-size: 11px;
}

.mi-product-rating strong {
  color: #d89f00;
}

.mi-product-rating a {
  margin-left: auto;
  color: var(--mi-navy);
  text-decoration: underline;
}

.mi-price-callout {
  display: grid;
  grid-template-columns: auto auto 1fr;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 8px 14px;
  background: #fff8d8;
}

.mi-price-callout span,
.mi-price-callout small {
  color: #655a2d;
  font-size: 10px;
}

.mi-price-callout strong {
  color: #b65a00;
  font-size: 19px;
}

.mi-order-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 10px 0;
  border-top: 1px solid #ddd;
  border-left: 1px solid #ddd;
}

.mi-order-facts > div {
  display: flex;
  justify-content: space-between;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 7px 9px;
  font-size: 10px;
}

.mi-order-facts dt {
  color: #777;
}

.mi-order-facts dd {
  margin: 0;
  color: #333;
  font-weight: 800;
}

.mi-purchase-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.mi-purchase-actions form,
.mi-purchase-actions button {
  width: 100%;
}

.mi-cart-button,
.mi-order-button {
  min-height: 42px;
  border: 1px solid var(--mi-yellow-dark);
  border-radius: 0;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

.mi-cart-button {
  background: var(--mi-yellow);
  color: #493b00;
}

.mi-order-button {
  background: #fff;
  color: #9b7200;
}

.mi-related-preview {
  display: none;
  min-width: 0;
  border: 1px solid #d7d7d7;
}

.mi-related-preview > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.mi-related-preview > div button {
  min-height: 34px;
  border: 0;
  border-bottom: 1px solid #d7d7d7;
  background: #f2f2f2;
  color: #777;
  font-size: 10px;
}

.mi-related-preview > div .is-active {
  border-top: 3px solid var(--mi-navy);
  background: #fff;
  color: var(--mi-navy);
}

.mi-related-preview > a {
  display: grid;
  gap: 5px;
  padding: 8px;
}

.mi-related-preview [data-cad-viewer] {
  position: relative;
  height: 115px;
  overflow: hidden;
}

.mi-related-preview canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.mi-related-preview strong {
  color: #333;
  font-size: 10px;
  line-height: 1.4;
}

.mi-related-preview span,
.mi-related-preview small {
  color: #777;
  font-size: 9px;
}

.mi-side-configurator {
  position: absolute;
  z-index: 4;
  top: 10px;
  right: 10px;
  width: 285px;
  min-width: 0;
  border-left: 1px solid #b9c9df;
  background: #f1f6fd;
}

.mi-configurator-head,
.mi-configurator-model {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 34px;
  border-bottom: 1px solid #c7d3e4;
  padding: 0 9px;
  font-size: 10px;
}

.mi-configurator-model strong {
  overflow: hidden;
  color: var(--mi-navy);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mi-config-cad,
.mi-config-consult {
  display: grid;
  min-height: 34px;
  margin: 7px 9px 0;
  place-items: center;
  border: 1px solid var(--mi-navy);
  color: var(--mi-navy);
  font-size: 11px;
  font-weight: 800;
}

.mi-config-cad {
  background: var(--mi-navy);
  color: #fff;
}

.mi-config-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 8px;
  border-top: 1px solid #c7d3e4;
  border-bottom: 1px solid #c7d3e4;
  background: #fff;
}

.mi-config-tabs > * {
  padding: 9px;
  color: #555;
  font-size: 11px;
  text-align: center;
}

.mi-config-tabs strong {
  border-top: 3px solid var(--mi-navy);
  color: var(--mi-navy);
}

.mi-side-configurator > form {
  display: block;
  margin: 0;
  padding: 8px;
}

.mi-side-configurator .misumi-parameter-grid {
  grid-template-columns: 1fr;
  max-height: 320px;
  overflow-y: auto;
}

.mi-side-configurator .misumi-parameter-grid label {
  padding: 6px;
  background: #fff;
}

.mi-side-configurator .misumi-parameter-grid select,
.mi-side-configurator .misumi-parameter-grid input,
.mi-side-configurator .misumi-quantity-field input {
  min-height: 31px !important;
}

.bearing-variant-config {
  margin: 8px 0;
  border: 1px solid #b9c9df;
  background: #edf4ff;
}

.bearing-variant-config > div:first-child {
  display: grid;
  gap: 2px;
  padding: 7px;
  border-bottom: 1px solid #c7d3e4;
}

.bearing-variant-config > div:first-child strong {
  color: #174ea6;
  font-size: 12px;
}

.bearing-variant-config > div:first-child span {
  color: #5f6368;
  font-size: 10px;
}

.mi-side-configurator .bearing-variant-config .misumi-parameter-grid {
  max-height: none;
  padding: 6px;
}

.mi-side-configurator .misumi-quantity-field {
  margin-top: 7px;
  padding: 6px;
  background: #fff;
}

.mi-side-configurator form > .button {
  width: 100%;
  margin-top: 8px;
  border-color: var(--mi-yellow-dark);
  background: var(--mi-yellow);
  color: #493b00;
}

.mi-side-configurator .misumi-generated-model {
  grid-template-columns: 1fr;
  margin: 0 8px 8px;
  background: #fffbea;
}

.mi-side-configurator .misumi-generated-model > div {
  padding: 7px;
}

.equipment-label-variant-config {
  background: #f5f8fc;
}

.equipment-label-issue-panel {
  display: grid;
  grid-template-columns: minmax(190px, 0.28fr) minmax(0, 1fr);
  gap: 18px;
  margin-top: 10px;
  border: 1px solid #cbd5e1;
  border-top: 3px solid #1558a6;
  padding: 16px;
  background: #fff;
}

.equipment-label-issue-panel > div {
  display: grid;
  align-content: start;
  gap: 5px;
}

.equipment-label-issue-panel > div strong {
  color: #202124;
  font-size: 16px;
}

.equipment-label-issue-panel > div span,
.equipment-label-issue-panel form > small {
  color: #5f6368;
  font-size: 11px;
  line-height: 1.5;
}

.equipment-label-issue-panel form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin: 0;
}

.equipment-label-issue-panel form label {
  display: grid;
  align-content: start;
  gap: 5px;
  min-width: 0;
  color: #3c4043;
  font-size: 10px;
}

.equipment-label-issue-panel form input,
.equipment-label-issue-panel form select {
  width: 100%;
  min-width: 0;
  min-height: 36px;
  border: 1px solid #bdc7d2;
  border-radius: 2px;
  padding: 7px 9px;
  background: #fff;
  color: #202124;
  font: inherit;
}

.equipment-label-issue-grid {
  display: contents;
}

.equipment-label-issue-panel form > .button,
.equipment-label-issue-panel form > small {
  grid-column: span 2;
}

.equipment-label-resolver {
  display: grid;
  gap: 14px;
  margin: 14px auto 30px;
  border: 1px solid #d5d9df;
  border-top: 4px solid #1558a6;
  padding: 20px;
  background: #fff;
}

.equipment-label-resolver-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid #e3e7eb;
  padding-bottom: 16px;
}

.equipment-label-resolver-head > div:first-child {
  display: grid;
  gap: 4px;
}

.equipment-label-resolver-head span,
.equipment-label-resolver-head p {
  margin: 0;
  color: #5f6368;
  font-size: 11px;
}

.equipment-label-resolver-head h1 {
  margin: 0;
  color: #202124;
  font-size: 24px;
  letter-spacing: 0;
}

.equipment-label-status {
  display: grid;
  min-width: 128px;
  border-left: 3px solid #188038;
  padding: 8px 10px;
  background: #f4fbf6;
}

.equipment-label-status strong {
  color: #137333;
  font-size: 15px;
}

.equipment-label-template-ref {
  display: grid;
  grid-template-columns: minmax(220px, 0.42fr) minmax(0, 1fr);
  gap: 20px;
  align-items: center;
}

.equipment-label-template-ref [data-cad-viewer] {
  position: relative;
  min-height: 210px;
  border: 1px solid #dce1e6;
  background: #f7f9fb;
}

.equipment-label-template-ref dl,
.equipment-label-record-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid #dfe3e7;
  border-left: 1px solid #dfe3e7;
}

.equipment-label-template-ref dl > div,
.equipment-label-record-grid > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  border-right: 1px solid #dfe3e7;
  border-bottom: 1px solid #dfe3e7;
  padding: 10px;
}

.equipment-label-template-ref dt,
.equipment-label-record-grid span {
  color: #5f6368;
  font-size: 10px;
}

.equipment-label-template-ref dd,
.equipment-label-record-grid strong {
  margin: 0;
  overflow-wrap: anywhere;
  color: #202124;
  font-size: 12px;
}

.equipment-label-history {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 18px;
  border-top: 1px solid #e3e7eb;
  padding-top: 16px;
}

.equipment-label-history h2 {
  margin: 4px 0 0;
  font-size: 17px;
}

.equipment-label-history ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.equipment-label-history li {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr);
  gap: 8px;
}

.equipment-label-history li i {
  width: 7px;
  height: 7px;
  margin-top: 5px;
  border-radius: 50%;
  background: #1a73e8;
}

.equipment-label-history li div {
  display: grid;
  gap: 2px;
}

.equipment-label-history li span,
.equipment-label-history li small,
.equipment-label-private p {
  margin: 0;
  color: #5f6368;
  font-size: 11px;
}

.equipment-label-resolver-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.equipment-label-private {
  display: grid;
  justify-items: start;
  gap: 8px;
  border: 1px solid #d9e2ec;
  padding: 14px;
  background: #f7f9fb;
}

.mi-procurement-page .misumi-detail-tabs {
  width: calc(100% - 293px);
  margin-top: 10px;
  border-top: 3px solid var(--mi-navy);
  background: #fff;
}

.mi-procurement-page .misumi-detail-tabs a:first-child {
  border-bottom-color: var(--mi-navy);
  color: var(--mi-navy);
}

.mi-detail-information {
  grid-template-columns: minmax(0, 1fr);
  width: calc(100% - 293px);
  margin-top: 0;
  border-top: 0;
}

.mi-detail-information .misumi-buy-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  position: static;
}

.mi-detail-information .misumi-series-overview {
  grid-template-columns: minmax(220px, 0.8fr) minmax(360px, 1.2fr);
}

.mi-detail-information .misumi-series-overview > div:first-child {
  padding: 12px;
}

.mi-detail-information .misumi-series-overview p {
  color: #666;
  font-size: 11px;
  line-height: 1.7;
}

.mi-compare-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #d5d5d5;
  border-top: 3px solid var(--mi-navy);
  padding: 14px 18px;
  background: #fff;
}

.mi-compare-heading h1 {
  margin: 3px 0;
  font-size: 20px;
}

.mi-compare-heading p,
.mi-compare-heading span,
.mi-compare-heading small {
  margin: 0;
  color: #777;
  font-size: 10px;
}

.mi-compare-heading > div:last-child {
  display: grid;
  text-align: right;
}

.mi-compare-heading > div:last-child strong {
  color: var(--mi-navy);
  font-size: 22px;
}

.mi-compare-table-wrap {
  overflow-x: auto;
  margin-top: 10px;
  border: 1px solid #d5d5d5;
  background: #fff;
}

.mi-compare-table {
  width: calc(112px + var(--compare-count) * 220px);
  min-width: calc(112px + var(--compare-count) * 220px);
  border-collapse: collapse;
  table-layout: fixed;
}

.mi-compare-table th,
.mi-compare-table td {
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 9px;
  font-size: 10px;
  text-align: left;
  vertical-align: top;
}

.mi-compare-table tr > :first-child {
  width: 112px;
  background: #f1f5f9;
  font-weight: 800;
}

.mi-compare-table thead th:not(:first-child) {
  width: 220px;
  background: #fff;
}

.mi-compare-product {
  display: grid;
  gap: 4px;
}

.mi-compare-product [data-cad-viewer] {
  position: relative;
  height: 120px;
  overflow: hidden;
}

.mi-compare-product canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.mi-compare-product span,
.mi-compare-product small {
  color: #777;
  font-size: 9px;
}

.mi-compare-product strong {
  color: var(--mi-navy);
  font-size: 11px;
}

.mi-compare-table thead form button {
  width: 100%;
  margin-top: 7px;
  border: 1px solid #ccc;
  padding: 6px;
  background: #fff;
  color: #666;
  font-size: 10px;
}

.mi-compare-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 10px;
}

.mi-compare-empty {
  margin-top: 10px;
  border: 1px solid #d5d5d5;
  padding: 48px 20px;
  background: #fff;
  text-align: center;
}

.mi-shop-footer {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px;
  min-height: 74px;
  padding: 0 max(40px, calc((100vw - 1200px) / 2));
  background: #3e4144;
  color: #fff;
  font-size: 11px;
}

.mi-shop-footer span {
  color: #ccc;
}

.mi-shop-footer nav {
  display: flex;
  gap: 14px;
}

.mi-shop-footer a {
  color: #fff;
}

@media (max-width: 1240px) {
  .mi-utility-bar,
  .mi-masthead,
  .mi-primary-catalog-nav {
    padding-right: 16px;
    padding-left: 16px;
  }

  .mi-procurement-page main {
    width: min(calc(100% - 32px), 1200px);
  }

  .mi-masthead {
    grid-template-columns: 230px minmax(300px, 1fr) 118px 96px;
  }

  .mi-wordmark {
    grid-template-columns: 38px auto;
  }

  .mi-wordmark strong {
    font-size: 21px;
  }

  .mi-product-stage {
    grid-template-columns: minmax(270px, 0.78fr) minmax(330px, 1.22fr);
    padding-right: 278px;
  }

  .mi-side-configurator {
    width: 260px;
  }
}

@media (max-width: 980px) {
  .mi-utility-bar nav a:nth-child(-n + 3) {
    display: none;
  }

  .mi-masthead {
    grid-template-columns: 210px minmax(0, 1fr) 118px;
  }

  .mi-header-cart {
    display: none;
  }

  .mi-quick-rail {
    display: none;
  }

  .mi-product-stage {
    position: static;
    grid-template-columns: minmax(270px, 0.8fr) minmax(320px, 1.2fr);
    padding: 10px;
  }

  .mi-side-configurator {
    position: static;
    grid-column: 1 / -1;
    width: auto;
  }

  .mi-procurement-page .misumi-detail-tabs,
  .mi-detail-information {
    width: 100%;
  }

  .mi-related-preview {
    display: none;
  }

  .mi-detail-information {
    grid-template-columns: 1fr;
  }

  .mi-detail-information .misumi-buy-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .mi-utility-bar {
    padding: 0 10px;
  }

  .mi-utility-bar nav {
    display: none;
  }

  .mi-account-summary {
    width: 100%;
    justify-content: flex-start;
  }

  .mi-account-summary > span:first-child {
    display: none;
  }

  .mi-account-entry small {
    max-width: 180px;
  }

  .mi-masthead {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 10px;
  }

  .mi-wordmark {
    grid-column: 1 / -1;
  }

  .mi-search-stack {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .mi-bulk-order,
  .mi-header-cart {
    display: grid;
    grid-row: 3;
  }

  .mi-primary-catalog-nav {
    padding: 0;
  }

  .mi-procurement-page main {
    width: min(calc(100% - 16px), 680px);
    padding-top: 6px;
  }

  .mi-visual-filter {
    grid-template-columns: 78px minmax(0, 1fr);
  }

  .gb-screw-classification-head {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  .gb-screw-classification-head p {
    display: none;
  }

  .gb-screw-classification-grid {
    grid-template-columns: repeat(11, 142px);
  }

  .vacuum-oring-classification .gb-screw-classification-grid {
    grid-template-columns: repeat(3, 210px);
  }

  .bearing-classification .gb-screw-classification-grid {
    grid-template-columns: repeat(10, 176px);
  }

  .equipment-label-classification .gb-screw-classification-grid {
    grid-template-columns: repeat(8, 210px);
  }

  .mi-shape-filter-grid {
    grid-template-columns: repeat(6, 100px);
  }

  .mi-procurement-page .misumi-catalog-shell,
  .mi-procurement-page .misumi-procurement-sidebar {
    grid-template-columns: 1fr;
  }

  .mi-procurement-page .misumi-procurement-sidebar > section {
    border-right: 0;
    border-bottom: 1px solid #ddd;
  }

  .mi-product-stage {
    grid-template-columns: 1fr;
  }

  .mi-product-media .misumi-detail-viewer {
    min-height: 300px;
    max-height: 380px;
  }

  .mi-related-preview {
    display: block;
  }

  .mi-side-configurator {
    grid-column: auto;
    border-top: 1px solid #b9c9df;
    border-left: 0;
  }

  .mi-side-configurator .misumi-parameter-grid {
    max-height: none;
  }

  .equipment-label-issue-panel,
  .equipment-label-template-ref,
  .equipment-label-history {
    grid-template-columns: 1fr;
  }

  .equipment-label-issue-panel form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mi-price-callout {
    grid-template-columns: 1fr auto;
  }

  .mi-price-callout small {
    grid-column: 1 / -1;
  }

  .mi-detail-information .misumi-series-overview,
  .mi-detail-information .misumi-buy-panel {
    grid-template-columns: 1fr;
  }

  .mi-shop-footer {
    grid-template-columns: 1fr;
    gap: 5px;
    padding: 16px;
  }
}

@media (max-width: 620px) {
  .equipment-label-issue-panel form,
  .equipment-label-template-ref dl,
  .equipment-label-record-grid {
    grid-template-columns: 1fr;
  }

  .equipment-label-issue-panel form > .button,
  .equipment-label-issue-panel form > small {
    grid-column: auto;
  }

  .equipment-label-resolver-head {
    display: grid;
  }

  .equipment-label-status {
    width: 100%;
  }
}

/* Gearhub industrial platform theme: shared MISUMI-inspired visual language. */
body.platform-industrial-theme {
  color-scheme: light;
  --bg: #f1f1f1;
  --panel: #ffffff;
  --panel-strong: #f4f5f6;
  --text: #252525;
  --muted: #6d6d6d;
  --line: #d4d4d4;
  --accent: #2f7d4f;
  --accent-2: #123b8d;
  --warning: #a86c00;
  --danger: #bd2f26;
  --shadow: none;
  --glow: none;
  --topbar-bg: #65696d;
  --control-bg: #ffffff;
  --field-bg: #ffffff;
  margin: 0;
  background: #f1f1f1;
  color: #252525;
  font-family: Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
}

body.platform-industrial-theme.operations-center-page {
  --ops-canvas: #f1f1f1;
  --ops-surface: #ffffff;
  --ops-surface-muted: #f3f4f5;
  --ops-text: #252525;
  --ops-muted: #6d6d6d;
  --ops-line: #d4d4d4;
  --ops-blue: #123b8d;
  --ops-green: #2f7d4f;
  --ops-amber: #a86c00;
  --ops-red: #bd2f26;
}

body.platform-industrial-theme.engineering-integrated-page {
  --engx-canvas: #f1f1f1;
  --engx-surface: #ffffff;
  --engx-surface-muted: #f3f4f5;
  --engx-sidebar: #edf2f8;
  --engx-text: #252525;
  --engx-muted: #6d6d6d;
  --engx-line: #d4d4d4;
  --engx-blue: #123b8d;
  --engx-green: #2f7d4f;
  --engx-amber: #a86c00;
  --engx-red: #bd2f26;
}

body.platform-industrial-theme.pdm-pm-page {
  --pm-bg: #ffffff;
  --pm-sidebar: #edf2f8;
  --pm-subtle: #f3f4f5;
  --pm-hover: #e7eef8;
  --pm-text: #252525;
  --pm-muted: #6d6d6d;
  --pm-faint: #999999;
  --pm-line: #d4d4d4;
  --pm-blue: #123b8d;
  --pm-blue-soft: #e6edf8;
  --pm-green: #2f7d4f;
  --pm-green-soft: #e7f1eb;
  --pm-orange: #a86c00;
  --pm-orange-soft: #f7eed8;
  --pm-red: #bd2f26;
  --pm-red-soft: #f7e6e4;
}

.platform-industrial-utility {
  min-height: 29px;
  border-bottom: 1px solid #777b7e;
  background: #56595c;
  color: #ffffff;
  font-size: 11px;
}

.platform-utility-inner {
  display: flex;
  width: min(100%, 1440px);
  min-height: 29px;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  margin: 0 auto;
  padding: 0 18px;
}

.platform-utility-account,
.platform-industrial-utility nav,
.platform-procurement-shortcuts {
  display: flex;
  align-items: center;
}

.platform-utility-account,
.platform-industrial-utility nav {
  gap: 0;
}

.platform-utility-account > *,
.platform-industrial-utility nav a {
  min-height: 14px;
  border-right: 1px solid #85888a;
  padding: 0 10px;
  line-height: 14px;
  white-space: nowrap;
}

.platform-utility-account > :first-child {
  padding-left: 0;
}

.platform-utility-account a:first-of-type {
  color: #ffe064;
  font-weight: 700;
}

.platform-industrial-utility nav a:last-child,
.platform-utility-account > :last-child {
  border-right: 0;
}

.platform-industrial-utility a:hover {
  color: #ffe064;
  text-decoration: underline;
}

.platform-industrial-header {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  min-height: 66px;
  align-items: center;
  flex-direction: row;
  gap: 18px;
  border: 0;
  padding: 0 max(18px, calc((100vw - 1440px) / 2));
  background: #65696d;
  box-shadow: 0 2px 5px rgb(0 0 0 / 18%);
  backdrop-filter: none;
}

body.platform-industrial-theme header.platform-industrial-header {
  border-color: #777b7e;
  background: #65696d;
}

.platform-industrial-header .brand {
  min-width: max-content;
  gap: 9px;
  color: #ffffff;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: 0;
}

.platform-industrial-header .brand-mark {
  width: 35px;
  height: 35px;
  border: 0;
  border-radius: 1px;
  background: #f3c52b;
  box-shadow: none;
  color: #123b8d;
  font-family: Arial, sans-serif;
  font-size: 19px;
  font-weight: 900;
}

.platform-industrial-header .header-actions {
  display: flex;
  width: auto;
  min-width: 0;
  flex: 1 1 auto;
  align-items: center;
  justify-content: flex-end;
  flex-direction: row;
  gap: 6px;
}

.platform-industrial-header .topnav {
  width: auto;
  max-width: none;
  min-height: 36px;
  flex: 0 1 auto;
  gap: 0;
  border: 1px solid #7e8285;
  border-radius: 0;
  padding: 0;
  background: #45484b;
}

.platform-industrial-header .topnav a {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  border-right: 1px solid #777a7d;
  border-radius: 0;
  padding: 0 13px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
}

.platform-industrial-header .topnav a:last-child {
  border-right: 0;
}

.platform-industrial-header .topnav a:hover {
  background: #54585b;
  color: #ffffff;
}

.platform-industrial-header .topnav a.is-active {
  background: #f3c52b;
  box-shadow: none;
  color: #332900;
}

.platform-procurement-shortcuts {
  min-width: max-content;
  gap: 5px;
}

.platform-procurement-shortcuts a {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  padding: 0 11px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.platform-bulk-link {
  border-color: #7190c5 !important;
  background: #123b8d;
  color: #ffffff;
}

.platform-cart-link {
  border-color: #e4b91c !important;
  background: #f3c52b;
  color: #332900;
}

.platform-industrial-header .auth-status,
.platform-industrial-header .language-switch,
.platform-industrial-header .auth-button,
.platform-industrial-header .icon-button {
  min-height: 36px;
  border: 1px solid #85898c;
  border-radius: 0;
  background: #5b5f62;
  box-shadow: none;
  color: #ffffff;
  font-size: 11px;
}

.platform-industrial-header .auth-status {
  padding: 0 9px;
}

.platform-industrial-header .language-switch {
  gap: 5px;
  padding: 2px 3px 2px 8px;
}

.platform-industrial-header .language-switch select {
  width: 68px;
  min-height: 28px;
  flex-basis: 68px;
  border: 0;
  border-radius: 0;
  padding: 0 5px;
  background: #ffffff;
  color: #252525;
}

.platform-industrial-header .auth-button {
  min-width: 58px;
  padding: 0 9px;
}

.platform-industrial-header .icon-button {
  width: 36px;
}

.platform-industrial-header :is(.auth-button, .icon-button, .language-switch):hover {
  border-color: #f3c52b;
  box-shadow: none;
  transform: none;
}

.platform-industrial-theme > main,
.platform-industrial-theme .plm-app-shell {
  width: min(1440px, calc(100% - 32px));
  padding-top: 10px;
}

.platform-industrial-theme .platform-command-bar {
  grid-template-columns: minmax(140px, 0.7fr) minmax(360px, 2fr) minmax(280px, 1.2fr);
  min-height: 42px;
  gap: 12px;
  margin-bottom: 10px;
  border: 1px solid #d4d4d4;
  border-top: 3px solid #123b8d;
  padding: 5px 10px;
  background: #ffffff;
}

.platform-industrial-theme .platform-context strong {
  color: #123b8d;
}

.platform-industrial-theme :is(.platform-service, .platform-environment, .platform-readiness) {
  min-height: 24px;
  border-radius: 2px;
  background: #f5f5f5;
}

.platform-industrial-theme :is(.button, .small-button, .auth-button, .icon-button, .object-actions button) {
  min-height: 34px;
  border-radius: 2px;
  box-shadow: none;
  font-size: 12px;
  letter-spacing: 0;
  transform: none;
}

.platform-industrial-theme :is(.button, .small-button, .object-actions button):hover {
  border-color: #123b8d;
  box-shadow: none;
  transform: none;
}

.platform-industrial-theme .button.primary,
.platform-industrial-theme .primary {
  border-color: #123b8d;
  background: #123b8d;
  box-shadow: none;
  color: #ffffff;
}

.platform-industrial-theme .button.secondary,
.platform-industrial-theme .secondary {
  border-color: #c8c8c8;
  background: #ffffff;
  color: #252525;
}

.platform-industrial-theme :is(input, select, textarea) {
  border-radius: 2px;
}

.platform-industrial-theme :is(.toolbar, .ossd-message, .nas-folder, .nas-file) {
  border-radius: 0;
  box-shadow: none;
}

.platform-industrial-theme .page-head {
  min-height: 82px;
  align-items: center;
  margin-bottom: 10px;
  border: 1px solid #d4d4d4;
  border-top: 3px solid #123b8d;
  padding: 12px 14px;
  background: #ffffff;
}

.platform-industrial-theme .page-head h1 {
  color: #252525;
  font-size: 24px;
  line-height: 1.2;
  text-shadow: none;
}

.platform-industrial-theme :is(.eyebrow, .section-kicker) {
  margin-bottom: 5px;
  color: #123b8d;
  font-size: 10px;
  font-weight: 800;
}

.platform-industrial-theme .page-subtitle {
  margin: 5px 0 0;
  color: #6d6d6d;
  font-size: 12px;
}

.platform-industrial-theme :is(
  .metrics article,
  .side-panel,
  .content-panel,
  .detail-panel,
  .es-admin-page,
  .es-admin-card,
  .es-ops-panel,
  .nas-panel,
  .agent-column,
  .agent-panel,
  .agent-result-card,
  .agent-alt-card,
  .agent-check-grid article,
  .agent-roadmap article,
  .auth-dialog,
  .file-dialog
) {
  border-color: #d4d4d4;
  border-radius: 0;
  background: #ffffff;
  box-shadow: none;
  backdrop-filter: none;
}

.platform-industrial-theme .metrics {
  gap: 0;
  margin-bottom: 10px;
  border: 1px solid #d4d4d4;
  background: #ffffff;
}

.platform-industrial-theme .metrics article {
  min-height: 76px;
  border: 0;
  border-right: 1px solid #d4d4d4;
  padding: 12px 14px;
}

.platform-industrial-theme .metrics article:last-child {
  border-right: 0;
}

.platform-industrial-theme .metrics span {
  margin-bottom: 5px;
  color: #6d6d6d;
  font-size: 11px;
}

.platform-industrial-theme .metrics strong {
  color: #252525;
  font-size: 20px;
  text-shadow: none;
}

.platform-industrial-theme .app-shell {
  grid-template-columns: 260px minmax(0, 1fr) 300px;
  gap: 0;
  align-items: stretch;
  border: 1px solid #d4d4d4;
  background: #ffffff;
}

.platform-industrial-theme .app-shell > * {
  border: 0;
  border-right: 1px solid #d4d4d4;
}

.platform-industrial-theme .app-shell > :last-child {
  border-right: 0;
}

.platform-industrial-theme :is(.side-panel, .detail-panel) {
  background: #f3f4f5;
}

.platform-industrial-theme :is(.panel-title, .section-head) {
  border-bottom-color: #d4d4d4;
}

.platform-industrial-theme :is(.object-table, .operations-table, .pm-data-table, .bom-table, .plm-eco-table) {
  border-color: #d4d4d4;
  background: #ffffff;
}

.platform-industrial-theme :is(.object-table, .operations-table, .pm-data-table, .bom-table, .plm-eco-table) :is(th, [role="columnheader"]) {
  background: #eaf0f7;
  color: #313131;
  font-size: 11px;
}

.platform-industrial-theme :is(.object-table, .operations-table, .pm-data-table, .bom-table, .plm-eco-table) :is(th, td, [role="cell"], [role="columnheader"]) {
  border-color: #d4d4d4;
}

.platform-industrial-theme .es-admin-page {
  margin-top: 10px;
  padding: 14px;
  background: #ffffff;
}

.platform-industrial-theme :is(.es-admin-grid, .es-ops-grid) {
  gap: 8px;
}

.platform-industrial-theme .nas-shell,
.platform-industrial-theme .standard-agent-shell {
  gap: 8px;
}

.platform-industrial-theme .nas-panel,
.platform-industrial-theme .agent-panel {
  padding: 14px;
}

.platform-industrial-theme .agent-flow {
  gap: 0;
  border: 1px solid #d4d4d4;
  background: #ffffff;
}

.platform-industrial-theme .agent-column {
  border: 0;
  border-right: 1px solid #d4d4d4;
}

.platform-industrial-theme .agent-column:last-child {
  border-right: 0;
}

.platform-industrial-theme .agent-column h2,
.platform-industrial-theme .agent-panel h2 {
  color: #123b8d;
}

.platform-industrial-theme :is(
  .agent-column span,
  .agent-capability-grid span,
  .agent-output-grid article,
  .agent-result-card,
  .agent-alt-card,
  .agent-check-grid article,
  .agent-roadmap article,
  .agent-result-card dl div,
  .agent-trace-step
) {
  border-radius: 2px;
  background: #ffffff;
  box-shadow: none;
}

.platform-industrial-theme .data-layer :is(h2, span) {
  color: #2f7d4f;
}

.platform-industrial-theme .app-layer :is(h2, span) {
  color: #123b8d;
}

.platform-industrial-theme .output-layer :is(h2, span) {
  color: #9a6200;
}

.platform-industrial-theme .operations-page-head {
  min-height: 82px;
  padding: 12px 14px;
}

.platform-industrial-theme .operations-control-metrics {
  margin-bottom: 10px;
}

.platform-industrial-theme .operations-control-metrics article {
  min-height: 76px;
}

.platform-industrial-theme .operations-workspace {
  grid-template-columns: 205px minmax(0, 1fr);
}

.platform-industrial-theme .operations-sidebar {
  top: 76px;
  background: #edf2f8;
}

.platform-industrial-theme .operations-sidebar nav button.is-active {
  border-left-color: #123b8d;
  background: #dfe8f5;
  color: #123b8d;
}

.platform-industrial-theme .operations-section {
  padding: 18px;
}

.platform-industrial-theme .operations-search-section {
  background: #f3f4f5;
}

.platform-industrial-theme .operations-service-state {
  border-radius: 2px;
}

.platform-industrial-theme .engx-commandbar {
  min-height: 62px;
  border-top: 3px solid #123b8d;
  padding: 8px 12px;
}

.platform-industrial-theme .engx-command-icon,
.platform-industrial-theme .plm-app-icon,
.platform-industrial-theme .pm-workspace-switcher > span {
  border-radius: 1px;
  background: #123b8d;
}

.platform-industrial-theme .engx-module-strip {
  min-height: 40px;
}

.platform-industrial-theme .engx-module-strip :is(button, a) {
  min-height: 39px;
}

.platform-industrial-theme .engx-module-strip button.is-active {
  border-bottom-color: #f3c52b;
  background: #ffffff;
  box-shadow: inset 0 -3px 0 #f3c52b;
  color: #123b8d;
}

.platform-industrial-theme .engx-lifecycle-metrics {
  margin: 8px 0;
}

.platform-industrial-theme .engx-lifecycle-metrics button {
  min-height: 68px;
}

.platform-industrial-theme .engx-sidebar,
.platform-industrial-theme .engx-context {
  background: #edf2f8;
}

.platform-industrial-theme .engx-project-item,
.platform-industrial-theme .engx-sidebar-section button,
.platform-industrial-theme .engx-eco-card,
.platform-industrial-theme .engx-selection-card,
.platform-industrial-theme .engx-ai-support-grid > section {
  border-radius: 0;
  box-shadow: none;
}

.platform-industrial-theme .engx-project-item.is-active,
.platform-industrial-theme .engx-sidebar-section button.is-active {
  border-color: #b8c9e1;
  background: #dfe8f5;
  color: #123b8d;
}

.platform-industrial-theme .plm-module-bar {
  min-height: 50px;
  margin-bottom: 8px;
  border: 1px solid #d4d4d4;
  border-top: 3px solid #123b8d;
  padding: 6px 10px;
  background: #ffffff;
}

.platform-industrial-theme .plm-subnav a {
  min-height: 32px;
  padding: 7px 10px 6px;
}

.platform-industrial-theme .plm-subnav a.active {
  border-bottom-color: #f3c52b;
  box-shadow: inset 0 -2px 0 #f3c52b;
  color: #123b8d;
}

.platform-industrial-theme .plm-workbench-toolbar {
  min-height: 58px;
  border-top: 3px solid #123b8d;
}

.platform-industrial-theme .plm-smartbar > button.active {
  background: #e6edf8;
  box-shadow: inset 0 -3px 0 #f3c52b;
  color: #123b8d;
}

.platform-industrial-theme :is(
  .plm-workbench-nav,
  .plm-findit-panel,
  .plm-linked-projects,
  .plm-eco-card,
  .plm-eco-dialog,
  .plm-view-switch,
  .plm-cad-search input,
  .plm-cad-filters select,
  .plm-workbench-search input
) {
  border-radius: 0;
  box-shadow: none;
}

.platform-industrial-theme .plm-workbench-nav {
  background: #edf2f8;
}

.platform-industrial-theme .plm-workbench-nav button.active {
  border-left: 3px solid #123b8d;
  border-radius: 0;
  background: #dfe8f5;
  color: #123b8d;
}

.platform-industrial-theme .plm-eco-column {
  background: #f3f4f5;
}

.platform-industrial-theme .plm-eco-card {
  background: #ffffff;
}

.platform-industrial-theme .plm-cad-preview-toolbar {
  background: #eaf0f7;
}

.platform-industrial-theme .pm-layout {
  min-height: calc(100vh - 137px);
  border: 1px solid #d4d4d4;
  border-radius: 0;
}

.platform-industrial-theme .pm-sidebar {
  top: 76px;
  height: calc(100vh - 76px);
  background: #edf2f8;
}

.platform-industrial-theme .pm-create-button {
  border-color: #123b8d;
  border-radius: 2px;
  background: #123b8d;
  color: #ffffff;
}

.platform-industrial-theme .pm-primary-nav button,
.platform-industrial-theme .pm-sidebar-project,
.platform-industrial-theme .pm-button,
.platform-industrial-theme .pm-section-heading button,
.platform-industrial-theme .pm-view-toolbar button,
.platform-industrial-theme .pm-add-block button {
  border-radius: 2px;
}

.platform-industrial-theme .pm-primary-nav button.active,
.platform-industrial-theme .pm-sidebar-project.active {
  border-left: 3px solid #123b8d;
  background: #dfe8f5;
  color: #123b8d;
}

.platform-industrial-theme .pm-main-toolbar {
  top: 76px;
  min-height: 46px;
  background: #ffffff;
  backdrop-filter: none;
}

.platform-industrial-theme .pm-page {
  padding-top: 24px;
}

.platform-industrial-theme .pm-page-heading {
  margin-bottom: 18px;
}

.platform-industrial-theme .pm-page-heading h1 {
  font-size: 22px;
}

.platform-industrial-theme .pm-metrics-band {
  margin-bottom: 20px;
  background: #f7f7f7;
}

.platform-industrial-theme :is(.pm-dialog, .pm-peek, .pm-search-results, .pm-toast, .pm-doc-block, .pm-board-v2 > section) {
  border-radius: 0;
  box-shadow: none;
}

.platform-industrial-theme .pm-data-table th {
  background: #eaf0f7;
}

@media (max-width: 1180px) {
  .platform-industrial-header {
    align-items: stretch;
    flex-direction: column;
    gap: 7px;
    padding: 8px 16px;
  }

  .platform-industrial-header .header-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .platform-industrial-header .topnav {
    flex: 1 1 auto;
  }

  .platform-industrial-theme .platform-command-bar {
    grid-template-columns: minmax(140px, 0.7fr) minmax(320px, 2fr);
  }

  .platform-industrial-theme .platform-operations {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }

  .platform-industrial-theme .app-shell {
    grid-template-columns: 230px minmax(0, 1fr);
  }

  .platform-industrial-theme .app-shell .detail-panel {
    grid-column: 1 / -1;
    border-top: 1px solid #d4d4d4;
  }
}

@media (max-width: 820px) {
  .platform-utility-inner {
    padding-inline: 10px;
  }

  .platform-industrial-utility nav a:nth-child(-n + 3) {
    display: none;
  }

  .platform-industrial-header {
    position: relative;
    padding-inline: 10px;
  }

  .platform-industrial-header .header-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
  }

  .platform-industrial-header .topnav,
  .platform-procurement-shortcuts {
    width: 100%;
    grid-column: 1 / -1;
  }

  .platform-industrial-header .topnav {
    order: 1;
  }

  .platform-procurement-shortcuts {
    order: 2;
  }

  .platform-industrial-header .auth-status {
    display: none;
  }

  .platform-industrial-header .language-switch {
    order: 3;
  }

  .platform-industrial-header .auth-button {
    order: 4;
  }

  .platform-industrial-header .icon-button {
    order: 5;
  }

  .platform-procurement-shortcuts a {
    flex: 1 1 0;
  }

  .platform-industrial-theme > main,
  .platform-industrial-theme .plm-app-shell {
    width: min(100% - 16px, 800px);
    padding-top: 8px;
  }

  .platform-industrial-theme .platform-command-bar {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .platform-industrial-theme .platform-operations {
    grid-column: auto;
    overflow-x: auto;
  }

  .platform-industrial-theme .page-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .platform-industrial-theme .page-actions {
    width: 100%;
    overflow-x: auto;
  }

  .platform-industrial-theme .metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .platform-industrial-theme .metrics article {
    border-right: 1px solid #d4d4d4;
    border-bottom: 1px solid #d4d4d4;
  }

  .platform-industrial-theme .app-shell {
    grid-template-columns: 1fr;
  }

  .platform-industrial-theme .app-shell > * {
    border-right: 0;
    border-bottom: 1px solid #d4d4d4;
  }

  .platform-industrial-theme .operations-workspace {
    grid-template-columns: 1fr;
  }

  .platform-industrial-theme .app-shell,
  .platform-industrial-theme .engx-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .platform-industrial-theme .app-shell .detail-panel,
  .platform-industrial-theme .engx-context {
    grid-column: auto;
  }

  .platform-industrial-theme .engx-sidebar,
  .platform-industrial-theme .engx-context {
    border-right: 0;
    border-left: 0;
  }

  .platform-industrial-theme .operations-sidebar {
    position: static;
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid #d4d4d4;
  }

  .platform-industrial-theme .operations-sidebar nav {
    grid-template-columns: repeat(4, minmax(130px, 1fr));
    overflow-x: auto;
  }

  .platform-industrial-theme .operations-sidebar-meta {
    display: none;
  }

  .platform-industrial-theme .agent-flow {
    display: grid;
    grid-template-columns: 1fr;
  }

  .platform-industrial-theme .agent-column {
    border-right: 0;
    border-bottom: 1px solid #d4d4d4;
  }

  .platform-industrial-theme .pm-sidebar,
  .platform-industrial-theme .pm-main-toolbar {
    position: static;
    height: auto;
  }
}

@media (max-width: 520px) {
  .platform-utility-account > span,
  .platform-utility-account > :last-child,
  .platform-industrial-header .language-switch > span {
    display: none;
  }

  .platform-industrial-header .brand {
    font-size: 15px;
  }

  .platform-industrial-header .topnav a {
    flex: 1 1 0;
    justify-content: center;
    padding-inline: 7px;
    font-size: 11px;
  }

  .platform-industrial-header .language-switch {
    padding-left: 3px;
  }

  .platform-industrial-theme .page-head h1 {
    font-size: 20px;
  }

  .platform-industrial-theme .operations-control-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .platform-industrial-theme .operations-control-metrics article:nth-child(2n) {
    border-right: 0;
  }
}

/* Simplified enterprise UI: one hierarchy, fewer chrome layers, calmer density. */
body.platform-industrial-theme {
  --line: #d9dde2;
  --panel-strong: #f5f6f7;
  background: #f3f4f5;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  font-size: 14px;
}

.platform-industrial-utility {
  min-height: 26px;
  border-bottom-color: #6e7275;
  font-size: 10px;
}

.platform-utility-inner {
  min-height: 26px;
}

.platform-utility-account > *,
.platform-industrial-utility nav a {
  padding-inline: 9px;
}

body.platform-industrial-theme header.platform-industrial-header {
  min-height: 56px;
  align-items: center;
  flex-direction: row;
  gap: 14px;
  padding-block: 0;
  background: #62666a;
  box-shadow: 0 1px 3px rgb(0 0 0 / 16%);
}

.platform-industrial-header .brand {
  font-size: 16px;
}

.platform-industrial-header .brand-mark {
  width: 32px;
  height: 32px;
  font-size: 17px;
}

.platform-industrial-header .header-actions {
  width: auto;
  flex: 1 1 auto;
  justify-content: flex-end;
  flex-direction: row;
  gap: 7px;
}

.platform-industrial-header .topnav {
  width: auto;
  min-height: 34px;
  flex: 0 1 auto;
  border: 0;
  background: #484b4e;
}

.platform-industrial-header .topnav a {
  min-height: 34px;
  padding-inline: 15px;
  font-size: 12px;
}

.platform-industrial-header :is(.auth-status, .icon-button, .platform-procurement-shortcuts),
.platform-industrial-theme .platform-command-bar,
.platform-industrial-header .language-switch > span {
  display: none;
}

.platform-industrial-header .language-switch {
  min-height: 34px;
  border-color: #7c8083;
  padding: 2px;
  background: #55595c;
}

.platform-industrial-header .language-switch select {
  width: 66px;
  min-height: 28px;
  flex-basis: 66px;
}

.platform-industrial-header .auth-button {
  min-width: 56px;
  min-height: 34px;
}

.platform-industrial-theme > main,
.platform-industrial-theme .plm-app-shell,
.operations-center-page main,
.engineering-integrated-page main {
  width: min(1360px, calc(100% - 28px));
  padding-top: 12px;
}

.platform-industrial-theme .page-head {
  min-height: 70px;
  margin-bottom: 8px;
  border: 1px solid #d9dde2;
  border-top: 2px solid #123b8d;
  border-radius: 2px;
  padding: 11px 13px;
}

.platform-industrial-theme .page-head h1 {
  font-size: 21px;
  font-weight: 700;
}

.platform-industrial-theme :is(.eyebrow, .section-kicker) {
  margin-bottom: 3px;
  font-size: 9px;
}

.platform-industrial-theme .page-subtitle {
  margin-top: 3px;
  font-size: 11px;
  line-height: 1.45;
}

.platform-industrial-theme :is(.button, .small-button, .object-actions button) {
  min-height: 32px;
  border-radius: 3px;
  padding-inline: 12px;
  font-size: 11px;
  font-weight: 650;
}

.platform-industrial-theme :is(input, select, textarea) {
  border-color: #cfd4da;
  border-radius: 3px;
  background: #ffffff;
}

.platform-industrial-theme :is(input, select, textarea):focus {
  border-color: #3861a2;
  box-shadow: 0 0 0 2px rgb(18 59 141 / 10%);
  outline: none;
}

.platform-industrial-theme :is(
  .metrics,
  .app-shell,
  .es-admin-page,
  .nas-panel,
  .agent-flow,
  .agent-panel,
  .operations-control-metrics,
  .operations-workspace,
  .engx-commandbar,
  .engx-shell,
  .plm-module-bar,
  .plm-workbench-toolbar,
  .plm-smartbar,
  .plm-workbench,
  .pm-layout
) {
  border-color: #d9dde2;
  border-radius: 2px;
  box-shadow: none;
}

.platform-industrial-theme .metrics,
.platform-industrial-theme .operations-control-metrics {
  margin-bottom: 8px;
}

.platform-industrial-theme .metrics article,
.platform-industrial-theme .operations-control-metrics article {
  min-height: 68px;
  padding: 10px 13px;
}

.platform-industrial-theme :is(.metrics, .operations-control-metrics) strong {
  font-size: 19px;
  font-weight: 700;
}

.platform-industrial-theme :is(.metrics, .operations-control-metrics) :is(span, small) {
  font-size: 10px;
}

.platform-industrial-theme .toolbar {
  gap: 8px;
  margin-bottom: 9px;
  border-radius: 2px;
  padding: 8px;
  background: #f7f8f9;
}

.platform-industrial-theme .ossd-message {
  margin-bottom: 9px;
  padding: 6px 8px;
  font-size: 11px;
}

.platform-industrial-theme .app-shell {
  grid-template-columns: 238px minmax(0, 1fr) 280px;
}

.platform-industrial-theme :is(.side-panel, .content-panel, .detail-panel) {
  padding: 13px;
}

.platform-industrial-theme :is(.panel-block, .nas-panel, .agent-panel) h2 {
  font-size: 15px;
}

.platform-industrial-theme :is(.object-row, .operations-table th, .operations-table td, .pm-data-table th, .pm-data-table td, .bom-table th, .bom-table td) {
  padding-top: 9px;
  padding-bottom: 9px;
}

.platform-industrial-theme :is(.object-head, .operations-table th, .pm-data-table th, .bom-table th, .plm-eco-table th) {
  background: #edf1f5;
  color: #374151;
  font-size: 10px;
  font-weight: 700;
}

.platform-industrial-theme .operations-page-head {
  min-height: 70px;
}

.platform-industrial-theme .operations-workspace {
  grid-template-columns: 190px minmax(0, 1fr);
}

.platform-industrial-theme .operations-sidebar {
  top: 62px;
  background: #f0f3f7;
}

.platform-industrial-theme .operations-sidebar-title {
  padding: 14px 13px;
}

.platform-industrial-theme .operations-sidebar nav {
  padding: 7px;
}

.platform-industrial-theme .operations-sidebar nav button {
  min-height: 34px;
  font-size: 12px;
}

.platform-industrial-theme .operations-section {
  padding: 16px;
}

.platform-industrial-theme .operations-section-head {
  margin-bottom: 12px;
}

.platform-industrial-theme .operations-service-card header {
  min-height: 64px;
  padding: 10px 12px;
}

.platform-industrial-theme .operations-service-card dl div,
.platform-industrial-theme .operations-card-actions {
  padding-inline: 12px;
}

.platform-industrial-theme .engx-commandbar {
  min-height: 56px;
  border-top-width: 2px;
}

.platform-industrial-theme .engx-module-strip,
.platform-industrial-theme .engx-module-strip :is(button, a) {
  min-height: 36px;
}

.platform-industrial-theme .engx-module-strip :is(button, a) {
  padding-inline: 13px;
  font-size: 11px;
}

.platform-industrial-theme .engx-lifecycle-metrics button {
  min-height: 62px;
}

.platform-industrial-theme .engx-shell {
  grid-template-columns: 210px minmax(0, 1fr) 270px;
}

.platform-industrial-theme .engx-view,
.platform-industrial-theme .engx-context-section {
  padding: 13px;
}

.platform-industrial-theme .plm-module-bar {
  min-height: 46px;
  margin-bottom: 7px;
  border-top-width: 2px;
  gap: 14px;
  padding: 5px 9px;
}

.platform-industrial-theme .plm-subnav a {
  min-height: 30px;
  padding: 6px 9px 5px;
  font-size: 11px;
}

.platform-industrial-theme .plm-workbench-toolbar {
  min-height: 54px;
  border-top-width: 1px;
  padding: 7px 10px;
}

.platform-industrial-theme .plm-smartbar,
.platform-industrial-theme .plm-smartbar > :is(button, a) {
  min-height: 50px;
}

.platform-industrial-theme .plm-workbench {
  grid-template-columns: 180px minmax(0, 1fr) 340px;
}

.platform-industrial-theme .plm-change-space {
  padding: 12px;
}

.platform-industrial-theme .plm-eco-card {
  border-color: #d9dde2;
}

.platform-industrial-theme .pm-layout {
  min-height: 620px;
}

.platform-industrial-theme .pm-sidebar {
  top: auto;
  height: auto;
  padding: 10px 8px;
  background: #f0f3f7;
}

.platform-industrial-theme .pm-main-toolbar {
  top: auto;
  min-height: 48px;
  padding: 7px 13px;
}

.platform-industrial-theme .pm-page {
  padding: 20px clamp(16px, 2.2vw, 30px) 42px;
}

.platform-industrial-theme .pm-page-heading {
  margin-bottom: 14px;
}

.platform-industrial-theme .pm-page-heading h1 {
  font-size: 20px;
}

.platform-industrial-theme .pm-metrics-band {
  margin-bottom: 16px;
}

.platform-industrial-theme .pm-metrics-band > div {
  padding: 13px 15px;
}

.platform-industrial-theme .nas-shell,
.platform-industrial-theme .standard-agent-shell {
  gap: 7px;
}

.platform-industrial-theme .nas-panel,
.platform-industrial-theme .agent-panel {
  padding: 12px;
}

.platform-industrial-theme .agent-flow {
  margin-bottom: 8px;
}

.platform-industrial-theme .agent-column {
  gap: 7px;
  padding: 12px;
}

.platform-industrial-theme :is(.agent-column span, .agent-capability-grid span) {
  padding: 8px;
  font-size: 12px;
  font-weight: 650;
}

.platform-industrial-theme .agent-capability-grid {
  gap: 7px;
}

@media (max-width: 1180px) and (min-width: 821px) {
  body.platform-industrial-theme header.platform-industrial-header {
    align-items: center;
    flex-direction: row;
    padding: 0 14px;
  }

  .platform-industrial-header .header-actions {
    width: auto;
  }

  .platform-industrial-header .topnav a {
    padding-inline: 11px;
  }

  .platform-industrial-theme .app-shell {
    grid-template-columns: 220px minmax(0, 1fr);
  }
}

@media (max-width: 820px) {
  .platform-industrial-utility {
    display: none;
  }

  body.platform-industrial-theme header.platform-industrial-header {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 7px 10px;
    min-height: 0;
    padding: 8px 10px;
  }

  .platform-industrial-header .brand {
    grid-row: 1;
    grid-column: 1;
    min-width: 0;
    overflow: hidden;
  }

  .platform-industrial-header .brand > :last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .platform-industrial-header .header-actions {
    display: contents;
  }

  .platform-industrial-header .topnav {
    display: flex;
    width: 100%;
    grid-row: 2;
    grid-column: 1 / -1;
  }

  .platform-industrial-header .topnav a {
    min-width: 0;
    flex: 1 1 0;
    justify-content: center;
    padding-inline: 5px;
  }

  .platform-industrial-header .auth-button {
    display: inline-flex;
    grid-row: 1;
    grid-column: 3;
  }

  .platform-industrial-header .language-switch {
    display: inline-flex;
    grid-row: 1;
    grid-column: 2;
  }

  .platform-industrial-header .icon-button,
  .platform-industrial-header .auth-status,
  .platform-industrial-header .platform-procurement-shortcuts {
    display: none;
  }

  .platform-industrial-theme > main,
  .platform-industrial-theme .plm-app-shell,
  .operations-center-page main,
  .engineering-integrated-page main {
    width: min(100% - 14px, 800px);
    padding-top: 7px;
  }

  .platform-industrial-theme .page-head {
    min-height: 0;
    gap: 9px;
    padding: 10px;
  }

  .platform-industrial-theme .page-head h1 {
    font-size: 19px;
  }

  .platform-industrial-theme .operations-workspace {
    grid-template-columns: 1fr;
  }

  .platform-industrial-theme .app-shell,
  .platform-industrial-theme .engx-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .platform-industrial-theme .app-shell .detail-panel,
  .platform-industrial-theme .engx-context {
    grid-column: auto;
  }

  .platform-industrial-theme .engx-sidebar,
  .platform-industrial-theme .engx-context {
    border-right: 0;
    border-left: 0;
  }

  .platform-industrial-theme .operations-sidebar nav {
    padding: 5px;
  }

  .platform-industrial-theme .plm-module-bar {
    gap: 6px;
  }

  .platform-industrial-theme .pm-page {
    padding: 17px 12px 36px;
  }
}

/* Shared interactive 3D viewer controls */
.cad-viewer-host {
  isolation: isolate;
  overflow: hidden;
  touch-action: none;
}

.cad-viewer-host.needs-position {
  position: relative;
}

.cad-viewer-host > canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.cad-viewer-host.is-interactive > canvas {
  cursor: grab;
  outline: none;
}

.cad-viewer-host.is-interactive > canvas:focus-visible {
  box-shadow: inset 0 0 0 2px #123b8d;
}

.cad-viewer-host.is-interacting > canvas {
  cursor: grabbing;
}

.cad-viewer-controls {
  position: absolute;
  z-index: 5;
  inset: 7px;
  pointer-events: none;
}

.cad-viewer-actions,
.cad-viewer-presets {
  position: absolute;
  display: flex;
  overflow: hidden;
  border: 1px solid #c9ced4;
  border-radius: 3px;
  background: rgb(255 255 255 / 94%);
  box-shadow: 0 1px 4px rgb(0 0 0 / 12%);
  pointer-events: auto;
}

.cad-viewer-actions {
  top: 0;
  right: 0;
}

.cad-viewer-presets {
  bottom: 0;
  left: 0;
}

.cad-viewer-controls button {
  display: inline-grid;
  min-width: 28px;
  height: 28px;
  place-items: center;
  border: 0;
  border-right: 1px solid #d9dde2;
  border-radius: 0;
  padding: 0 7px;
  background: transparent;
  color: #263444;
  cursor: pointer;
  font: 700 13px/1 Arial, "Microsoft YaHei", sans-serif;
}

.cad-viewer-controls button:last-child {
  border-right: 0;
}

.cad-viewer-controls button:hover,
.cad-viewer-controls button:focus-visible {
  background: #e8edf5;
  color: #123b8d;
  outline: none;
}

.cad-viewer-controls button.is-active,
.cad-viewer-controls button[aria-pressed="true"] {
  background: #123b8d;
  color: #ffffff;
}

.cad-viewer-presets button {
  min-width: 34px;
  font-size: 10px;
}

.cad-viewer-host:fullscreen {
  position: relative !important;
  inset: auto !important;
  width: 100vw !important;
  height: 100vh !important;
  background: #eef2f5;
}

.cad-viewer-host:fullscreen .cad-viewer-controls {
  inset: 16px;
}

.cad-viewer-host:fullscreen .cad-viewer-actions,
.cad-viewer-host:fullscreen .cad-viewer-presets {
  box-shadow: 0 2px 10px rgb(0 0 0 / 18%);
}

.cad-viewer-host.is-static .cad-viewer-controls {
  display: none;
}

@media (max-width: 520px) {
  .cad-viewer-controls {
    inset: 5px;
  }

  .cad-viewer-controls button {
    min-width: 27px;
    height: 27px;
    padding-inline: 6px;
  }

  .cad-viewer-presets button {
    min-width: 32px;
  }
}

/* Commerce administration */
.commerce-admin-page {
  --cm-bg: #f3f5f7;
  --cm-surface: #ffffff;
  --cm-surface-muted: #f8fafb;
  --cm-sidebar: #eef1f4;
  --cm-text: #202b37;
  --cm-muted: #687687;
  --cm-line: #d9e0e6;
  --cm-blue: #174f9c;
  --cm-green: #237a4b;
  --cm-amber: #a96608;
  --cm-red: #b42318;
  min-width: 320px;
  background: var(--cm-bg);
  color: var(--cm-text);
}

.commerce-admin-page [hidden] {
  display: none !important;
}

.commerce-admin-page .topbar {
  border-color: #4f5964;
  background: #5d646c;
  color: #ffffff;
}

.commerce-admin-page .brand,
.commerce-admin-page .topnav a,
.commerce-admin-page .auth-status {
  color: #ffffff;
}

.commerce-admin-page .brand-mark {
  background: #f2c94c;
  color: #15345d;
}

.commerce-admin-page .auth-button {
  border-color: #7f8790;
  background: #555c64;
  color: #ffffff;
}

.commerce-admin-page main {
  width: min(calc(100% - 28px), 1600px);
  margin: 0 auto;
  padding: 14px 0 34px;
}

.commerce-admin-commandbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(190px, 0.45fr) auto;
  align-items: stretch;
  min-height: 72px;
  border: 1px solid var(--cm-line);
  background: var(--cm-surface);
}

.commerce-admin-commandbar > div {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
}

.commerce-admin-commandbar > div + div {
  border-left: 1px solid var(--cm-line);
}

.commerce-admin-commandbar span,
.commerce-admin-commandbar small {
  color: var(--cm-muted);
  font-size: 0.61rem;
}

.commerce-admin-commandbar h1 {
  margin: 2px 0 0;
  color: var(--cm-text);
  font-size: 1rem;
  letter-spacing: 0;
}

.commerce-admin-command-icon {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  background: var(--cm-blue);
  color: #ffffff !important;
  font-size: 0.58rem !important;
  font-weight: 850;
}

.commerce-admin-backend {
  display: grid !important;
  align-content: center;
  gap: 2px !important;
}

.commerce-admin-backend strong {
  color: var(--cm-text);
  font-size: 0.75rem;
}

.commerce-admin-command-actions {
  justify-content: flex-end;
}

.commerce-admin-command-actions .button {
  min-height: 34px;
  padding-inline: 11px;
  font-size: 0.64rem;
}

.commerce-admin-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin: 12px 0;
  border-top: 1px solid var(--cm-line);
  border-left: 1px solid var(--cm-line);
  background: var(--cm-surface);
}

.commerce-admin-metrics button {
  display: grid;
  min-width: 0;
  min-height: 76px;
  align-content: center;
  border: 0;
  border-right: 1px solid var(--cm-line);
  border-bottom: 1px solid var(--cm-line);
  border-radius: 0;
  padding: 9px 13px;
  background: transparent;
  color: var(--cm-text);
  text-align: left;
  box-shadow: none;
}

.commerce-admin-metrics button:hover,
.commerce-admin-metrics button.is-active {
  background: var(--cm-surface-muted);
}

.commerce-admin-metrics button.is-active {
  box-shadow: inset 0 -2px var(--cm-blue);
}

.commerce-admin-metrics span,
.commerce-admin-metrics small {
  overflow: hidden;
  color: var(--cm-muted);
  font-size: 0.58rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.commerce-admin-metrics strong {
  overflow: hidden;
  margin: 3px 0;
  color: var(--cm-text);
  font-size: 1.08rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.commerce-admin-shell {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  min-height: 680px;
  border: 1px solid var(--cm-line);
  background: var(--cm-surface);
}

.commerce-admin-sidebar {
  display: flex;
  min-width: 0;
  flex-direction: column;
  border-right: 1px solid var(--cm-line);
  background: var(--cm-sidebar);
}

.commerce-admin-sidebar-title {
  display: grid;
  gap: 2px;
  border-bottom: 1px solid var(--cm-line);
  padding: 14px;
}

.commerce-admin-sidebar-title span,
.commerce-admin-sidebar-status span,
.commerce-admin-sidebar-status small {
  color: var(--cm-muted);
  font-size: 0.56rem;
}

.commerce-admin-sidebar-title strong {
  color: var(--cm-text);
  font-size: 0.76rem;
}

.commerce-admin-sidebar nav {
  display: grid;
  padding: 8px 0;
}

.commerce-admin-sidebar nav button {
  display: grid;
  gap: 3px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0;
  padding: 10px 14px;
  background: transparent;
  color: var(--cm-text);
  text-align: left;
  box-shadow: none;
}

.commerce-admin-sidebar nav button:hover,
.commerce-admin-sidebar nav button.is-active {
  border-left-color: var(--cm-blue);
  background: color-mix(in srgb, var(--cm-blue) 8%, var(--cm-surface));
}

.commerce-admin-sidebar nav button span {
  font-size: 0.67rem;
  font-weight: 800;
}

.commerce-admin-sidebar nav button small {
  color: var(--cm-muted);
  font-size: 0.54rem;
}

.commerce-admin-sidebar-status {
  display: grid;
  gap: 3px;
  margin-top: auto;
  border-top: 1px solid var(--cm-line);
  padding: 14px;
}

.commerce-admin-sidebar-status strong {
  color: var(--cm-text);
  font-size: 0.67rem;
}

.commerce-admin-sidebar-status strong[data-tone="success"] {
  color: var(--cm-green);
}

.commerce-admin-sidebar-status strong[data-tone="warning"] {
  color: var(--cm-amber);
}

.commerce-admin-content,
.commerce-admin-panel {
  min-width: 0;
}

.commerce-admin-panel[hidden] {
  display: none;
}

.commerce-admin-panel-head {
  display: flex;
  min-height: 70px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid var(--cm-line);
  padding: 12px 16px;
}

.commerce-admin-panel-head > div > span,
.commerce-admin-panel-head > span {
  color: var(--cm-muted);
  font-size: 0.57rem;
}

.commerce-admin-panel-head h2 {
  margin: 2px 0 0;
  color: var(--cm-text);
  font-size: 0.86rem;
}

.commerce-admin-panel-head p {
  max-width: 52%;
  margin: 0;
  border-left: 3px solid var(--cm-amber);
  padding: 6px 9px;
  background: color-mix(in srgb, var(--cm-amber) 8%, var(--cm-surface));
  color: var(--cm-amber);
  font-size: 0.57rem;
}

.commerce-admin-panel-head .button {
  min-height: 32px;
  font-size: 0.6rem;
}

.commerce-admin-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.commerce-admin-worklist {
  min-width: 0;
  border-right: 1px solid var(--cm-line);
  border-bottom: 1px solid var(--cm-line);
  padding: 14px 16px;
}

.commerce-admin-worklist:nth-child(2n) {
  border-right: 0;
}

.commerce-admin-worklist > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.commerce-admin-worklist > header span {
  color: var(--cm-muted);
  font-size: 0.52rem;
}

.commerce-admin-worklist > header h3 {
  margin: 2px 0 0;
  color: var(--cm-text);
  font-size: 0.7rem;
}

.commerce-admin-worklist > header button {
  border: 0;
  background: transparent;
  color: var(--cm-blue);
  font-size: 0.55rem;
  font-weight: 750;
  box-shadow: none;
}

.commerce-admin-worklist > div {
  display: grid;
}

.commerce-admin-worklist > div > button,
.commerce-admin-worklist > div > article {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-bottom: 1px solid var(--cm-line);
  border-radius: 0;
  padding: 9px 0;
  background: transparent;
  color: var(--cm-text);
  text-align: left;
  box-shadow: none;
}

.commerce-admin-worklist > div > :last-child {
  border-bottom: 0;
}

.commerce-admin-worklist > div > button span,
.commerce-admin-worklist > div > article div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.commerce-admin-worklist strong,
.commerce-admin-worklist b {
  overflow: hidden;
  color: var(--cm-text);
  font-size: 0.61rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.commerce-admin-worklist small,
.commerce-admin-worklist article > span {
  overflow: hidden;
  color: var(--cm-muted);
  font-size: 0.52rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.commerce-admin-worklist b[data-stock="low"] {
  color: var(--cm-amber);
}

.commerce-admin-worklist b[data-stock="out"] {
  color: var(--cm-red);
}

.commerce-worklist-empty {
  min-height: 116px;
  place-content: center;
  color: var(--cm-muted);
  font-size: 0.59rem;
  text-align: center;
}

.commerce-admin-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) repeat(2, minmax(130px, 0.35fr)) auto;
  align-items: end;
  gap: 9px;
  border-bottom: 1px solid var(--cm-line);
  padding: 11px 16px;
  background: var(--cm-surface-muted);
}

.commerce-admin-toolbar label {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.commerce-admin-toolbar label > span,
.commerce-admin-toolbar > span {
  color: var(--cm-muted);
  font-size: 0.55rem;
  font-weight: 700;
}

.commerce-admin-toolbar input,
.commerce-admin-toolbar select,
.commerce-admin-table select {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--cm-line);
  border-radius: 3px;
  background: var(--cm-surface);
  color: var(--cm-text);
  font-size: 0.61rem;
}

.commerce-admin-table-wrap {
  max-width: 100%;
  overflow: auto;
}

.commerce-admin-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
  color: var(--cm-text);
}

.commerce-admin-table th,
.commerce-admin-table td {
  border-bottom: 1px solid var(--cm-line);
  padding: 9px 11px;
  font-size: 0.58rem;
  text-align: left;
  vertical-align: middle;
}

.commerce-admin-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--cm-surface-muted);
  color: var(--cm-muted);
  font-weight: 800;
  white-space: nowrap;
}

.commerce-admin-table td > strong,
.commerce-admin-table td > span {
  display: block;
}

.commerce-admin-table td > strong {
  color: var(--cm-text);
  font-size: 0.61rem;
}

.commerce-admin-table td > span {
  margin-top: 2px;
  color: var(--cm-muted);
  font-size: 0.52rem;
}

.commerce-admin-table td > button {
  min-height: 28px;
  border: 1px solid var(--cm-line);
  border-radius: 3px;
  padding: 4px 8px;
  background: var(--cm-surface);
  color: var(--cm-blue);
  font-size: 0.55rem;
  font-weight: 750;
  box-shadow: none;
}

.commerce-product-cell {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 220px;
}

.commerce-product-cell > span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  background: var(--cm-sidebar);
  color: var(--cm-blue);
  font-size: 0.53rem;
  font-weight: 850;
}

.commerce-product-cell > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.commerce-product-cell strong,
.commerce-product-cell small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.commerce-product-cell strong {
  font-size: 0.61rem;
}

.commerce-product-cell small {
  color: var(--cm-muted);
  font-size: 0.51rem;
}

.commerce-admin-table [data-stock="normal"] {
  color: var(--cm-green);
}

.commerce-admin-table [data-stock="low"] {
  color: var(--cm-amber);
}

.commerce-admin-table [data-stock="out"] {
  color: var(--cm-red);
}

.commerce-status {
  display: inline-flex !important;
  width: max-content;
  border: 1px solid var(--cm-line);
  border-radius: 3px;
  padding: 3px 6px;
  font-weight: 750;
}

.commerce-status[data-status="active"] {
  border-color: color-mix(in srgb, var(--cm-green) 35%, var(--cm-line));
  color: var(--cm-green);
}

.commerce-status[data-status="draft"] {
  color: var(--cm-amber);
}

.commerce-parts-cell {
  max-width: 360px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.commerce-integration-list {
  display: grid;
}

.commerce-integration-list > article {
  display: grid;
  grid-template-columns: 42px minmax(180px, 0.8fr) auto minmax(260px, 1fr) auto;
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid var(--cm-line);
  padding: 16px;
}

.commerce-integration-mark {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  background: #6f4bb6;
  color: #ffffff;
  font-size: 0.8rem;
  font-weight: 900;
}

.commerce-integration-list article > div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.commerce-integration-list strong {
  color: var(--cm-text);
  font-size: 0.68rem;
}

.commerce-integration-list small {
  overflow: hidden;
  color: var(--cm-muted);
  font-size: 0.53rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.commerce-integration-list article > b {
  color: var(--cm-muted);
  font-size: 0.57rem;
}

.commerce-integration-list article > b[data-state="online"] {
  color: var(--cm-green);
}

.commerce-integration-list article > b[data-state="offline"] {
  color: var(--cm-amber);
}

.commerce-integration-list dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.commerce-integration-list dl div {
  border-left: 1px solid var(--cm-line);
  padding: 2px 12px;
}

.commerce-integration-list dt,
.commerce-integration-list dd {
  margin: 0;
}

.commerce-integration-list dt {
  color: var(--cm-muted);
  font-size: 0.51rem;
}

.commerce-integration-list dd {
  margin-top: 3px;
  color: var(--cm-text);
  font-size: 0.58rem;
  font-weight: 750;
}

.commerce-integration-list .button {
  min-height: 31px;
  font-size: 0.56rem;
  white-space: nowrap;
}

.commerce-integration-list .button + .button {
  margin-left: -8px;
}

.commerce-integration-list .is-disabled {
  pointer-events: none;
  opacity: 0.5;
}

.commerce-product-dialog,
.commerce-order-dialog {
  width: min(980px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  border: 1px solid var(--cm-line);
  border-radius: 6px;
  padding: 0;
  background: var(--cm-surface);
  color: var(--cm-text);
}

.commerce-order-dialog {
  width: min(720px, calc(100vw - 28px));
  padding: 18px;
}

.commerce-product-dialog::backdrop,
.commerce-order-dialog::backdrop {
  background: rgb(10 18 28 / 58%);
}

.commerce-product-dialog > form {
  padding: 18px;
}

.commerce-product-dialog .dialog-head span,
.commerce-order-dialog .dialog-head span {
  color: var(--cm-muted);
  font-size: 0.57rem;
}

.commerce-product-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  max-height: calc(100vh - 220px);
  overflow-y: auto;
  padding: 2px;
}

.commerce-product-form-grid label {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.commerce-product-form-grid label > span {
  color: var(--cm-muted);
  font-size: 0.56rem;
  font-weight: 750;
}

.commerce-product-form-grid input,
.commerce-product-form-grid select,
.commerce-product-form-grid textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--cm-line);
  border-radius: 3px;
  background: var(--cm-surface);
  color: var(--cm-text);
}

.commerce-product-form-grid .commerce-wide-field {
  grid-column: 1 / -1;
}

.commerce-product-3d {
  display: grid;
  grid-template-columns: minmax(260px, 0.85fr) minmax(0, 1.15fr);
  gap: 18px;
  align-items: stretch;
  margin: 4px 0;
  border-block: 1px solid var(--cm-line);
  padding: 14px 0;
}

.commerce-product-3d-preview {
  align-self: start;
  width: 100%;
  height: 220px;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--cm-line);
  border-radius: 4px;
  background: #f7f9fb;
}

.commerce-product-3d-preview > [data-cad-viewer] {
  width: 100%;
  height: 100%;
  min-height: 0;
}

.commerce-product-3d-settings {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: 12px;
  min-width: 0;
}

.commerce-product-3d-settings > header {
  display: flex;
  grid-column: 1 / -1;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
  border-bottom: 1px solid var(--cm-line);
  padding-bottom: 10px;
}

.commerce-product-3d-settings > header div {
  display: grid;
  gap: 2px;
}

.commerce-product-3d-settings > header span {
  color: var(--cm-muted);
  font-size: 0.6rem;
  font-weight: 750;
  text-transform: uppercase;
}

.commerce-product-3d-settings > header strong {
  font-size: 0.95rem;
}

.commerce-product-3d-settings > header b {
  color: #137333;
  font-size: 12px;
  font-weight: 750;
  text-align: right;
}

.commerce-object-mode {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid var(--cm-line);
  border-radius: 4px;
  background: var(--cm-surface-muted);
  padding: 2px;
}

.commerce-object-mode button {
  min-height: 34px;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: var(--cm-muted);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.commerce-object-mode button.is-active {
  background: var(--cm-surface);
  color: var(--cm-blue);
  box-shadow: 0 1px 3px rgb(22 35 52 / 14%);
}

.commerce-object-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px;
  align-items: end;
  gap: 10px;
}

.commerce-object-panel[hidden] {
  display: none;
}

.commerce-object-exact-panel {
  grid-template-columns: minmax(0, 1.2fr) minmax(140px, 0.8fr);
}

.commerce-object-exact-panel .commerce-object-search {
  grid-column: 1 / -1;
}

.commerce-object-exact-panel .button {
  grid-column: 1 / -1;
  justify-self: start;
  min-height: 34px;
  font-size: 12px;
}

.commerce-object-state {
  grid-column: 1 / -1;
  border-left: 3px solid var(--cm-line-strong);
  padding: 7px 9px;
  background: var(--cm-surface-muted);
  color: var(--cm-muted);
  font-size: 11px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.commerce-object-state[data-state="ready"] {
  border-left-color: #137333;
  color: #137333;
}

.commerce-object-state[data-state="warning"] {
  border-left-color: #b3261e;
  color: #b3261e;
}

.commerce-product-form-grid .commerce-product-color input {
  min-height: 36px;
  padding: 3px;
  cursor: pointer;
}

.commerce-product-dialog form > footer {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 8px;
  border-top: 1px solid var(--cm-line);
  margin-top: 14px;
  padding-top: 12px;
}

.commerce-product-dialog form > footer > span {
  color: var(--cm-muted);
  font-size: 0.56rem;
}

.commerce-product-dialog .danger {
  border-color: color-mix(in srgb, var(--cm-red) 35%, var(--cm-line));
  color: var(--cm-red);
}

.commerce-order-dialog > footer {
  display: flex;
  justify-content: flex-end;
  border-top: 1px solid var(--cm-line);
  margin-top: 12px;
  padding-top: 12px;
}

.commerce-order-customer {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0 0 12px;
  border: 1px solid var(--cm-line);
}

.commerce-order-customer div {
  min-width: 0;
  border-right: 1px solid var(--cm-line);
  padding: 9px;
}

.commerce-order-customer div:last-child {
  border-right: 0;
}

.commerce-order-customer dt,
.commerce-order-customer dd {
  overflow: hidden;
  margin: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.commerce-order-customer dt {
  color: var(--cm-muted);
  font-size: 0.52rem;
}

.commerce-order-customer dd {
  margin-top: 3px;
  color: var(--cm-text);
  font-size: 0.59rem;
  font-weight: 750;
}

.commerce-order-dialog table {
  width: 100%;
  border-collapse: collapse;
}

.commerce-order-dialog th,
.commerce-order-dialog td {
  border-bottom: 1px solid var(--cm-line);
  padding: 8px;
  color: var(--cm-text);
  font-size: 0.57rem;
  text-align: left;
}

.commerce-order-dialog th {
  background: var(--cm-surface-muted);
  color: var(--cm-muted);
}

.commerce-order-dialog td strong,
.commerce-order-dialog td span {
  display: block;
}

.commerce-order-dialog td span {
  margin-top: 2px;
  color: var(--cm-muted);
  font-size: 0.51rem;
}

@media (max-width: 1100px) {
  .commerce-admin-metrics {
    grid-template-columns: repeat(6, 150px);
    overflow-x: auto;
  }

  .commerce-admin-dashboard-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .commerce-admin-worklist,
  .commerce-admin-worklist:nth-child(2n) {
    border-right: 0;
  }

  .commerce-integration-list > article {
    grid-template-columns: 42px minmax(160px, 1fr) auto;
  }

  .commerce-integration-list dl {
    grid-column: 2 / -1;
  }

  .commerce-integration-list .button {
    grid-column: auto;
  }
}

@media (max-width: 800px) {
  .commerce-admin-page main {
    width: min(100% - 16px, 760px);
    padding-top: 8px;
  }

  .commerce-admin-commandbar {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .commerce-admin-backend {
    grid-column: 1 / -1;
    grid-row: 2;
    border-top: 1px solid var(--cm-line);
    border-left: 0 !important;
  }

  .commerce-admin-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .commerce-admin-sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--cm-line);
  }

  .commerce-admin-sidebar nav {
    grid-template-columns: repeat(6, minmax(130px, 1fr));
    overflow-x: auto;
  }

  .commerce-admin-sidebar nav button {
    border-bottom: 2px solid transparent;
    border-left: 0;
  }

  .commerce-admin-sidebar nav button:hover,
  .commerce-admin-sidebar nav button.is-active {
    border-bottom-color: var(--cm-blue);
    border-left: 0;
  }

  .commerce-admin-sidebar-status {
    display: none;
  }

  .commerce-admin-toolbar {
    grid-template-columns: minmax(0, 1fr) minmax(120px, 0.4fr);
  }

  .commerce-product-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .commerce-admin-page .topnav {
    display: none;
  }

  .commerce-admin-commandbar {
    grid-template-columns: minmax(0, 1fr);
  }

  .commerce-admin-commandbar > div + div {
    border-top: 1px solid var(--cm-line);
    border-left: 0;
  }

  .commerce-admin-command-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
  }

  .commerce-admin-command-actions > span {
    grid-column: 1 / -1;
  }

  .commerce-admin-panel-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .commerce-admin-panel-head p {
    max-width: none;
  }

  .commerce-admin-toolbar {
    grid-template-columns: minmax(0, 1fr);
  }

  .commerce-product-form-grid,
  .commerce-order-customer {
    grid-template-columns: minmax(0, 1fr);
  }

  .commerce-product-3d {
    grid-template-columns: minmax(0, 1fr);
  }

  .commerce-product-3d-settings {
    grid-template-columns: minmax(0, 1fr);
  }

  .commerce-object-exact-panel {
    grid-template-columns: minmax(0, 1fr);
  }

  .commerce-object-exact-panel .commerce-object-search,
  .commerce-object-exact-panel .button {
    grid-column: 1;
  }

  .commerce-order-customer div {
    border-right: 0;
    border-bottom: 1px solid var(--cm-line);
  }

  .commerce-order-customer div:last-child {
    border-bottom: 0;
  }

  .commerce-product-dialog form > footer {
    grid-template-columns: 1fr 1fr;
  }

  .commerce-product-dialog form > footer > span {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .commerce-integration-list > article {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 9px;
  }

  .commerce-integration-list dl,
  .commerce-integration-list .button {
    grid-column: 1 / -1;
  }

  .commerce-integration-list .button + .button {
    margin-left: 0;
  }
}

@media (max-width: 1080px) {
  .engineering-integrated-page .engx-lifecycle-metrics {
    grid-template-columns: repeat(5, 150px);
  }
}

@media (max-width: 1280px) {
  .platform-industrial-theme .engx-shell {
    grid-template-columns: 210px minmax(0, 1fr);
  }

  .platform-industrial-theme .engx-context {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-column: 1 / -1;
    border-top: 1px solid var(--engx-line);
    border-left: 0;
  }
}

@media (max-width: 900px) {
  .platform-industrial-theme .engx-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .platform-industrial-theme .engx-context {
    grid-template-columns: minmax(0, 1fr);
    grid-column: auto;
  }

  .engineering-integrated-page .engx-root-sidebar {
    grid-template-columns: repeat(3, minmax(170px, 1fr));
  }
}

@media (max-width: 680px) {
  .engineering-integrated-page .engx-root-navigation {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }

  .engineering-integrated-page .engx-root-sidebar {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }
}

/* Role-aware Gearhub work console. */
.workspace-home-page {
  --home-blue: #123b8d;
  --home-green: #2f7d4f;
  --home-yellow: #f3c52b;
  --home-red: #bd2f26;
  --home-canvas: #f1f1f1;
  --home-surface: #ffffff;
  --home-subtle: #f4f5f6;
  --home-line: #d4d4d4;
  --home-text: #252525;
  --home-muted: #6d6d6d;
}

.workspace-home-page .workspace-home-main {
  display: block;
}

.workspace-home-page [data-required-permission][hidden],
.workspace-home-page .workspace-home-metrics[hidden],
.workspace-home-page #homeProjectPanel[hidden] {
  display: none !important;
}

.workspace-home-head {
  min-height: 96px !important;
}

.workspace-home-head .page-actions {
  align-items: center;
  flex-direction: row;
}

.workspace-decision-intake {
  display: grid;
  grid-template-columns: minmax(250px, 0.38fr) minmax(0, 1fr);
  margin-bottom: 10px;
  border: 1px solid var(--home-line);
  border-top: 4px solid var(--home-blue);
  background: var(--home-surface);
}

.workspace-decision-intake > header {
  display: grid;
  align-content: center;
  gap: 14px;
  border-right: 1px solid var(--home-line);
  padding: 16px;
}

.workspace-decision-intake > header > div {
  display: grid;
  gap: 3px;
}

.workspace-decision-intake > header span {
  color: var(--home-blue);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.workspace-decision-intake h2 {
  margin: 0;
  color: var(--home-text);
  font-size: 18px;
}

.workspace-decision-intake ol {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.workspace-decision-intake li {
  position: relative;
  min-width: 0;
  border-top: 2px solid #c7d1df;
  padding-top: 6px;
  color: var(--home-muted);
  font-size: 9px;
  text-align: center;
}

.workspace-decision-intake li:first-child {
  border-color: var(--home-blue);
  color: var(--home-blue);
  font-weight: 800;
}

.workspace-decision-intake form {
  display: grid;
  align-content: center;
  gap: 9px;
  padding: 16px;
}

.workspace-decision-intake form label {
  display: grid;
  gap: 6px;
}

.workspace-decision-intake form label > span {
  color: var(--home-text);
  font-size: 11px;
  font-weight: 750;
}

.workspace-decision-intake textarea {
  width: 100%;
  min-height: 82px;
  resize: vertical;
  border: 1px solid var(--home-line);
  border-radius: 4px;
  padding: 10px 11px;
  background: var(--home-surface);
  color: var(--home-text);
  font: inherit;
  font-size: 12px;
  line-height: 1.55;
}

.workspace-decision-intake textarea:focus {
  border-color: var(--home-blue);
  outline: 2px solid rgb(18 59 141 / 12%);
}

.workspace-decision-intake textarea[aria-invalid="true"] {
  border-color: var(--home-red);
}

.workspace-decision-intake form > div {
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.workspace-decision-intake form > div > span {
  color: var(--home-red);
  font-size: 10px;
}

.workspace-home-role {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  border-left: 3px solid var(--home-green);
  padding: 0 12px;
  background: var(--home-subtle);
  color: var(--home-text);
  font-size: 12px;
  font-weight: 700;
}

.workspace-home-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 10px;
  border: 1px solid var(--home-line);
  background: var(--home-surface);
}

.workspace-home-metrics article {
  display: grid;
  min-width: 0;
  min-height: 82px;
  align-content: center;
  gap: 3px;
  border-right: 1px solid var(--home-line);
  padding: 11px 15px;
}

.workspace-home-metrics article:last-child {
  border-right: 0;
}

.workspace-home-metrics span,
.workspace-home-metrics small {
  overflow: hidden;
  color: var(--home-muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-home-metrics strong {
  overflow: hidden;
  color: var(--home-text);
  font-size: 21px;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-home-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(290px, 340px);
  align-items: start;
  gap: 10px;
}

.workspace-home-primary,
.workspace-home-aside {
  display: grid;
  min-width: 0;
  gap: 10px;
}

.workspace-home-section,
.workspace-access-panel,
.workspace-scope-panel {
  min-width: 0;
  border: 1px solid var(--home-line);
  background: var(--home-surface);
}

.workspace-section-heading {
  display: flex;
  min-height: 55px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--home-line);
  padding: 9px 13px;
}

.workspace-section-heading > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.workspace-section-heading > div > span {
  color: var(--home-blue);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.workspace-section-heading h2 {
  margin: 0;
  color: var(--home-text);
  font-size: 15px;
  line-height: 1.25;
}

.workspace-section-heading > a,
.workspace-section-heading > span {
  color: var(--home-blue);
  font-size: 11px;
  font-weight: 700;
}

.workspace-section-heading > a:hover {
  text-decoration: underline;
}

.workspace-workflows {
  display: grid;
}

.workspace-workflow {
  display: grid;
  grid-template-columns: 48px minmax(230px, 1fr) minmax(330px, 0.9fr);
  min-height: 112px;
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid var(--home-line);
  padding: 14px;
}

.workspace-workflow:last-child {
  border-bottom: 0;
}

.workspace-workflow[hidden] {
  display: none;
}

.workspace-workflow-index {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid #b9c7de;
  background: #edf2f8;
  color: var(--home-blue);
  font-size: 13px;
  font-weight: 800;
}

.workspace-workflow[data-workflow="commerce"] .workspace-workflow-index {
  border-color: #d7be5a;
  background: #fbf5d9;
  color: #6b5500;
}

.workspace-workflow[data-workflow="operations"] .workspace-workflow-index {
  border-color: #a9c7b5;
  background: #e8f2ec;
  color: var(--home-green);
}

.workspace-workflow-copy {
  min-width: 0;
}

.workspace-workflow-copy > span {
  display: block;
  margin-bottom: 4px;
  color: var(--home-muted);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.workspace-workflow-copy h3 {
  margin: 0;
  color: var(--home-text);
  font-size: 16px;
  line-height: 1.25;
}

.workspace-workflow-copy p {
  max-width: 600px;
  margin: 6px 0 0;
  color: var(--home-muted);
  font-size: 11px;
  line-height: 1.55;
}

.workspace-workflow-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 7px;
}

.workspace-workflow-actions .button {
  width: 100%;
  min-width: 0;
  justify-content: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-inline-link {
  grid-column: 1 / -1;
  padding: 2px 4px;
  color: var(--home-blue);
  font-size: 11px;
  font-weight: 700;
}

.workspace-inline-link:hover {
  text-decoration: underline;
}

.workspace-queue {
  display: grid;
}

.workspace-queue-row {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto 24px;
  min-height: 54px;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--home-line);
  padding: 8px 12px;
  color: var(--home-text);
}

.workspace-queue-row:last-child {
  border-bottom: 0;
}

.workspace-queue-row:hover {
  background: #f5f7fa;
}

.workspace-queue-state {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--home-green);
}

.workspace-queue-row > span:nth-child(2) {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.workspace-queue-row strong,
.workspace-queue-row small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-queue-row strong {
  font-size: 12px;
}

.workspace-queue-row small {
  color: var(--home-muted);
  font-size: 10px;
}

.workspace-queue-row em {
  border: 1px solid #b8cabf;
  padding: 3px 6px;
  background: #edf5f0;
  color: var(--home-green);
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.workspace-queue-row b {
  color: var(--home-blue);
  font-size: 15px;
  text-align: right;
}

.workspace-access-list {
  margin: 0;
}

.workspace-access-list > div {
  display: grid;
  gap: 5px;
  border-bottom: 1px solid var(--home-line);
  padding: 13px;
}

.workspace-access-list > div:last-child {
  border-bottom: 0;
}

.workspace-access-list dt {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--home-text);
  font-size: 12px;
  font-weight: 800;
}

.workspace-access-list dd {
  margin: 0 0 0 16px;
  color: var(--home-muted);
  font-size: 10px;
  line-height: 1.45;
}

.workspace-access-list a,
.workspace-access-list div > span:last-child {
  margin-left: 16px;
  overflow: hidden;
  color: var(--home-blue);
  font-size: 10px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-state-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--home-red);
}

.workspace-state-dot.is-online {
  background: var(--home-green);
  box-shadow: 0 0 0 3px rgb(47 125 79 / 12%);
}

.workspace-scope-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.workspace-scope-list li {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 49px;
  border-bottom: 1px solid var(--home-line);
  padding: 8px 13px;
}

.workspace-scope-list li:last-child {
  border-bottom: 0;
}

.workspace-scope-list strong {
  color: var(--home-text);
  font-size: 11px;
}

.workspace-scope-list span {
  color: var(--home-muted);
  font-size: 10px;
  line-height: 1.4;
}

@media (max-width: 1120px) {
  .workspace-home-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .workspace-home-aside {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .workspace-decision-intake {
    grid-template-columns: minmax(0, 1fr);
  }

  .workspace-decision-intake > header {
    border-right: 0;
    border-bottom: 1px solid var(--home-line);
  }

  .workspace-home-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace-home-metrics article:nth-child(2) {
    border-right: 0;
  }

  .workspace-home-metrics article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--home-line);
  }

  .workspace-workflow {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .workspace-workflow-actions {
    grid-column: 2;
  }
}

@media (max-width: 620px) {
  .workspace-decision-intake form > div {
    align-items: stretch;
    flex-direction: column;
  }

  .workspace-decision-intake form .button {
    width: 100%;
    justify-content: center;
  }

  .workspace-home-head .page-actions {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
  }

  .workspace-home-role,
  .workspace-home-head .button {
    width: 100%;
    justify-content: center;
  }

  .workspace-home-metrics,
  .workspace-home-aside {
    grid-template-columns: minmax(0, 1fr);
  }

  .workspace-home-metrics article,
  .workspace-home-metrics article:nth-child(2) {
    border-right: 0;
    border-bottom: 1px solid var(--home-line);
  }

  .workspace-home-metrics article:last-child {
    border-bottom: 0;
  }

  .workspace-workflow {
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
  }

  .workspace-workflow-index {
    width: 34px;
    height: 28px;
  }

  .workspace-workflow-actions {
    grid-column: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .workspace-inline-link {
    grid-column: auto;
  }

  .workspace-queue-row {
    grid-template-columns: 10px minmax(0, 1fr) 20px;
  }

  .workspace-queue-row em {
    display: none;
  }
}

/* Gearhub NAS: Synology-inspired operational workspace */
.nas-dsm-page {
  --nas-blue: #1769aa;
  --nas-blue-dark: #0f4f84;
  --nas-green: #27885a;
  --nas-amber: #b56a00;
  --nas-red: #b8413b;
  --nas-text: #1e2934;
  --nas-muted: #64717f;
  --nas-line: #d6dce2;
  --nas-soft-line: #e8ebee;
  --nas-surface: #ffffff;
  --nas-soft: #f5f7f9;
  background: #edf1f4;
  color: var(--nas-text);
}

.nas-dsm-page [hidden] {
  display: none !important;
}

.nas-dsm-page .platform-command-bar {
  margin-bottom: 8px;
}

.platform-industrial-theme .nas-dsm-main {
  width: min(1520px, calc(100% - 24px));
  padding-top: 8px;
}

.nas-dsm-head {
  display: flex;
  min-height: 74px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border: 1px solid var(--nas-line);
  border-top: 3px solid var(--nas-blue);
  padding: 12px 16px;
  background: var(--nas-surface);
}

.nas-dsm-kicker,
.nas-view-heading span,
.nas-surface header span,
.nas-device-identity small,
.nas-sidebar-health span,
.nas-policy-form label > span,
.nas-dialog label > span,
.nas-dialog header span {
  color: var(--nas-muted);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0;
}

.nas-dsm-head h1 {
  margin: 2px 0 0;
  color: var(--nas-text);
  font-size: 22px;
  line-height: 1.2;
  letter-spacing: 0;
}

.nas-dsm-head p {
  margin: 4px 0 0;
  color: var(--nas-muted);
  font-size: 12px;
}

.nas-dsm-head-actions,
.nas-heading-actions,
.nas-row-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.nas-system-state {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  gap: 7px;
  border-right: 1px solid var(--nas-line);
  padding-right: 13px;
  color: var(--nas-red);
  font-size: 11px;
  font-weight: 750;
}

.nas-system-state i,
.nas-service-list i,
.nas-activity-list i {
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--nas-red);
}

.nas-system-state.is-online {
  color: var(--nas-green);
}

.nas-system-state.is-online i,
.nas-service-list .is-online i,
.nas-activity-list i {
  background: var(--nas-green);
}

.nas-dsm-shell {
  display: grid;
  grid-template-columns: 196px minmax(0, 1fr);
  min-height: 690px;
  margin-top: 8px;
  border: 1px solid var(--nas-line);
  background: var(--nas-surface);
}

.nas-dsm-sidebar {
  display: flex;
  min-width: 0;
  flex-direction: column;
  border-right: 1px solid var(--nas-line);
  background: #f7f9fa;
}

.nas-device-identity {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 70px;
  border-bottom: 1px solid var(--nas-line);
  padding: 10px 12px;
}

.nas-device-mark,
.nas-folder-mark {
  display: grid;
  place-items: center;
  border: 1px solid #9eb9d1;
  background: #eaf3fa;
  color: var(--nas-blue-dark);
  font-weight: 850;
}

.nas-device-mark {
  width: 38px;
  height: 38px;
  font-size: 12px;
}

.nas-device-identity div,
.nas-device-identity strong,
.nas-device-identity small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-device-identity strong {
  color: var(--nas-text);
  font-size: 12px;
}

.nas-device-identity small {
  margin-top: 3px;
}

.nas-dsm-navigation {
  display: grid;
  padding: 8px 0;
}

.nas-dsm-navigation button {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  min-height: 44px;
  align-items: center;
  gap: 9px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0;
  padding: 5px 12px 5px 9px;
  background: transparent;
  color: #465361;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.nas-dsm-navigation button:hover {
  background: #eef3f7;
}

.nas-dsm-navigation button.is-active {
  border-left-color: var(--nas-blue);
  background: #e4eef6;
  color: var(--nas-blue-dark);
}

.nas-dsm-navigation button span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid #c5d0da;
  background: #fff;
  color: inherit;
  font-size: 8px;
  font-weight: 850;
}

.nas-dsm-navigation button b {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sidebar-health {
  display: grid;
  gap: 3px;
  margin-top: auto;
  border-top: 1px solid var(--nas-line);
  padding: 13px;
}

.nas-sidebar-health strong {
  color: var(--nas-green);
  font-size: 20px;
}

.nas-sidebar-health small {
  color: var(--nas-muted);
  font-size: 10px;
}

.nas-dsm-workspace {
  min-width: 0;
  background: var(--nas-surface);
}

.nas-context-nav {
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: 18px;
  overflow-x: auto;
  border-bottom: 1px solid var(--nas-line);
  padding: 0 16px;
  background: #f7f9fa;
}

.nas-context-nav button {
  position: relative;
  min-height: 41px;
  flex: 0 0 auto;
  border: 0;
  padding: 0 2px;
  background: transparent;
  color: var(--nas-muted);
  font: inherit;
  font-size: 10px;
  font-weight: 750;
  cursor: pointer;
}

.nas-context-nav button.is-active {
  color: var(--nas-blue-dark);
}

.nas-context-nav button.is-active::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background: var(--nas-blue);
  content: "";
}

.nas-view {
  min-width: 0;
  animation: nas-view-in 140ms ease-out;
}

@keyframes nas-view-in {
  from { opacity: 0.6; transform: translateY(2px); }
  to { opacity: 1; transform: translateY(0); }
}

.nas-view-heading {
  display: flex;
  min-height: 62px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--nas-line);
  padding: 10px 16px;
}

.nas-view-heading h2,
.nas-surface h3,
.nas-policy-form h3,
.nas-dialog h2 {
  margin: 2px 0 0;
  color: var(--nas-text);
  letter-spacing: 0;
}

.nas-view-heading h2 {
  font-size: 18px;
}

.nas-view-heading time {
  color: var(--nas-muted);
  font-size: 10px;
}

.nas-metric-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--nas-line);
  background: #fbfcfd;
}

.nas-metric-strip article {
  display: grid;
  min-height: 82px;
  align-content: center;
  gap: 3px;
  border-right: 1px solid var(--nas-line);
  padding: 12px 16px;
}

.nas-metric-strip article:last-child {
  border-right: 0;
}

.nas-metric-strip span,
.nas-metric-strip small {
  color: var(--nas-muted);
  font-size: 10px;
}

.nas-metric-strip strong {
  color: var(--nas-text);
  font-size: 21px;
}

.nas-overview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 10px;
  background: #f3f5f7;
}

.fnos-connection-panel {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto auto;
  min-height: 64px;
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid #c9d3dc;
  padding: 10px 16px;
  background: #f7f9fb;
}

.fnos-connection-panel[hidden] {
  display: none;
}

.fnos-connection-panel > i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #d49a30;
}

.fnos-connection-panel[data-state="online"] > i {
  background: var(--nas-green);
}

.fnos-connection-panel[data-state="healthy"] > i {
  background: var(--nas-green);
}

.fnos-connection-panel[data-state="warning"] > i {
  background: var(--nas-amber);
}

.fnos-connection-panel[data-state="critical"] > i {
  background: var(--nas-red);
}

.fnos-connection-panel[data-state="error"] > i {
  background: var(--nas-red);
}

.fnos-connection-panel > div {
  display: grid;
  gap: 3px;
}

.fnos-connection-panel strong {
  color: var(--nas-text);
  font-size: 13px;
}

.fnos-connection-panel span,
.fnos-connection-panel ol {
  margin: 0;
  color: var(--nas-muted);
  font-size: 10px;
}

.fnos-connection-panel ol {
  display: flex;
  gap: 18px;
  padding-left: 18px;
}

.fnos-connection-panel ol[hidden] {
  display: none;
}

.nas-share-list > a {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  min-height: 56px;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 9px 12px;
  color: inherit;
  text-decoration: none;
}

.nas-share-list > a:hover {
  background: #f6f8fa;
}

.nas-share-list > a > span:nth-child(2) {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.nas-share-list > a > b {
  color: var(--nas-red);
  font-size: 9px;
}

.nas-share-list > a > b.is-online {
  color: var(--nas-green);
}

@media (max-width: 760px) {
  .fnos-connection-panel {
    grid-template-columns: 12px minmax(0, 1fr);
  }

  .fnos-connection-panel ol,
  .fnos-connection-panel .button {
    grid-column: 2;
  }

  .fnos-connection-panel ol {
    display: grid;
    gap: 3px;
  }
}

.nas-manage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 10px;
  background: #f3f5f7;
}

.nas-enterprise-posture {
  display: grid;
  grid-template-columns: minmax(240px, 0.8fr) minmax(520px, 1.5fr);
  align-items: stretch;
  border-bottom: 1px solid var(--nas-line);
  background: #f7f9fb;
}

.nas-enterprise-posture > div {
  display: grid;
  align-content: center;
  gap: 4px;
  border-left: 5px solid #8396a8;
  padding: 16px 18px;
}

.nas-enterprise-posture[data-state="healthy"] > div {
  border-left-color: var(--nas-green);
  background: #f2f8f5;
}

.nas-enterprise-posture[data-state="warning"] > div {
  border-left-color: var(--nas-amber);
  background: #fff9ed;
}

.nas-enterprise-posture[data-state="critical"] > div {
  border-left-color: var(--nas-red);
  background: #fff3f2;
}

.nas-enterprise-posture > div span,
.nas-enterprise-posture > div small {
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-enterprise-posture > div strong {
  color: var(--nas-text);
  font-size: 18px;
}

.nas-enterprise-posture dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}

.nas-enterprise-posture dl div {
  display: grid;
  align-content: center;
  gap: 5px;
  border-left: 1px solid var(--nas-line);
  padding: 12px 14px;
}

.nas-enterprise-posture dt,
.nas-enterprise-posture dd {
  margin: 0;
}

.nas-enterprise-posture dt {
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-enterprise-posture dd {
  overflow: hidden;
  color: var(--nas-text);
  font-size: 14px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-enterprise-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 10px 10px 0;
  background: #f3f5f7;
}

.nas-manage-grid section {
  display: grid;
  min-height: 156px;
  align-content: start;
  gap: 5px;
  border: 1px solid var(--nas-line);
  padding: 16px;
  background: #fff;
}

.nas-manage-grid section > span,
.nas-manage-grid section > small {
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-manage-grid h3 {
  margin: 0 0 14px;
  color: var(--nas-text);
  font-size: 13px;
}

.nas-manage-grid strong {
  color: var(--nas-text);
  font-size: 23px;
}

.nas-manage-grid section > button {
  width: max-content;
  min-height: 30px;
  margin-top: auto;
  border: 1px solid #bdc7cf;
  border-radius: 2px;
  padding: 5px 10px;
  background: #fff;
  color: var(--nas-blue-dark);
  font: inherit;
  font-size: 9px;
  font-weight: 750;
  cursor: pointer;
}

.nas-manage-grid section > button:hover {
  border-color: var(--nas-blue);
}

.nas-surface {
  min-width: 0;
  border: 1px solid var(--nas-line);
  background: var(--nas-surface);
}

.nas-surface > header {
  display: flex;
  min-height: 50px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 9px 12px;
}

.nas-surface h3,
.nas-policy-form h3 {
  font-size: 13px;
}

.nas-surface header > strong {
  color: var(--nas-amber);
  font-size: 11px;
}

.nas-surface header > strong.is-online {
  color: var(--nas-green);
}

.nas-volume-visual {
  height: 12px;
  margin: 18px 14px 14px;
  overflow: hidden;
  border: 1px solid #ccd5dc;
  background: #edf1f4;
}

.nas-volume-visual div {
  width: 0;
  height: 100%;
  background: var(--nas-blue);
  transition: width 300ms ease;
}

.nas-volume-panel dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--nas-soft-line);
}

.nas-volume-panel dl div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  border-right: 1px solid var(--nas-soft-line);
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 8px 12px;
}

.nas-volume-panel dl div:nth-child(even) {
  border-right: 0;
}

.nas-volume-panel dt,
.nas-volume-panel dd {
  margin: 0;
  font-size: 10px;
}

.nas-volume-panel dt {
  color: var(--nas-muted);
}

.nas-volume-panel dd {
  color: var(--nas-text);
  font-weight: 750;
}

.nas-service-list,
.nas-share-list,
.nas-activity-list {
  display: grid;
}

.nas-service-list article,
.nas-activity-list article,
.nas-share-list button {
  display: grid;
  align-items: center;
  gap: 9px;
  min-height: 48px;
  border: 0;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 8px 12px;
  background: #fff;
  color: var(--nas-text);
  font: inherit;
  text-align: left;
}

.nas-service-list article {
  grid-template-columns: 8px minmax(0, 1fr) auto;
}

.nas-service-list div,
.nas-share-list button > span:nth-child(2),
.nas-activity-list div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.nas-service-list strong,
.nas-share-list strong,
.nas-activity-list strong {
  overflow: hidden;
  color: var(--nas-text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-service-list span,
.nas-share-list small,
.nas-activity-list span,
.nas-activity-list time {
  overflow: hidden;
  color: var(--nas-muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-service-list b,
.nas-share-list button > b {
  color: var(--nas-red);
  font-size: 9px;
}

.nas-service-list .is-online b,
.nas-share-list button > b.is-online {
  color: var(--nas-green);
}

.nas-share-list button {
  grid-template-columns: 32px minmax(0, 1fr) auto;
  cursor: pointer;
}

.nas-share-list button:hover {
  background: #f4f8fb;
}

.nas-folder-mark {
  width: 30px;
  height: 26px;
  font-size: 8px;
}

.nas-activity-list article {
  grid-template-columns: 8px minmax(0, 1fr) auto;
}

.nas-text-button {
  border: 0;
  background: transparent;
  color: var(--nas-blue);
  font-size: 10px;
  font-weight: 750;
  cursor: pointer;
}

.nas-empty-state,
.nas-empty-row {
  padding: 22px !important;
  color: var(--nas-muted) !important;
  font-size: 11px !important;
  text-align: center !important;
}

.nas-file-toolbar {
  display: grid;
  grid-template-columns: 200px minmax(220px, 1fr) 120px auto;
  align-items: end;
  gap: 8px;
  border-bottom: 1px solid var(--nas-line);
  padding: 9px 12px;
  background: var(--nas-soft);
}

.nas-file-toolbar label,
.nas-policy-form label,
.nas-dialog label {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.nas-file-toolbar label span {
  color: var(--nas-muted);
  font-size: 9px;
  font-weight: 750;
}

.nas-file-system-toggle > span:last-child {
  display: flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  border: 1px solid #bdc6ce;
  padding: 6px 9px;
  background: #fff;
  color: var(--nas-text) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
}

.nas-dsm-page .nas-file-system-toggle input {
  width: 15px !important;
  min-height: 15px !important;
  flex: 0 0 15px;
  margin: 0;
  accent-color: var(--nas-blue);
}

.nas-file-system-toggle > span:last-child {
  white-space: nowrap;
}

.nas-dsm-page :is(.nas-file-toolbar, .nas-policy-form, .nas-dialog) :is(input, select) {
  width: 100%;
  min-height: 34px;
  border: 1px solid #bdc6ce;
  border-radius: 2px;
  padding: 6px 9px;
  background: #fff;
  color: var(--nas-text);
  font: inherit;
  font-size: 11px;
}

.nas-file-station {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  min-height: 570px;
}

.nas-file-station > aside {
  min-width: 0;
  border-right: 1px solid var(--nas-line);
  background: #f8f9fa;
}

.nas-file-station > aside > strong {
  display: block;
  min-height: 39px;
  border-bottom: 1px solid var(--nas-line);
  padding: 12px;
  color: var(--nas-muted);
  font-size: 10px;
}

.nas-file-station > aside > div {
  display: grid;
  padding: 6px 0;
}

.nas-file-station > aside button {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr) auto;
  min-height: 38px;
  align-items: center;
  gap: 7px;
  border: 0;
  border-left: 3px solid transparent;
  padding: 5px 10px 5px 8px;
  background: transparent;
  color: var(--nas-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.nas-file-station > aside button.is-active {
  border-left-color: var(--nas-blue);
  background: #e7f0f7;
  color: var(--nas-blue-dark);
}

.nas-file-station > aside button span {
  display: grid;
  width: 24px;
  height: 21px;
  place-items: center;
  border: 1px solid #b7c8d6;
  background: #fff;
  font-size: 7px;
  font-weight: 850;
}

.nas-file-station > aside button b,
.nas-file-station > aside button small {
  overflow: hidden;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-table-meta {
  display: flex;
  min-height: 39px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--nas-line);
  padding: 8px 12px;
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-file-location {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 42px;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--nas-line);
  padding: 7px 12px;
  background: #fff;
}

.nas-file-location > span {
  color: var(--nas-muted);
  font-size: 9px;
  white-space: nowrap;
}

.nas-file-location nav,
.nas-directory-breadcrumb {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.nas-file-location nav button,
.nas-directory-breadcrumb button {
  min-height: 26px;
  border: 0;
  padding: 3px 5px;
  background: transparent;
  color: var(--nas-blue-dark);
  font: inherit;
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}

.nas-file-location nav button:hover,
.nas-directory-breadcrumb button:hover {
  background: #edf4f8;
}

.nas-file-location nav span,
.nas-directory-breadcrumb span,
.nas-file-location nav strong {
  color: var(--nas-muted);
  font-size: 9px;
  white-space: nowrap;
}

.nas-table-wrap {
  width: 100%;
  overflow: auto;
}

.nas-data-table {
  width: 100%;
  min-width: 780px;
  border-collapse: collapse;
  table-layout: fixed;
}

.nas-data-table th,
.nas-data-table td {
  overflow: hidden;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 9px 10px;
  color: var(--nas-text);
  font-size: 10px;
  text-align: left;
  text-overflow: ellipsis;
  vertical-align: middle;
}

.nas-data-table th {
  position: sticky;
  z-index: 1;
  top: 0;
  background: #eef3f7;
  color: #425160;
  font-size: 9px;
  font-weight: 800;
}

.nas-data-table tbody tr:hover {
  background: #f7fafc;
}

.nas-data-table tr.is-disabled {
  opacity: 0.58;
}

.nas-data-table td strong,
.nas-data-table td small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-data-table td strong {
  font-size: 10px;
}

.nas-data-table td small {
  margin-top: 3px;
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-data-table th:first-child {
  width: 22%;
}

.nas-data-table th:last-child {
  width: 120px;
}

.nas-path-cell {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 9px !important;
}

.nas-file-name {
  display: grid;
  grid-template-columns: 27px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  color: var(--nas-blue-dark);
}

.nas-folder-name {
  display: grid;
  width: 100%;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--nas-blue-dark);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.nas-folder-name span {
  display: grid;
  width: 29px;
  height: 24px;
  place-items: center;
  border: 1px solid #d3bb75;
  background: #fff7dd;
  color: #7d641f;
  font-size: 7px;
  font-weight: 850;
}

.nas-folder-name strong {
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-folder-row {
  background: #fffefa;
}

.nas-file-name span {
  display: grid;
  width: 26px;
  height: 24px;
  place-items: center;
  border: 1px solid #b5c8d7;
  background: #edf5fa;
  font-size: 7px;
  font-weight: 850;
}

.nas-row-actions {
  gap: 4px;
  white-space: nowrap;
}

.nas-row-actions :is(button, a) {
  min-height: 26px;
  border: 1px solid #bdc7cf;
  border-radius: 2px;
  padding: 4px 7px;
  background: #fff;
  color: var(--nas-blue-dark);
  font: inherit;
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
}

.nas-row-actions :is(button, a):hover {
  border-color: var(--nas-blue);
}

.nas-row-actions :is(button, a):disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.nas-info-banner {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 15px;
  border-bottom: 1px solid #b9cee0;
  padding: 11px 14px;
  background: #edf5fa;
  color: #31536c;
  font-size: 10px;
  line-height: 1.5;
}

.nas-status-pill {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  border: 1px solid #c7ced4;
  border-radius: 2px;
  padding: 3px 6px;
  background: #f5f6f7;
  color: var(--nas-muted);
  font-size: 8px;
  font-weight: 750;
}

.nas-status-pill:is(.is-complete, .is-ready, .is-restored) {
  border-color: #b9d6c7;
  background: #edf7f1;
  color: var(--nas-green);
}

.nas-status-pill:is(.is-attention, .is-partial, .is-restore-partial) {
  border-color: #dcc89e;
  background: #fff8e9;
  color: var(--nas-amber);
}

.nas-status-pill.is-failed {
  border-color: #dfbbb8;
  background: #fff1f0;
  color: var(--nas-red);
}

.nas-status-pill.is-running {
  border-color: #abc9df;
  background: #edf6fc;
  color: var(--nas-blue-dark);
}

.nas-status-pill.is-paused {
  border-color: #cbd1d6;
  background: #f1f3f5;
  color: #626e78;
}

.nas-sync-status-center {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  min-height: 104px;
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid var(--nas-line);
  padding: 16px 18px;
  background: #fff;
}

.nas-sync-engine-badge {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  color: #475569;
  background: #fff;
  font-size: 12px;
  font-weight: 700;
}

.nas-sync-engine-badge[data-state="syncthing"] {
  border-color: #86b8a2;
  color: #17624a;
  background: #f0f9f5;
}

.nas-sync-engine-badge[data-state="fnos"] {
  border-color: #8fb3d9;
  color: #175a8b;
  background: #f1f7fc;
}

.nas-sync-engine-badge[data-state="error"] {
  border-color: #e2a7a7;
  color: #9f2f2f;
  background: #fff7f7;
}

.nas-sync-event {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 13px 16px;
  border-bottom: 1px solid #e5e7eb;
}

.nas-sync-event > i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #64748b;
}

.nas-sync-event > i.is-complete { background: #2f855a; }
.nas-sync-event > i.is-running { background: #2563eb; }
.nas-sync-event > i:is(.is-failed, .is-attention) { background: #c2413b; }
.nas-sync-event span { min-width: 0; }
.nas-sync-event strong,
.nas-sync-event small { display: block; }
.nas-sync-event small,
.nas-sync-event time { color: #64748b; font-size: 12px; }

.nas-sync-state-icon {
  position: relative;
  width: 38px;
  height: 38px;
  border: 2px solid #aab4bc;
  border-radius: 50%;
  background: #f5f7f8;
}

.nas-sync-status-center[data-state="synced"] .nas-sync-state-icon {
  border-color: var(--nas-green);
  background: #edf7f1;
}

.nas-sync-status-center[data-state="synced"] .nas-sync-state-icon::after {
  position: absolute;
  top: 9px;
  left: 12px;
  width: 8px;
  height: 14px;
  border: solid var(--nas-green);
  border-width: 0 3px 3px 0;
  content: "";
  transform: rotate(45deg);
}

.nas-sync-status-center[data-state="syncing"] .nas-sync-state-icon {
  border-color: #c5ddeb;
  border-top-color: var(--nas-blue);
  border-right-color: var(--nas-blue);
  background: #edf6fc;
  animation: nas-sync-rotate 1s linear infinite;
}

.nas-sync-status-center[data-state="paused"] .nas-sync-state-icon::before,
.nas-sync-status-center[data-state="paused"] .nas-sync-state-icon::after {
  position: absolute;
  top: 9px;
  width: 4px;
  height: 16px;
  background: #7d8993;
  content: "";
}

.nas-sync-status-center[data-state="paused"] .nas-sync-state-icon::before {
  left: 11px;
}

.nas-sync-status-center[data-state="paused"] .nas-sync-state-icon::after {
  right: 11px;
}

.nas-sync-status-center:is([data-state="attention"], [data-state="failed"]) .nas-sync-state-icon {
  border-color: var(--nas-red);
  background: #fff1f0;
}

.nas-sync-status-center:is([data-state="attention"], [data-state="failed"]) .nas-sync-state-icon::before,
.nas-sync-status-center:is([data-state="attention"], [data-state="failed"]) .nas-sync-state-icon::after {
  position: absolute;
  top: 8px;
  left: 17px;
  width: 2px;
  height: 18px;
  background: var(--nas-red);
  content: "";
}

.nas-sync-status-center:is([data-state="attention"], [data-state="failed"]) .nas-sync-state-icon::before {
  transform: rotate(45deg);
}

.nas-sync-status-center:is([data-state="attention"], [data-state="failed"]) .nas-sync-state-icon::after {
  transform: rotate(-45deg);
}

.nas-sync-state-copy {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.nas-sync-state-copy h3,
.nas-sync-state-copy p {
  margin: 0;
}

.nas-sync-state-copy h3 {
  color: var(--nas-text);
  font-size: 16px;
}

.nas-sync-state-copy p {
  overflow: hidden;
  color: var(--nas-muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sync-live-progress {
  display: grid;
  grid-template-columns: minmax(120px, 360px) 44px;
  align-items: center;
  gap: 9px;
  margin-top: 5px;
}

.nas-sync-live-progress[hidden] {
  display: none;
}

.nas-sync-live-progress > span,
.nas-sync-task-progress {
  position: relative;
  height: 5px;
  overflow: hidden;
  background: #dfe5e9;
}

.nas-sync-live-progress i,
.nas-sync-task-progress i {
  display: block;
  height: 100%;
  background: var(--nas-blue);
  transition: width 180ms ease;
}

.nas-sync-live-progress b {
  color: var(--nas-blue-dark);
  font-size: 9px;
}

.nas-sync-live-progress.is-indeterminate > span::after,
.nas-sync-task-progress.is-indeterminate::after {
  position: absolute;
  inset: 0 auto 0 -35%;
  width: 35%;
  background: var(--nas-blue);
  content: "";
  animation: nas-sync-slide 1.2s ease-in-out infinite;
}

.nas-sync-connection {
  display: grid;
  grid-template-columns: repeat(2, minmax(110px, auto));
  margin: 0;
  border-left: 1px solid var(--nas-line);
}

.nas-sync-connection div {
  display: grid;
  gap: 4px;
  padding: 3px 14px;
}

.nas-sync-connection div + div {
  border-left: 1px solid var(--nas-soft-line);
}

.nas-sync-connection :is(dt, dd) {
  margin: 0;
  font-size: 9px;
  white-space: nowrap;
}

.nas-sync-connection dt {
  color: var(--nas-muted);
}

.nas-sync-connection dd {
  color: var(--nas-text);
  font-weight: 750;
}

@keyframes nas-sync-rotate {
  to { transform: rotate(360deg); }
}

@keyframes nas-sync-slide {
  to { left: 100%; }
}

.nas-sync-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--nas-line);
  background: #f8fafb;
}

.nas-sync-metrics article {
  display: grid;
  min-height: 76px;
  align-content: center;
  gap: 3px;
  border-right: 1px solid var(--nas-line);
  padding: 11px 15px;
}

.nas-sync-metrics article:last-child {
  border-right: 0;
}

.nas-sync-metrics span,
.nas-sync-metrics small,
.nas-sync-tasks > header span,
.nas-sync-runs > header span {
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-sync-metrics strong {
  color: var(--nas-text);
  font-size: 20px;
}

.nas-sync-devices {
  border-bottom: 1px solid var(--nas-line);
  background: #fff;
}

.nas-sync-devices > header {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 8px 14px;
}

.nas-sync-devices > header span,
.nas-sync-devices > header small {
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-sync-devices > header h3 {
  margin: 2px 0 0;
  color: var(--nas-text);
  font-size: 12px;
}

.nas-sync-devices > div {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.nas-sync-devices article {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  min-height: 62px;
  border-right: 1px solid var(--nas-soft-line);
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 9px 12px;
}

.nas-sync-devices article > i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #9ba6ae;
}

.nas-sync-devices article[data-state="online"] > i {
  background: var(--nas-green);
}

.nas-sync-devices article[data-state="syncing"] > i {
  background: var(--nas-blue);
  box-shadow: 0 0 0 3px rgb(23 105 170 / 13%);
}

.nas-sync-devices article:is([data-state="attention"], [data-state="failed"]) > i {
  background: var(--nas-red);
}

.nas-sync-devices article[data-state="paused"] > i {
  background: #8d98a1;
}

.nas-sync-devices article > div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.nas-sync-devices article :is(strong, small, time) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sync-devices article strong {
  color: var(--nas-text);
  font-size: 10px;
}

.nas-sync-devices article small,
.nas-sync-devices article time {
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-sync-devices article time {
  grid-column: 2 / -1;
}

.nas-device-current,
.nas-device-presence {
  border: 1px solid #c8d0d6;
  border-radius: 2px;
  padding: 3px 5px;
  color: var(--nas-muted);
  font-size: 8px;
  font-weight: 750;
  white-space: nowrap;
}

.nas-device-current {
  border-color: #afc9dc;
  background: #edf6fc;
  color: var(--nas-blue-dark);
}

.nas-sync-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(250px, 0.7fr);
  min-height: 560px;
  background: #f3f5f7;
}

.nas-sync-tasks,
.nas-sync-runs {
  min-width: 0;
  background: #fff;
}

.nas-sync-tasks {
  border-right: 1px solid var(--nas-line);
}

.nas-sync-tasks > header,
.nas-sync-runs > header {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--nas-line);
  padding: 9px 14px;
}

.nas-sync-tasks > header h3,
.nas-sync-runs > header h3 {
  margin: 2px 0 0;
  color: var(--nas-text);
  font-size: 13px;
}

.nas-sync-tasks > header small,
.nas-sync-runs > header small {
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-sync-task {
  border-bottom: 1px solid var(--nas-line);
  padding: 13px 14px 12px;
  background: #fff;
}

.nas-sync-task.is-disabled {
  background: #f8f9fa;
  opacity: 0.72;
}

.nas-sync-task[data-state="running"] {
  border-left: 3px solid var(--nas-blue);
  padding-left: 11px;
}

.nas-sync-task > header {
  display: grid;
  grid-template-columns: 9px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
}

.nas-sync-task > header > i,
.nas-sync-runs button > i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #9aa6af;
}

.nas-sync-task > header > i.is-complete,
.nas-sync-runs button > i.is-complete {
  background: var(--nas-green);
}

.nas-sync-task > header > i.is-running,
.nas-sync-runs button > i.is-running {
  background: var(--nas-blue);
}

.nas-sync-task > header > i.is-paused {
  background: #8f9aa3;
}

.nas-sync-task > header > i:is(.is-attention, .is-failed),
.nas-sync-runs button > i:is(.is-attention, .is-failed) {
  background: var(--nas-red);
}

.nas-sync-task > header > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.nas-sync-task > header strong,
.nas-sync-task > header small {
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sync-task > header small {
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-sync-task-state {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 11px 0 6px;
}

.nas-sync-task-state span {
  overflow: hidden;
  color: var(--nas-text);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sync-task-state b {
  flex: 0 0 auto;
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-sync-task-progress {
  margin-bottom: 11px;
}

.nas-sync-task[data-state="complete"] .nas-sync-task-progress i {
  background: var(--nas-green);
}

.nas-sync-flow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  margin: 11px 0;
  border: 1px solid var(--nas-soft-line);
  background: #f8fafb;
}

.nas-sync-flow > span {
  display: grid;
  min-width: 0;
  gap: 3px;
  padding: 8px 10px;
}

.nas-sync-flow small {
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-sync-flow b {
  overflow: hidden;
  color: var(--nas-text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sync-flow > i {
  color: var(--nas-blue);
  font-size: 17px;
  font-style: normal;
  text-align: center;
}

.nas-sync-task dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0 0 11px;
}

.nas-sync-task dl div {
  display: grid;
  min-width: 0;
  gap: 3px;
  border-right: 1px solid var(--nas-soft-line);
  padding: 0 9px;
}

.nas-sync-task dl div:first-child {
  padding-left: 0;
}

.nas-sync-task dl div:last-child {
  border-right: 0;
}

.nas-sync-task dt,
.nas-sync-task dd {
  overflow: hidden;
  margin: 0;
  font-size: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sync-task dt {
  color: var(--nas-muted);
}

.nas-sync-task dd {
  color: var(--nas-text);
  font-weight: 750;
}

.nas-sync-stages {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 11px;
}

.nas-sync-stages span {
  position: relative;
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-sync-stages span::after {
  position: absolute;
  z-index: 0;
  right: 5px;
  left: 13px;
  height: 1px;
  background: #ccd4da;
  content: "";
}

.nas-sync-stages span:last-child::after {
  display: none;
}

.nas-sync-stages span i {
  z-index: 1;
  width: 8px;
  height: 8px;
  border: 2px solid #aab4bc;
  border-radius: 50%;
  background: #fff;
}

.nas-sync-stages span:is(.is-complete, .is-running) i {
  border-color: var(--nas-green);
  background: var(--nas-green);
}

.nas-sync-stages span:is(.is-attention, .is-failed) i {
  border-color: var(--nas-red);
  background: var(--nas-red);
}

.nas-sync-task > footer {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.nas-sync-task > footer button {
  min-height: 27px;
  border: 1px solid #bdc7cf;
  border-radius: 2px;
  padding: 4px 8px;
  background: #fff;
  color: var(--nas-blue-dark);
  font: inherit;
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
}

.nas-sync-task > footer a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid #cbd5e1;
  border-radius: 3px;
  color: #334155;
  background: #fff;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.nas-sync-task > footer button:hover {
  border-color: var(--nas-blue);
}

.nas-sync-task > footer button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.nas-sync-runs > div {
  display: grid;
}

.nas-sync-runs button {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  min-height: 56px;
  align-items: center;
  gap: 8px;
  border: 0;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 8px 11px;
  background: #fff;
  color: var(--nas-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.nas-sync-runs button:hover {
  background: #f4f8fb;
}

.nas-sync-runs button span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.nas-sync-runs button span:last-child {
  text-align: right;
}

.nas-sync-runs button :is(strong, b, small) {
  overflow: hidden;
  font-size: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sync-runs button small {
  color: var(--nas-muted);
}

.nas-sync-mode-field {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  border: 0;
  padding: 0;
}

.nas-sync-mode-field legend {
  margin-bottom: 5px;
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-sync-mode-field label {
  position: relative;
  display: block;
}

.nas-sync-mode-field input {
  position: absolute;
  opacity: 0;
}

.nas-sync-mode-field span {
  display: grid;
  min-height: 34px;
  place-items: center;
  border: 1px solid #bdc6ce;
  border-right: 0;
  background: #fff;
  color: var(--nas-muted);
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
}

.nas-sync-mode-field label:last-child span {
  border-right: 1px solid #bdc6ce;
}

.nas-sync-mode-field input:checked + span {
  border-color: var(--nas-blue);
  background: #e9f2f8;
  color: var(--nas-blue-dark);
}

.nas-sync-advanced {
  border: 1px solid var(--nas-line);
  background: #f8fafb;
}

.nas-sync-advanced summary {
  min-height: 38px;
  padding: 11px 12px;
  color: var(--nas-blue-dark);
  font-size: 10px;
  font-weight: 750;
  cursor: pointer;
}

.nas-sync-advanced[open] summary {
  border-bottom: 1px solid var(--nas-line);
}

.nas-sync-advanced > div {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.nas-sync-detail-dialog > div {
  display: grid;
  gap: 12px;
  padding: 0 18px 18px;
}

.nas-sync-detail-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--nas-line);
}

.nas-sync-detail-metrics article {
  display: grid;
  min-width: 0;
  gap: 4px;
  border-right: 1px solid var(--nas-line);
  padding: 9px;
}

.nas-sync-detail-metrics article:last-child {
  border-right: 0;
}

.nas-sync-detail-metrics span {
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-sync-detail-metrics strong {
  overflow: hidden;
  color: var(--nas-text);
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sync-detail-list {
  display: grid;
  max-height: 360px;
  overflow-y: auto;
  border: 1px solid var(--nas-line);
}

.nas-sync-detail-list article {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 39px;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 7px 9px;
}

.nas-sync-detail-list article:last-child {
  border-bottom: 0;
}

.nas-sync-detail-list article > span,
.nas-sync-detail-list article > small {
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-sync-detail-list article > strong {
  overflow: hidden;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-sync-detail-list article.is-error {
  background: #fff5f4;
}

.nas-policy-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  max-width: 1000px;
  margin: 18px;
  border: 1px solid var(--nas-line);
  background: #fff;
}

.nas-policy-form > section {
  display: grid;
  align-content: start;
  gap: 14px;
  border-right: 1px solid var(--nas-line);
  padding: 18px;
}

.nas-policy-form > section:nth-child(2) {
  border-right: 0;
}

.nas-policy-form h3 {
  border-bottom: 1px solid var(--nas-soft-line);
  padding-bottom: 10px;
}

.nas-toggle-row {
  display: flex !important;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--nas-line);
  padding: 9px 10px;
  background: var(--nas-soft);
}

.nas-toggle-row > span {
  display: grid;
  gap: 3px;
}

.nas-toggle-row strong {
  color: var(--nas-text);
  font-size: 10px;
}

.nas-toggle-row small {
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-toggle-row input[type="checkbox"] {
  width: 17px !important;
  min-height: 17px !important;
  flex: 0 0 auto;
  accent-color: var(--nas-blue);
}

.nas-policy-form > footer {
  display: flex;
  grid-column: 1 / -1;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid var(--nas-line);
  padding: 11px 14px;
  background: var(--nas-soft);
}

.nas-policy-form > footer span {
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-dialog {
  width: min(500px, calc(100% - 28px));
  max-height: calc(100vh - 48px);
  overflow: auto;
  border: 1px solid #aeb9c2;
  border-radius: 4px;
  padding: 0;
  background: #fff;
  color: var(--nas-text);
  box-shadow: 0 18px 48px rgb(22 37 50 / 22%);
}

.nas-dialog::backdrop {
  background: rgb(24 35 45 / 40%);
}

.nas-dialog form {
  display: grid;
  gap: 14px;
  padding: 0 18px 18px;
}

.nas-dialog header {
  display: flex;
  min-height: 62px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 -18px;
  border-bottom: 1px solid var(--nas-line);
  padding: 10px 14px 10px 18px;
  background: #f7f9fa;
}

.nas-dialog h2 {
  font-size: 16px;
}

.nas-dialog form > p {
  margin: 0;
  color: var(--nas-muted);
  font-size: 9px;
  line-height: 1.6;
}

.nas-directory-field {
  display: grid;
  gap: 5px;
}

.nas-directory-field > span {
  color: var(--nas-muted);
  font-size: 9px;
  font-weight: 750;
}

.nas-directory-field > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
}

.nas-directory-field input {
  width: 100%;
  min-height: 34px;
  border: 1px solid #bdc6ce;
  border-radius: 2px;
  padding: 6px 9px;
  color: var(--nas-text);
  font: inherit;
  font-size: 11px;
}

.nas-directory-dialog {
  width: min(620px, calc(100% - 28px));
}

.nas-directory-dialog > div {
  display: grid;
  gap: 12px;
  padding: 0 18px 18px;
}

.nas-directory-dialog label {
  display: grid;
  gap: 5px;
}

.nas-directory-dialog label > span {
  color: var(--nas-muted);
  font-size: 9px;
  font-weight: 750;
}

.nas-directory-breadcrumb {
  min-height: 34px;
  border: 1px solid var(--nas-line);
  padding: 3px 7px;
  background: #f8fafb;
}

.nas-directory-list {
  display: grid;
  min-height: 190px;
  max-height: 360px;
  align-content: start;
  overflow-y: auto;
  border: 1px solid var(--nas-line);
  background: #fff;
}

.nas-directory-list > button {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  min-height: 44px;
  align-items: center;
  gap: 8px;
  border: 0;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 7px 10px;
  background: #fff;
  color: var(--nas-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.nas-directory-list > button:hover {
  background: #f2f7fa;
}

.nas-directory-list > button > span {
  display: grid;
  width: 29px;
  height: 24px;
  place-items: center;
  border: 1px solid #d3bb75;
  background: #fff7dd;
  color: #7d641f;
  font-size: 7px;
  font-weight: 850;
}

.nas-directory-list > button > b,
.nas-directory-list > button > small {
  overflow: hidden;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-directory-list > button > small {
  color: var(--nas-muted);
}

.nas-directory-dialog footer {
  align-items: center;
}

.nas-directory-dialog footer > span {
  min-width: 0;
  margin-right: auto;
  overflow: hidden;
  color: var(--nas-muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-dialog footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 2px -18px -18px;
  border-top: 1px solid var(--nas-line);
  padding: 11px 18px;
  background: #f7f9fa;
}

.nas-toast {
  position: fixed;
  z-index: 30;
  right: 20px;
  bottom: 20px;
  max-width: min(430px, calc(100% - 40px));
  margin: 0;
  border: 1px solid #aeb9c2;
  border-left: 4px solid var(--nas-blue);
  border-radius: 3px;
  padding: 10px 14px;
  background: #fff;
  color: var(--nas-text);
  font-size: 11px;
  box-shadow: 0 12px 32px rgb(20 35 50 / 18%);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: 150ms ease;
}

.nas-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.nas-toast[data-tone="success"] {
  border-left-color: var(--nas-green);
}

.nas-toast[data-tone="error"] {
  border-left-color: var(--nas-red);
}

.nas-package-grid,
.nas-control-grid,
.nas-resource-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 10px;
  background: #f3f5f7;
}

.nas-package-grid article {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto auto;
  min-height: 84px;
  align-items: center;
  gap: 11px;
  border: 1px solid var(--nas-line);
  padding: 12px;
  background: #fff;
}

.nas-package-mark {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #a8c0d3;
  background: #e9f2f8;
  color: var(--nas-blue-dark);
  font-size: 10px;
  font-weight: 850;
}

.nas-package-grid article > div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.nas-package-grid article h3 {
  margin: 0;
  overflow: hidden;
  color: var(--nas-text);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-package-grid article :is(span, small) {
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-package-grid article > b {
  color: var(--nas-red);
  font-size: 9px;
}

.nas-package-grid article > b.is-online {
  color: var(--nas-green);
}

.nas-package-grid article > :is(button, a) {
  display: grid;
  min-height: 29px;
  place-items: center;
  border: 1px solid #b9c3cb;
  border-radius: 2px;
  padding: 5px 9px;
  background: #fff;
  color: var(--nas-blue-dark);
  font: inherit;
  font-size: 9px;
  font-weight: 750;
  cursor: pointer;
}

.nas-control-grid .nas-surface,
.nas-resource-grid .nas-surface {
  align-self: start;
}

.nas-setting-list {
  display: grid;
  margin: 0;
}

.nas-setting-list > div {
  display: grid;
  grid-template-columns: 135px minmax(0, 1fr);
  min-height: 38px;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 7px 12px;
}

.nas-setting-list dt,
.nas-setting-list dd {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-setting-list dt {
  color: var(--nas-muted);
}

.nas-setting-list dd {
  color: var(--nas-text);
  font-weight: 700;
}

.nas-security-list {
  display: grid;
  max-height: 320px;
  overflow-y: auto;
}

.nas-security-list article {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  min-height: 42px;
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 7px 12px;
}

.nas-security-list article > i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--nas-amber);
}

.nas-security-list article.is-ok > i {
  background: var(--nas-green);
}

.nas-security-list article span {
  display: grid;
  gap: 2px;
}

.nas-security-list article strong,
.nas-security-list article small,
.nas-security-list article b {
  font-size: 9px;
}

.nas-security-list article small {
  color: var(--nas-muted);
}

.nas-security-list article b {
  color: var(--nas-amber);
}

.nas-security-list article.is-ok b {
  color: var(--nas-green);
}

.nas-resource-grid {
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
}

.nas-route-list,
.nas-resource-storage {
  display: grid;
}

.nas-route-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, 0.7fr);
  min-height: 48px;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 8px 12px;
}

.nas-route-list article > span,
.nas-resource-storage article {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.nas-route-list strong,
.nas-route-list small,
.nas-resource-storage span,
.nas-resource-storage small {
  overflow: hidden;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-route-list small,
.nas-resource-storage span,
.nas-resource-storage small {
  color: var(--nas-muted);
}

.nas-route-list progress {
  width: 100%;
  height: 8px;
  border: 0;
  background: #e5eaee;
  accent-color: var(--nas-blue);
}

.nas-resource-storage article {
  min-height: 72px;
  align-content: center;
  border-bottom: 1px solid var(--nas-soft-line);
  padding: 10px 14px;
}

.nas-resource-storage strong {
  color: var(--nas-text);
  font-size: 17px;
}

.nas-row-actions .is-danger {
  border-color: #d9b7b4;
  color: var(--nas-red);
}

.nas-protection-banner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 58px auto;
  min-height: 76px;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid #b9cee0;
  padding: 10px 16px;
  background: #edf5fa;
}

.nas-protection-banner[data-state="protected"] {
  border-bottom-color: #b9d6c7;
  background: #edf7f1;
}

.nas-protection-banner[data-state="risk"] {
  border-bottom-color: #dfbbb8;
  background: #fff1f0;
}

.nas-protection-banner > div:first-child {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.nas-protection-banner span,
.nas-protection-banner small {
  color: var(--nas-muted);
  font-size: 9px;
}

.nas-protection-banner strong {
  color: var(--nas-text);
  font-size: 14px;
}

.nas-score-ring {
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  border: 4px solid var(--nas-amber);
  border-radius: 50%;
  background: #fff;
  color: var(--nas-text);
  font-size: 12px;
  font-weight: 850;
}

.nas-protection-banner[data-state="protected"] .nas-score-ring {
  border-color: var(--nas-green);
}

.nas-protection-banner[data-state="risk"] .nas-score-ring {
  border-color: var(--nas-red);
}

.nas-governance-summary,
.nas-protection-overview {
  display: grid;
  border-bottom: 1px solid var(--nas-line);
  background: #fbfcfd;
}

.nas-governance-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.nas-protection-overview {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.nas-governance-summary article,
.nas-protection-overview article {
  display: grid;
  min-height: 76px;
  align-content: center;
  gap: 3px;
  border-right: 1px solid var(--nas-line);
  padding: 11px 15px;
}

.nas-governance-summary article:last-child,
.nas-protection-overview article:last-child {
  border-right: 0;
}

.nas-governance-summary span,
.nas-governance-summary small,
.nas-protection-overview span,
.nas-protection-overview small {
  overflow: hidden;
  color: var(--nas-muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-governance-summary strong,
.nas-protection-overview strong {
  overflow: hidden;
  color: var(--nas-text);
  font-size: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nas-governance-table {
  min-width: 940px;
}

.nas-governance-table th:first-child {
  width: 18%;
}

.nas-governance-table th:last-child {
  width: 76px;
}

.nas-classification {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  border: 1px solid #c7ced4;
  border-radius: 2px;
  padding: 3px 7px;
  background: #f5f6f7;
  color: var(--nas-muted);
  font-size: 8px;
  font-weight: 800;
}

.nas-classification.is-confidential {
  border-color: #d8c49b;
  background: #fff8e9;
  color: #8c5809;
}

.nas-classification.is-restricted {
  border-color: #dfbbb8;
  background: #fff1f0;
  color: var(--nas-red);
}

.nas-classification.is-public {
  border-color: #b9d6c7;
  background: #edf7f1;
  color: var(--nas-green);
}

.nas-status-pill.is-passed {
  border-color: #b9d6c7;
  background: #edf7f1;
  color: var(--nas-green);
}

.nas-status-pill.is-pending {
  border-color: #dcc89e;
  background: #fff8e9;
  color: var(--nas-amber);
}

.nas-protection-layout {
  display: grid;
  grid-template-columns: minmax(560px, 1.5fr) minmax(280px, 0.75fr);
  gap: 10px;
  padding: 10px;
  background: #f3f5f7;
}

.nas-protection-layout .nas-policy-form {
  max-width: none;
  margin: 0;
}

.nas-protection-side {
  display: grid;
  align-content: start;
  gap: 10px;
}

.nas-alert-list {
  display: grid;
}

.nas-alert-list button {
  display: grid;
  min-height: 66px;
  gap: 3px;
  border: 0;
  border-bottom: 1px solid var(--nas-soft-line);
  border-left: 4px solid #8aa4b8;
  padding: 9px 11px;
  background: #fff;
  color: var(--nas-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.nas-alert-list button:hover {
  background: #f7fafc;
}

.nas-alert-list button.is-warning {
  border-left-color: var(--nas-amber);
}

.nas-alert-list button.is-critical {
  border-left-color: var(--nas-red);
}

.nas-alert-list span,
.nas-alert-list small {
  color: var(--nas-muted);
  font-size: 8px;
}

.nas-alert-list strong {
  font-size: 10px;
}

@media (max-width: 1040px) {
  .nas-dsm-shell {
    grid-template-columns: 158px minmax(0, 1fr);
  }

  .nas-device-identity {
    grid-template-columns: 32px minmax(0, 1fr);
  }

  .nas-device-mark {
    width: 31px;
    height: 31px;
  }

  .nas-overview-grid,
  .nas-manage-grid,
  .nas-enterprise-layout,
  .nas-policy-form,
  .nas-control-grid,
  .nas-resource-grid,
  .nas-protection-layout,
  .nas-sync-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .nas-enterprise-posture {
    grid-template-columns: minmax(0, 1fr);
  }

  .nas-enterprise-posture dl div:first-child {
    border-left: 0;
  }

  .nas-sync-tasks {
    border-right: 0;
    border-bottom: 1px solid var(--nas-line);
  }

  .nas-policy-form > section {
    border-right: 0;
    border-bottom: 1px solid var(--nas-line);
  }

  .nas-file-station {
    grid-template-columns: 170px minmax(0, 1fr);
  }
}

@media (max-width: 760px) {
  .platform-industrial-theme .nas-dsm-main {
    width: calc(100% - 12px);
  }

  .nas-dsm-head,
  .nas-view-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .nas-dsm-head-actions,
  .nas-heading-actions {
    width: 100%;
    flex-wrap: wrap;
  }

  .nas-dsm-head-actions .button,
  .nas-heading-actions .button {
    flex: 1 1 auto;
  }

  .nas-system-state {
    width: 100%;
    border-right: 0;
  }

  .nas-dsm-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .nas-dsm-sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--nas-line);
  }

  .nas-device-identity,
  .nas-sidebar-health {
    display: none;
  }

  .nas-dsm-navigation {
    display: flex;
    overflow-x: auto;
    padding: 0;
  }

  .nas-context-nav {
    padding: 0 10px;
  }

  .nas-dsm-navigation button {
    min-width: 112px;
    grid-template-columns: 25px minmax(0, 1fr);
    border-bottom: 3px solid transparent;
    border-left: 0;
    padding: 6px 9px;
  }

  .nas-dsm-navigation button.is-active {
    border-bottom-color: var(--nas-blue);
  }

  .nas-dsm-navigation button span {
    width: 24px;
    height: 24px;
  }

  .nas-metric-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nas-enterprise-posture dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nas-enterprise-posture dl div:nth-child(3) {
    border-top: 1px solid var(--nas-line);
    border-left: 0;
  }

  .nas-enterprise-posture dl div:nth-child(4) {
    border-top: 1px solid var(--nas-line);
  }

  .nas-metric-strip article:nth-child(2) {
    border-right: 0;
  }

  .nas-metric-strip article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--nas-line);
  }

  .nas-sync-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nas-sync-metrics article:nth-child(2) {
    border-right: 0;
  }

  .nas-sync-metrics article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--nas-line);
  }

  .nas-sync-status-center {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 11px;
    padding: 14px;
  }

  .nas-sync-state-icon {
    width: 34px;
    height: 34px;
  }

  .nas-sync-status-center[data-state="synced"] .nas-sync-state-icon::after {
    top: 7px;
    left: 10px;
  }

  .nas-sync-connection {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--nas-line);
    border-left: 0;
    padding-top: 10px;
  }

  .nas-sync-connection div {
    padding: 0 10px 0 0;
  }

  .nas-sync-connection div + div {
    padding-right: 0;
    padding-left: 10px;
  }

  .nas-sync-flow {
    grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr);
  }

  .nas-sync-task dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 9px;
  }

  .nas-sync-task dl div:nth-child(2) {
    border-right: 0;
  }

  .nas-sync-detail-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nas-sync-detail-metrics article:nth-child(2) {
    border-right: 0;
  }

  .nas-sync-detail-metrics article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--nas-line);
  }

  .nas-overview-grid {
    grid-template-columns: minmax(0, 1fr);
    padding: 6px;
  }

  .nas-protection-banner {
    grid-template-columns: minmax(0, 1fr) 52px;
  }

  .nas-protection-banner .button {
    grid-column: 1 / -1;
  }

  .nas-governance-summary,
  .nas-protection-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nas-governance-summary article:nth-child(2),
  .nas-protection-overview article:nth-child(2) {
    border-right: 0;
  }

  .nas-file-toolbar {
    grid-template-columns: minmax(0, 1fr);
  }

  .nas-file-location {
    grid-template-columns: minmax(0, 1fr);
  }

  .nas-file-location > span {
    padding-left: 5px;
  }

  .nas-directory-field > div {
    grid-template-columns: minmax(0, 1fr);
  }

  .nas-directory-dialog footer {
    flex-wrap: wrap;
  }

  .nas-directory-dialog footer > span {
    width: 100%;
    flex: 1 0 100%;
  }

  .nas-file-station {
    grid-template-columns: minmax(0, 1fr);
  }

  .nas-file-station > aside {
    max-height: 150px;
    overflow-y: auto;
    border-right: 0;
    border-bottom: 1px solid var(--nas-line);
  }

  .nas-info-banner {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
  }

  .nas-policy-form {
    margin: 8px;
  }

  .nas-package-grid {
    grid-template-columns: minmax(0, 1fr);
    padding: 6px;
  }

  .nas-package-grid article {
    grid-template-columns: 38px minmax(0, 1fr) auto;
  }

  .nas-package-grid article > :is(button, a) {
    grid-column: 2 / -1;
  }
}