.wo-app {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.wo-app[aria-busy="true"] {
  cursor: progress;
}

.wo-client-portfolio {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.wo-client-card {
  display: grid;
  gap: 14px;
  align-content: start;
  min-width: 0;
  border-top: 4px solid var(--brand-2);
}

.wo-client-card > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 12px;
  align-items: start;
}

.wo-client-card > header > small {
  grid-column: 1 / -1;
  color: var(--muted);
}

.wo-client-title {
  padding: 0;
  justify-self: start;
  max-width: 100%;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--ink);
  font-size: 18px;
  font-weight: 800;
  text-align: left;
  white-space: normal;
  overflow-wrap: anywhere;
}

.wo-client-title:hover:not(:disabled) {
  background: transparent;
  color: var(--ink);
  box-shadow: none;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.wo-client-orders {
  display: grid;
  gap: 9px;
}

.wo-client-order {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
}

.wo-client-order.is-read-only {
  background: var(--background);
}

.wo-client-order > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.wo-client-order small {
  color: var(--muted);
}

.wo-client-card > footer {
  display: flex;
  justify-content: flex-end;
  margin-top: auto;
}

.wo-central-source {
  border-left: 5px solid var(--brand-2);
}

.wo-topbar {
  margin-bottom: 0;
}

.wo-notice {
  box-shadow: 0 4px 14px rgba(28, 82, 125, .06);
}

.wo-state {
  display: grid;
  justify-items: center;
  gap: 12px;
  min-height: 240px;
  align-content: center;
  text-align: center;
}

.wo-state small,
.wo-empty p,
.wo-ticket-head p,
.wo-package-head p {
  margin: 4px 0 0;
  color: var(--muted);
}

.wo-spinner {
  width: 34px;
  height: 34px;
  border: 3px solid #d8e5ed;
  border-top-color: var(--brand-2);
  border-radius: 50%;
  animation: wo-spin .8s linear infinite;
}

@keyframes wo-spin {
  to { transform: rotate(360deg); }
}

.wo-page-switch,
.wo-detail-tabs {
  display: flex;
  gap: 6px;
  max-width: 100%;
  overflow-x: auto;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #e9f0f4;
}

.wo-page-switch {
  width: max-content;
}

.wo-page-switch button,
.wo-detail-tabs button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 7px 12px;
  border: 0;
  background: transparent;
  color: var(--muted);
  box-shadow: none;
}

.wo-page-switch button:hover:not(:disabled),
.wo-detail-tabs button:hover:not(:disabled) {
  background: rgba(255, 255, 255, .72);
  color: var(--ink);
  box-shadow: none;
}

.wo-page-switch button.active,
.wo-detail-tabs button.active {
  background: #fff;
  color: var(--brand-2);
  box-shadow: 0 2px 8px rgba(28, 82, 125, .12);
}

.wo-page-switch button span {
  display: inline-grid;
  place-items: center;
  min-width: 21px;
  height: 21px;
  padding: 0 6px;
  border-radius: 99px;
  background: #f4dddd;
  color: #9c3033;
  font-size: 11px;
}

.wo-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  gap: 12px;
}

.wo-metrics-compact {
  grid-template-columns: repeat(3, minmax(150px, 1fr));
}

.wo-metric {
  display: grid;
  align-content: space-between;
  gap: 8px;
  min-height: 112px;
}

.wo-metric > span:first-child {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.wo-metric > strong {
  font-size: clamp(23px, 2.2vw, 31px);
  line-height: 1.05;
}

.wo-metric .chip {
  justify-self: start;
}

.wo-filters {
  display: grid;
  grid-template-columns: minmax(230px, 2fr) repeat(3, minmax(140px, 1fr)) auto;
  gap: 10px;
  align-items: end;
}

.wo-filters label,
.wo-form-grid label,
.wo-alert-action-form label,
.wo-activation-requeue-form label,
.wo-assignment-notes {
  display: grid;
  gap: 5px;
  color: #334652;
  font-size: 12px;
  font-weight: 750;
}

.wo-filter-actions,
.wo-form-actions,
.wo-inline-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.wo-list,
.wo-ticket-list,
.wo-stack {
  display: grid;
  gap: 12px;
}

.wo-list-count {
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.wo-row {
  display: grid;
  grid-template-columns: minmax(260px, 2.2fr) minmax(170px, 1fr) minmax(190px, 1.1fr) 26px;
  gap: 16px;
  align-items: center;
  width: 100%;
  min-height: 112px;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--brand-2);
  border-radius: 8px;
  background: var(--paper);
  color: var(--ink);
  text-align: left;
  white-space: normal;
  box-shadow: var(--shadow);
}

.wo-row:hover:not(:disabled) {
  border-color: #a9c0d0;
  border-left-color: var(--brand);
  background: #fbfdfe;
  color: var(--ink);
  box-shadow: 0 12px 28px rgba(28, 82, 125, .14);
  transform: translateY(-1px);
}

.wo-row-main,
.wo-row-owner,
.wo-row-progress {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.wo-row-main > small,
.wo-row-owner small,
.wo-row-progress small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.wo-row-title {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.wo-row-title strong,
.wo-row-owner strong {
  overflow-wrap: anywhere;
}

.wo-row-next {
  padding-top: 5px;
  border-top: 1px solid #edf2f5;
  color: #294f68 !important;
}

.wo-row-arrow {
  color: var(--brand-2);
  font-size: 32px;
  font-weight: 400;
  text-align: right;
}

.wo-client-row {
  grid-template-columns: minmax(260px, 2.2fr) minmax(150px, 1fr) minmax(150px, 1fr) 26px;
}

.wo-client-dates {
  display: grid;
  gap: 4px;
}

.wo-client-dates small {
  color: var(--muted);
}

.wo-progress {
  display: block;
  width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e5ebef;
}

.wo-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--ok);
}

.wo-progress i.warn { background: var(--warn); }
.wo-progress i.danger { background: var(--danger); }

.wo-empty {
  min-height: 160px;
  align-content: center;
  justify-items: center;
  text-align: center;
}

.wo-ticket-create summary,
.wo-stack details > summary {
  cursor: pointer;
  color: var(--brand-2);
  font-weight: 800;
}

.wo-ticket-create[open] summary,
.wo-stack details[open] > summary {
  margin-bottom: 14px;
}

.wo-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 11px;
}

.wo-form-grid .wide {
  grid-column: 1 / -1;
}

.wo-ticket {
  display: grid;
  gap: 12px;
  border-left: 4px solid var(--brand-2);
}

.wo-ticket-head,
.wo-package-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.wo-ticket-head h3,
.wo-package-head h3 {
  margin: 3px 0 0;
}

.wo-ticket-description {
  margin: 0;
  color: #334652;
  line-height: 1.5;
  white-space: pre-wrap;
}

.wo-alert-dashboard,
.wo-alert-detail,
.wo-activation-incidents,
.wo-scope-decision {
  display: grid;
  gap: 12px;
}

.wo-alert-dashboard {
  border-left: 4px solid var(--warn);
}

.wo-activation-incidents {
  border-left: 4px solid var(--danger);
}

.wo-activation-incident-list {
  display: grid;
  gap: 10px;
}

.wo-activation-incident {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--danger);
  border-radius: 8px;
  background: #fff;
}

.wo-activation-incident p {
  margin: 0;
  color: var(--muted);
}

.wo-activation-requeue-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.wo-alert-list,
.wo-alert-actions,
.wo-ticket-routing-actions,
.wo-scope-actions {
  display: grid;
  gap: 10px;
}

.wo-alert-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  width: 100%;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  white-space: normal;
  box-shadow: none;
}

.wo-alert-summary > span:nth-child(2) {
  display: grid;
  gap: 3px;
}

.wo-alert-summary small,
.wo-alert-summary em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.wo-alert-item {
  display: grid;
  gap: 8px;
  padding: 11px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--warn);
  border-radius: 8px;
}

.wo-alert-item.resolved {
  border-left-color: var(--ok);
  opacity: .78;
}

.wo-alert-item-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.wo-alert-item p {
  margin: 0;
  color: var(--muted);
}

.wo-alert-action-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.wo-ticket-routing-actions,
.wo-ticket-transition-form,
.wo-scope-actions,
.wo-scope-unresolved {
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.wo-detail-status {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.wo-detail-status > span {
  color: var(--muted);
  font-size: 12px;
}

.wo-journey {
  display: grid;
  gap: 18px;
  overflow: hidden;
  border: 1px solid #cfdde4;
  border-left: 6px solid var(--brand-2);
  background: linear-gradient(145deg, #fff 0%, #f4f8fa 100%);
}

.wo-journey-focus {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(190px, auto);
  gap: 18px;
  align-items: center;
}

.wo-journey-focus h2,
.wo-journey-focus p {
  margin: 4px 0 0;
}

.wo-journey-focus p {
  max-width: 68ch;
  color: var(--muted);
  line-height: 1.45;
}

.wo-journey-count,
.wo-journey-parallel {
  display: inline-flex;
  margin: 8px 8px 0 0;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
}

.wo-journey-count {
  background: #e5f2f7;
  color: #14516d;
}

.wo-journey-parallel {
  background: #fff0d5;
  color: #714505;
  font-weight: 700;
}

.wo-journey-progress {
  display: grid;
  min-width: 110px;
  gap: 2px;
  text-align: right;
}

.wo-journey-progress strong {
  color: var(--brand-2);
  font-size: 26px;
}

.wo-journey-progress span {
  color: var(--muted);
  font-size: 11px;
}

.wo-journey-progress progress {
  width: 100%;
  height: 7px;
  margin-top: 5px;
  accent-color: #2f7d45;
}

.wo-journey-primary {
  display: grid;
  justify-items: stretch;
}

.wo-journey-primary .wo-next-action {
  padding: 0;
  border: 0;
  background: transparent;
}

.wo-journey-primary .wo-next-action > small,
.wo-journey-primary .wo-next-action > h4,
.wo-journey-primary .wo-next-action > p {
  display: none;
}

.wo-journey-readonly {
  display: grid;
  gap: 3px;
  max-width: 230px;
  color: var(--muted);
}

.wo-journey-readonly small {
  line-height: 1.35;
}

.wo-journey-deadlines {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid #d8e2e7;
  border-radius: 10px;
  background: rgba(255, 255, 255, .78);
}

.wo-journey-deadline {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 10px 12px;
  border-right: 1px solid #d8e2e7;
}

.wo-journey-deadline:last-child {
  border-right: 0;
}

.wo-journey-deadline small {
  color: var(--muted);
}

.wo-journey-deadline strong {
  overflow-wrap: anywhere;
}

.wo-journey-deadline.is-overdue {
  background: #fff3f1;
  color: #8b2c24;
}

.wo-journey-deadline span {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.wo-journey-path summary {
  width: fit-content;
  cursor: pointer;
  color: var(--ink);
  font-weight: 800;
}

.wo-journey-path ol {
  display: grid;
  gap: 0;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.wo-journey-path-help {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.wo-journey-path li {
  border-top: 1px solid #dce5e9;
}

.wo-journey-path li[aria-current="step"] {
  margin-inline: -4px;
  border: 1px solid #e4b35f;
  border-radius: 8px;
  background: #fffaf0;
}

.wo-journey-step-link {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto minmax(118px, auto);
  width: 100%;
  min-width: 0;
  gap: 10px;
  align-items: center;
  padding: 10px 8px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--ink);
  text-align: left;
  white-space: normal;
  box-shadow: none;
}

.wo-journey-step-link:hover:not(:disabled),
.wo-journey-step-link:focus-visible {
  background: #edf5f8;
  box-shadow: inset 0 0 0 2px #8db9cb;
  transform: none;
}

.wo-journey-path li[aria-current="step"] .wo-journey-step-link:hover:not(:disabled),
.wo-journey-path li[aria-current="step"] .wo-journey-step-link:focus-visible {
  background: #fff3d9;
}

.wo-journey-step-link:disabled {
  cursor: not-allowed;
  opacity: .7;
}

.wo-journey-marker {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  background: #e8edf0;
  color: #52636b;
  font-weight: 900;
}

.wo-journey-path li.is-done .wo-journey-marker {
  background: #dcefe1;
  color: #246537;
}

.wo-journey-path li.is-current .wo-journey-marker {
  background: #f9dba3;
  color: #744704;
}

.wo-journey-step-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.wo-journey-step-copy small,
.wo-journey-step-copy > span,
.wo-journey-step-meta small {
  color: var(--muted);
  font-size: 12px;
}

.wo-journey-step-meta {
  display: grid;
  min-width: 92px;
  justify-items: end;
  gap: 1px;
  text-align: right;
}

.wo-journey-step-meta em {
  color: #44555e;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.wo-journey-step-cta {
  display: inline-flex;
  justify-content: flex-end;
  gap: 6px;
  color: var(--brand-2);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.wo-journey-step-cta i {
  font-style: normal;
  transition: transform .15s ease;
}

.wo-journey-step-link:hover:not(:disabled) .wo-journey-step-cta i {
  transform: translateX(2px);
}

.wo-guided-panel {
  display: grid;
  gap: 16px;
  border-left: 6px solid var(--brand-2);
  background: linear-gradient(135deg, #fff 0%, #f1f7fb 100%);
}

.wo-guided-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
}

.wo-guided-head > div:first-child > small,
.wo-guided-note {
  color: var(--muted);
}

.wo-guided-head h2,
.wo-guided-head p {
  margin: 3px 0 0;
}

.wo-guided-primary {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.wo-wizard-progress-summary {
  display: flex;
  align-items: center;
  gap: 9px;
}

.wo-wizard-progress-summary > strong {
  color: var(--brand-2);
  font-size: 20px;
}

.wo-wizard-progress {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #dfe9ee;
  box-shadow: inset 0 1px 2px rgba(20, 45, 58, .12);
}

.wo-wizard-progress > i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2f7d45, #54a968);
  transition: width .25s ease;
}

.wo-guided-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  color: var(--muted);
  font-size: 12px;
}

.wo-guided-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.wo-guided-legend i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(30, 45, 52, .07);
}

.wo-guided-legend .is-green i { background: #3d914f; }
.wo-guided-legend .is-orange i { background: #ed9417; }
.wo-guided-legend .is-red i { background: #cf3f3f; }

.wo-guided-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.wo-guided-steps li {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #d7e3ea;
  border-radius: 9px;
  background: #fff;
}

.wo-guided-steps li.is-green { border-color: #9fcbaa; background: #f3faf5; }
.wo-guided-steps li.is-orange { border-color: #efc16d; background: #fffaf0; }
.wo-guided-steps li.is-red { border-color: #e3a1a1; background: #fff6f6; }
.wo-guided-steps li[aria-current="step"] { box-shadow: 0 0 0 3px rgba(24, 102, 147, .12); }

.wo-traffic-light {
  display: grid;
  place-items: center;
  gap: 3px;
  width: 24px;
  padding: 4px 3px;
  border: 1px solid #18272d;
  border-radius: 8px;
  background: #2b3b42;
  box-shadow: 0 2px 5px rgba(20, 37, 44, .2);
}

.wo-traffic-light i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #617078;
  opacity: .28;
}

.wo-guided-steps li.is-red .wo-traffic-light i.red {
  background: #f04e4e;
  box-shadow: 0 0 7px #f04e4e;
  opacity: 1;
}

.wo-guided-steps li.is-orange .wo-traffic-light i.orange {
  background: #ff9f1c;
  box-shadow: 0 0 7px #ff9f1c;
  opacity: 1;
}

.wo-guided-steps li.is-green .wo-traffic-light i.green {
  background: #56b96a;
  box-shadow: 0 0 7px #56b96a;
  opacity: 1;
}

.wo-guided-steps li > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.wo-guided-steps li > div > em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.wo-guided-steps small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.wo-guided-steps button {
  padding: 6px 8px;
}

.wo-guided-steps button:disabled {
  border-color: #b8c8be;
  background: #e8f0ea;
  color: #315d3c;
  cursor: not-allowed;
  opacity: 1;
}

.wo-guided-state {
  width: fit-content;
  margin-top: 3px;
  font-size: var(--text-badge);
}

.wo-guided-steps li.is-green .wo-guided-state { color: #246537; }
.wo-guided-steps li.is-orange .wo-guided-state { color: #945706; }
.wo-guided-steps li.is-red .wo-guided-state { color: #9d2929; }

.wo-workflow-blockers {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 10px 12px 10px 30px;
  border: 1px solid #efc16d;
  border-radius: 9px;
  background: #fffaf0;
}

.wo-workflow-blockers li small {
  display: block;
  color: var(--muted);
}

.wo-workflow-governance {
  padding-top: 8px;
  border-top: 1px solid #d7e3ea;
}

.wo-workflow-governance p {
  color: var(--muted);
}

.wo-dependency-list {
  display: grid;
  gap: 8px;
  margin: 12px 0;
  padding: 0;
  list-style: none;
}

.wo-dependency-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid #d7e3ea;
  border-radius: 9px;
}

.wo-dependency-list li > div {
  display: grid;
  gap: 3px;
}

.wo-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.wo-detail-grid > article:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

.wo-scope-card > p {
  margin: 0 0 15px;
  color: var(--muted);
  line-height: 1.5;
}

.wo-definition {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 15px;
}

.wo-definition > div {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--background);
}

.wo-definition dt {
  color: var(--muted);
  font-size: var(--text-caption);
  font-weight: 700;
}

.wo-definition dd {
  margin: 3px 0 0;
  font-weight: 750;
  overflow-wrap: anywhere;
}

.wo-consultant-governance .section-title {
  margin-bottom: 12px;
}

.wo-next-action {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--background);
}

.wo-next-action > small {
  color: var(--brand-2);
  font-size: var(--text-badge);
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.wo-next-action h4,
.wo-next-action p {
  margin: 0;
}

.wo-next-action p {
  color: var(--muted);
  line-height: 1.45;
}

.wo-consultant-transition-form {
  display: grid;
  gap: 10px;
}

.wo-optional-note {
  padding-top: 2px;
}

.wo-optional-note summary {
  width: fit-content;
  color: var(--brand-2);
  cursor: pointer;
  font-size: 12px;
  font-weight: 750;
}

.wo-optional-note label {
  display: grid;
  gap: 5px;
  margin-top: 9px;
  color: #334652;
  font-size: 12px;
  font-weight: 750;
}

.wo-optional-note label small {
  color: var(--muted);
  font-weight: 500;
}

.wo-budget {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0 6px;
  color: var(--muted);
  font-size: 12px;
}

.wo-candidates {
  display: grid;
  gap: 7px;
  margin-bottom: 12px;
}

.wo-candidate {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  cursor: pointer;
}

.wo-candidate:has(input:checked) {
  border-color: var(--brand-2);
  background: #eef5f9;
}

.wo-candidate.is-ineligible {
  border-color: #e2b9b9;
  background: #fff8f8;
}

.wo-candidate.is-hard-blocked {
  cursor: not-allowed;
  opacity: .72;
}

.wo-candidate.is-hard-blocked input {
  cursor: not-allowed;
}

.wo-candidate.is-recommended::before {
  content: "Proposta";
  grid-column: 2 / -1;
  justify-self: start;
  margin-bottom: -5px;
  padding: 2px 6px;
  border-radius: 99px;
  background: #dff0e4;
  color: #19582c;
  font-size: 10px;
  font-weight: 800;
}

.wo-candidate input {
  width: auto;
}

.wo-candidate > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.wo-candidate small,
.wo-candidate em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  overflow-wrap: anywhere;
}

.wo-candidate > b {
  display: grid;
  place-items: center;
  min-width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #e5eff7;
  color: var(--brand-2);
}

.wo-assignment-current {
  display: grid;
  gap: 8px;
}

.wo-assignment-current > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.wo-assignment-notes {
  margin-bottom: 10px;
}

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

.wo-economic-grid > div {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
}

.wo-economic-grid small {
  color: var(--muted);
}

.wo-economic-grid .is-positive strong,
.wo-money.is-revenue { color: var(--ok); }
.wo-economic-grid .is-negative strong,
.wo-money.is-cost { color: var(--danger); }

.wo-timeline {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.wo-timeline li {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  gap: 9px;
  min-height: 48px;
}

.wo-timeline li > span {
  position: relative;
  margin-top: 5px;
  width: 10px;
  height: 10px;
  border: 2px solid var(--brand-2);
  border-radius: 50%;
  background: #fff;
}

.wo-timeline li:not(:last-child) > span::after {
  content: "";
  position: absolute;
  top: 9px;
  left: 2px;
  width: 2px;
  height: 38px;
  background: #c9d7e0;
}

.wo-timeline li div {
  display: grid;
  gap: 2px;
  padding-bottom: 12px;
}

.wo-timeline small,
.wo-timeline p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-caption);
}

.wo-package-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
}

.wo-package {
  display: grid;
  align-content: start;
  gap: 9px;
  box-shadow: none;
}

.wo-task-list {
  display: grid;
  gap: 5px;
  margin: 5px 0 0;
  padding: 0;
  list-style: none;
}

.wo-task-list li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding-top: 6px;
  border-top: 1px solid #e7edf1;
  font-size: 12px;
}

.wo-task-row {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.wo-task-editor {
  width: 100%;
}

.wo-package-editor,
.wo-time-editor,
.wo-time-approval {
  width: 100%;
}

.wo-package-editor > summary,
.wo-time-editor > summary,
.wo-time-approval > summary {
  cursor: pointer;
  color: var(--brand-2);
  font-weight: 750;
}

.wo-package-editor .wo-form-grid,
.wo-time-editor .wo-form-grid,
.wo-time-approval .wo-form-grid {
  margin-top: 10px;
}

.wo-package-editor .wo-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wo-time-editor .wo-form-grid,
.wo-time-approval .wo-form-grid {
  grid-template-columns: minmax(220px, 1fr);
}

.wo-task-editor > summary {
  color: var(--brand);
  cursor: pointer;
  font-weight: 700;
}

.wo-task-editor .wo-form-grid {
  margin-top: 10px;
}

.wo-table {
  width: 100%;
  border-collapse: collapse;
}

.wo-table-scroll {
  max-width: 100%;
  overflow-x: auto;
}

.wo-bp-compact-metrics {
  margin: 14px 0;
}

.wo-bp-alerts,
.wo-bp-configuration,
.wo-bp-configuration > details,
.wo-bp-nested,
.wo-bp-editor {
  display: grid;
  gap: 12px;
}

.wo-bp-configuration > details,
.wo-bp-nested,
.wo-bp-editor {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fbfdfe;
}

.wo-bp-configuration summary,
.wo-bp-editor summary {
  cursor: pointer;
  color: var(--brand-2);
  font-weight: 800;
}

.wo-bp-configuration form + form {
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.wo-bp-perspectives {
  width: max-content;
}

.wo-bp-year-switch {
  display: flex;
  align-items: end;
  gap: 10px;
  width: max-content;
  max-width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fbfdfe;
}

.wo-bp-year-switch label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.wo-table th,
.wo-table td {
  padding: 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.wo-table th {
  background: var(--background);
  color: var(--text-secondary);
  font-size: var(--text-caption);
  text-transform: uppercase;
}

.wo-table small,
.muted {
  color: var(--muted);
}

.wo-money {
  font-weight: 800;
  white-space: nowrap;
}

.wo-raci-table th:not(:first-child),
.wo-raci-table td:not(:first-child) {
  min-width: 130px;
}

.wo-contract-snapshot {
  display: grid;
  gap: 16px;
}

.wo-contract-snapshot h3 {
  margin: 0;
}

.wo-contract-services {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 9px;
}

.wo-contract-services article {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
}

.wo-contract-services small {
  color: var(--muted);
}

.wo-contract-services b {
  color: var(--brand-2);
}

.wo-contract-hash {
  margin: 0;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  overflow-wrap: anywhere;
}

.wo-contract-rule-list {
  display: grid;
  gap: 10px;
}

.wo-contract-rule {
  box-shadow: none;
}

.wo-contract-rule-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.wo-check-line span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.wo-check-line input {
  width: auto;
}

.wo-contract-publish {
  display: grid;
  grid-template-columns: minmax(230px, .7fr) minmax(0, 2fr);
  gap: 18px;
  align-items: start;
}

.wo-contract-publish h2,
.wo-contract-publish p {
  margin: 0;
}

.wo-contract-publish p {
  margin-top: 5px;
  color: var(--muted);
}

.wo-contract-settings {
  display: grid;
  gap: 14px;
}

.wo-contract-settings-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  border-left: 5px solid var(--brand-2);
}

.wo-contract-settings-head h2,
.wo-contract-settings-head p {
  margin: 0;
}

.wo-contract-settings-head p {
  margin-top: 6px;
  color: var(--muted);
}

.wo-kicker {
  display: inline-block;
  margin-bottom: 5px;
  color: var(--brand-2);
  font-size: var(--text-badge);
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.wo-contract-diff-form {
  align-items: end;
}

.wo-contract-diff {
  display: grid;
  gap: 10px;
}

.wo-contract-diff-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.wo-contract-diff-grid article {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid #c4d7e5;
  border-radius: 8px;
  background: rgba(255, 255, 255, .68);
}

.wo-contract-diff-grid small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

@media (max-width: 760px) {
  .wo-contract-settings-head,
  .wo-contract-publish {
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .wo-contract-diff-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1180px) {
  .wo-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wo-filter-actions { align-self: stretch; align-items: end; }
  .wo-row { grid-template-columns: minmax(240px, 2fr) minmax(160px, 1fr) minmax(180px, 1fr); }
  .wo-row-arrow { display: none; }
  .wo-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wo-guided-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .wo-client-portfolio { grid-template-columns: 1fr; }
  .wo-detail-grid { grid-template-columns: 1fr; }
  .wo-detail-grid > article:last-child:nth-child(odd) { grid-column: auto; }
  .wo-row { grid-template-columns: 1fr 1fr; }
  .wo-row-main { grid-column: 1 / -1; }
  .wo-economic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wo-contract-publish { grid-template-columns: 1fr; }
  .wo-guided-head { grid-template-columns: 1fr; align-items: stretch; }
  .wo-guided-primary { justify-content: flex-start; }
  .wo-journey-focus { grid-template-columns: 1fr auto; align-items: start; }
  .wo-journey-primary { grid-column: 1 / -1; justify-items: start; }
  .wo-journey-deadlines { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wo-journey-deadline:nth-child(2) { border-right: 0; }
  .wo-journey-deadline:nth-child(-n+2) { border-bottom: 1px solid #d8e2e7; }
}

@media (max-width: 620px) {
  .wo-client-card > header,
  .wo-client-order { grid-template-columns: 1fr; }
  .wo-client-card > header .chips { justify-self: start; }
  .wo-client-order > button { width: 100%; }
  .wo-topbar { display: grid; }
  .wo-topbar .toolbar { justify-content: stretch; }
  .wo-topbar .toolbar button { flex: 1; }
  .wo-metrics,
  .wo-metrics-compact,
  .wo-filters,
  .wo-form-grid,
  .wo-package-editor .wo-form-grid,
  .wo-row,
  .wo-economic-grid,
  .wo-definition,
  .wo-definition { grid-template-columns: 1fr; }
  .wo-guided-steps { grid-template-columns: 1fr; }
  .wo-journey-focus { grid-template-columns: 1fr; }
  .wo-journey-progress { min-width: 0; text-align: left; }
  .wo-journey-primary { grid-column: auto; }
  .wo-journey-primary > button,
  .wo-journey-primary .wo-form-actions button { width: 100%; }
  .wo-journey-deadlines { grid-template-columns: 1fr; }
  .wo-journey-deadline,
  .wo-journey-deadline:nth-child(2) { border-right: 0; border-bottom: 1px solid #d8e2e7; }
  .wo-journey-deadline:last-child { border-bottom: 0; }
  .wo-journey-step-link { grid-template-columns: 28px minmax(0, 1fr); }
  .wo-journey-step-meta { grid-column: 2; justify-items: start; text-align: left; }
  .wo-journey-step-cta { grid-column: 2; justify-content: flex-start; }
  .wo-row-main { grid-column: auto; }
  .wo-detail-status,
  .wo-ticket-head,
  .wo-package-head { align-items: stretch; flex-direction: column; }
  .wo-detail-status > span { text-align: left; }
  .wo-page-switch { width: 100%; }
  .wo-bp-year-switch { width: 100%; }
  .wo-bp-year-switch label { flex: 1; }
  .wo-page-switch button { flex: 1; }
  .wo-form-grid .wide { grid-column: auto; }
  .wo-alert-action-form { grid-template-columns: 1fr; }
  .wo-filter-actions,
  .wo-form-actions { justify-content: stretch; }
  .wo-filter-actions button,
  .wo-form-actions button { flex: 1; }
}
dialog.wo-assignment-dialog {
  width: min(940px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  box-sizing: border-box;
  overflow-y: auto;
  border: 1px solid #d5dce5;
  border-radius: 16px;
  padding: 24px;
  color: #172b3a;
  background: #fff;
}
dialog.wo-assignment-dialog::backdrop { background: rgb(15 23 42 / 55%); }
.wo-assignment-dialog fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.wo-assignment-dialog .section-title { align-items: flex-start; gap: 16px; }
@media (max-width: 600px) {
  dialog.wo-assignment-dialog { padding: 16px; }
  .wo-assignment-dialog .wo-form-grid { grid-template-columns: 1fr; }
}

/* Keep the address visible even for orders with the same company and service. */
.wo-workorder-sites {
  display: grid;
  gap: 3px;
  padding: 9px 12px;
  border-left: 3px solid var(--brand-2, #176a86);
  background: rgba(23, 106, 134, .06);
  border-radius: 4px;
  text-align: left;
  white-space: normal;
  overflow-wrap: anywhere;
  min-width: 0;
}
.wo-site-caption {
  font-size: 12px;
  font-weight: 500;
  color: var(--muted);
}
.wo-workorder-sites > strong { font-size: 14px; line-height: 1.45; }
.wo-workorder-sites.is-detail { margin-bottom: 16px; padding: 14px 18px; }
.wo-workorder-sites.is-detail > strong { font-size: 16px; }

/* Give the overview metrics a consistent, readable rhythm. */
.wo-metrics:has(> .wo-metric) {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.wo-metrics > .metric {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 4px;
  min-height: 0;
}

@media (max-width: 900px) {
  .wo-metrics:has(> .wo-metric) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .wo-metrics:has(> .wo-metric),
  .wo-metrics:has(> .metric) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wo-metrics:has(> .wo-metric) .wo-metric {
    min-height: 120px;
  }

  .wo-alert-summary { grid-template-columns: minmax(0, 1fr); }
  .wo-alert-summary > span { min-width: 0; }
}

@media (max-width: 360px) {
  .wo-metrics:has(> .wo-metric) {
    grid-template-columns: 1fr;
  }
}