.strategy-page .org-hero {
  background: var(--cp-color-surface);
  border: 1px solid var(--cp-color-border-subtle);
}

.strategy-page .org-hero__actions {
  padding-right: var(--cp-space-page-inline);
}

@media (max-width: 992px) {
  .strategy-page .org-hero__actions {
    padding-right: 0;
  }
}

.strategy-shell {
  max-width: none;
  width: min(1680px, calc(100vw - (2 * var(--cp-space-page-inline))));
  padding-left: 0;
  padding-right: 0;
}

.strategy-hero__meta {
  margin-left: auto;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.strategy-hero__title-status {
  margin-left: 10px;
  vertical-align: middle;
}

.strategy-hero__period {
  color: var(--cp-color-text-secondary);
  font-size: var(--cp-size-secondary);
  font-weight: 600;
  white-space: nowrap;
}

.strategy-hero__period-nav {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.strategy-hero__period-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.strategy-layout {
  margin-top: var(--cp-space-page-section);
  display: grid;
  gap: 14px;
  grid-template-columns: max-content minmax(0, 1fr);
}

.strategy-inline-notice {
  margin-top: 16px;
}

.strategy-sidebar-card {
  align-self: start;
  min-width: 0;
  width: 340px;
  transition: width 180ms ease;
}

.strategy-sidebar-card.is-collapsed {
  overflow: hidden;
  width: 64px;
}

.strategy-sidebar-card.is-collapsed .strategy-card__header {
  justify-content: center;
}

.strategy-sidebar__toggle {
  min-width: 32px;
  width: 32px;
  height: 32px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.strategy-sidebar-card.is-collapsed .strategy-sidebar__toggle {
  margin-inline: auto;
}

.strategy-content-card {
  min-height: 460px;
}

.strategy-card__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
}

.strategy-nav {
  margin-top: 10px;
  display: grid;
  gap: 8px;
}

.strategy-nav__tree {
  display: grid;
  gap: 6px;
}

.strategy-nav__branch {
  border: 0;
  background: transparent;
  padding: 0;
}

.strategy-nav__summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin: 0;
  padding: 0;
}

.strategy-nav__summary::-webkit-details-marker {
  display: none;
}

.strategy-nav__children {
  margin-top: 6px;
  padding-left: 10px;
  display: grid;
  gap: 6px;
  border-left: 1px solid var(--cp-color-border-subtle);
}

.strategy-objective-status {
  display: inline-flex;
  margin-left: 10px;
  vertical-align: middle;
}

.strategy-nav__item {
  width: 100%;
  border: 1px solid transparent;
  background: transparent;
  color: var(--cp-color-text-primary);
  font-size: var(--cp-size-secondary);
  text-align: left;
  border-radius: 10px;
  padding: 8px 10px;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: background-color 120ms ease, border-color 120ms ease;
}

.strategy-nav__check {
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  margin: 0;
  border: 1px solid var(--cp-color-border-strong);
  border-radius: 5px;
  background: var(--cp-color-surface);
  position: relative;
  flex: 0 0 auto;
  pointer-events: none;
  transition: border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

.strategy-nav__check::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 9px;
  border-right: 2px solid transparent;
  border-bottom: 2px solid transparent;
  transform: rotate(45deg);
}

.strategy-nav__check:checked {
  border-color: var(--cp-color-accent);
  background: var(--cp-color-accent);
}

.strategy-nav__check:checked::after {
  border-right-color: var(--cp-color-surface);
  border-bottom-color: var(--cp-color-surface);
}

.strategy-nav__item.is-active .strategy-nav__check {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--cp-color-accent-subtle) 70%, transparent 30%);
}

.strategy-nav__item:hover {
  background: var(--cp-color-surface-subtle);
  border-color: var(--cp-color-border-subtle);
}

.strategy-nav__item.is-active {
  background: var(--cp-color-accent-subtle);
  border-color: var(--cp-color-accent);
  color: var(--cp-color-accent);
  font-weight: 600;
}

.strategy-nav__icon {
  color: var(--cp-color-text-muted);
  font-size: 0.92rem;
  line-height: 1;
}

.strategy-nav__item.is-active .strategy-nav__icon {
  color: var(--cp-color-accent);
}

.strategy-nav__count {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 20px;
  padding: 0 7px;
  border-radius: 999px;
  border: 1px solid var(--cp-color-border-subtle);
  background: var(--cp-color-surface-subtle);
  color: var(--cp-color-text-secondary);
  font-size: 0.72rem;
  font-weight: 700;
}

.strategy-nav__item.is-active .strategy-nav__count {
  border-color: color-mix(in srgb, var(--cp-color-accent) 45%, white 55%);
  background: color-mix(in srgb, var(--cp-color-accent-subtle) 80%, white 20%);
  color: var(--cp-color-accent);
}

.strategy-nav__item--team {
  font-size: 0.84rem;
}

.strategy-content-card__actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-self: end;
}

.strategy-content-card__actions .cp-btn {
  align-self: center;
}

.strategy-content-card__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}

.strategy-content-card__center {
  justify-self: center;
  align-self: center;
}

.strategy-content-card__header .strategy-content-heading {
  justify-self: start;
}

@media (max-width: 992px) {
  .strategy-content-card__header {
    grid-template-columns: 1fr;
  }

  .strategy-content-card__center {
    justify-self: start;
  }

  .strategy-content-card__actions {
    justify-self: start;
  }
}

.strategy-laddering-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-left: 0;
  flex: 0 0 auto;
  min-width: 112px;
}

.strategy-laddering-toggle__label {
  font-size: var(--cp-size-secondary);
  color: var(--cp-color-text-secondary);
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}

.strategy-laddering-toggle .strategy-laddering-toggle__input {
  margin-left: 0;
  margin-right: 0;
  float: none;
  position: static;
  flex: 0 0 auto;
  border-color: var(--cp-color-border-strong);
  background-color: var(--cp-color-surface-subtle);
}

.strategy-laddering-toggle .strategy-laddering-toggle__input:focus {
  border-color: var(--cp-color-accent);
  box-shadow: 0 0 0 0.2rem
    color-mix(in srgb, var(--cp-color-accent-subtle) 70%, transparent 30%);
}

.strategy-laddering-toggle .strategy-laddering-toggle__input:checked {
  border-color: var(--cp-color-accent);
  background-color: var(--cp-color-accent);
}

.strategy-content-heading {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.strategy-content-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.strategy-content-title__icon {
  color: var(--cp-color-text-muted);
  font-size: 0.95rem;
  line-height: 1;
}

.strategy-content-title__period {
  color: var(--cp-color-text-secondary);
  font-size: var(--cp-size-secondary);
  font-weight: 600;
  line-height: 1.1;
  transform: translateY(1px);
  white-space: nowrap;
}

.strategy-content {
  display: grid;
  gap: 12px;
}

.strategy-table-wrap {
  --strategy-action-menu-overflow-space: 220px;
  border: 1px solid var(--cp-color-border-subtle);
  border-radius: 16px;
  background: var(--cp-color-surface);
  overflow: visible;
  position: relative;
  max-width: 100%;
  min-width: 0;
  z-index: 1;
}

.strategy-table-scroll-shell {
  position: relative;
  overflow: visible;
  max-width: 100%;
  min-width: 0;
}

.strategy-table-scroll-shell::before,
.strategy-table-scroll-shell::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: var(--strategy-action-menu-overflow-space);
  width: 32px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 120ms ease;
  z-index: 3;
}

.strategy-table-scroll-shell::before {
  left: 0;
  background: linear-gradient(
    to right,
    color-mix(in srgb, var(--cp-color-surface) 78%, var(--cp-color-border-strong) 22%),
    transparent
  );
}

.strategy-table-scroll-shell::after {
  right: 130px;
  background: linear-gradient(
    to left,
    color-mix(in srgb, var(--cp-color-surface) 78%, var(--cp-color-border-strong) 22%),
    transparent
  );
}

.strategy-table-scroll-shell.can-scroll-left::before {
  opacity: 1;
}

.strategy-table-scroll-shell.can-scroll-right::after {
  opacity: 1;
}

.strategy-table-scroll {
  overflow-x: auto;
  overflow-y: visible;
  padding-bottom: var(--strategy-action-menu-overflow-space);
  margin-bottom: calc(-1 * var(--strategy-action-menu-overflow-space));
  border-radius: inherit;
  max-width: 100%;
  min-width: 0;
}

.strategy-table {
  --strategy-description-col-width: 320px;
  --strategy-confidence-col-width: 100px;
  --strategy-baseline-col-width: 100px;
  --strategy-current-col-width: 100px;
  --strategy-projected-col-width: 100px;
  --strategy-target-col-width: 100px;
  --strategy-trend-col-width: 50px;
  --strategy-days-col-width: 50px;
  --strategy-actions-col-width: 130px;
  --strategy-kr-indent: 40px;
  --strategy-hypothesis-indent: 64px;
  --strategy-initiative-indent: 88px;
  --strategy-table-min-width: calc(
    var(--strategy-description-col-width) +
      var(--strategy-confidence-col-width) +
      var(--strategy-confidence-col-width) +
      var(--strategy-baseline-col-width) +
      var(--strategy-current-col-width) +
      var(--strategy-projected-col-width) +
      var(--strategy-target-col-width) +
      var(--strategy-baseline-col-width) +
      var(--strategy-current-col-width) +
      var(--strategy-projected-col-width) +
      var(--strategy-target-col-width) +
      var(--strategy-trend-col-width) +
      var(--strategy-days-col-width) +
      var(--strategy-actions-col-width)
  );
  width: max(100%, var(--strategy-table-min-width));
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: var(--cp-size-secondary);
}

.strategy-table__col-description {
  width: var(--strategy-description-col-width);
}

.strategy-table__col-confidence {
  width: var(--strategy-confidence-col-width);
}

.strategy-table__col-baseline {
  width: var(--strategy-baseline-col-width);
}

.strategy-table__col-current {
  width: var(--strategy-current-col-width);
}

.strategy-table__col-projected {
  width: var(--strategy-projected-col-width);
}

.strategy-table__col-target {
  width: var(--strategy-target-col-width);
}

.strategy-table__col-trend {
  width: var(--strategy-trend-col-width);
}

.strategy-table__col-days {
  width: var(--strategy-days-col-width);
}

.strategy-table__col-actions {
  width: var(--strategy-actions-col-width);
}

.strategy-table th,
.strategy-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--cp-color-border-subtle);
}

.strategy-table th {
  vertical-align: top;
}

.strategy-table td {
  vertical-align: middle;
}

.strategy-table th:first-child,
.strategy-table td:first-child {
  width: var(--strategy-description-col-width);
  min-width: var(--strategy-description-col-width);
  max-width: var(--strategy-description-col-width);
  overflow: hidden;
}

.strategy-table__actions-col {
  position: sticky;
  right: -1px;
  z-index: 5;
  width: var(--strategy-actions-col-width);
  min-width: var(--strategy-actions-col-width);
  text-align: center;
  background: var(--cp-color-surface-subtle);
  box-shadow: -1px 0 0 var(--cp-color-border-subtle);
}

.strategy-table__confidence-col {
  width: var(--strategy-confidence-col-width);
  text-align: center;
}

.strategy-table__trend-col {
  width: var(--strategy-trend-col-width);
  min-width: var(--strategy-trend-col-width);
  text-align: center;
}

.strategy-table th {
  background: var(--cp-color-surface-subtle);
  color: var(--cp-color-text-secondary);
  font-weight: 600;
  text-align: left;
  white-space: nowrap;
  background-clip: padding-box;
}

.strategy-table thead tr:first-child th:first-child {
  border-top-left-radius: 16px;
}

.strategy-table thead tr:first-child th:last-child {
  border-top-right-radius: 16px;
}

.strategy-table th:nth-child(4),
.strategy-table th:nth-child(5),
.strategy-table th:nth-child(6),
.strategy-table th:nth-child(7),
.strategy-table th:nth-child(8),
.strategy-table th:nth-child(9),
.strategy-table th:nth-child(10),
.strategy-table th:nth-child(11),
.strategy-table td:nth-child(4),
.strategy-table td:nth-child(5),
.strategy-table td:nth-child(6),
.strategy-table td:nth-child(7),
.strategy-table td:nth-child(8),
.strategy-table td:nth-child(9),
.strategy-table td:nth-child(10),
.strategy-table td:nth-child(11) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.strategy-table th:nth-child(6),
.strategy-table th:nth-child(7),
.strategy-table th:nth-child(8),
.strategy-table th:nth-child(9),
.strategy-table th:nth-child(10),
.strategy-table th:nth-child(11),
.strategy-table td:nth-child(6),
.strategy-table td:nth-child(7),
.strategy-table td:nth-child(8),
.strategy-table td:nth-child(9),
.strategy-table td:nth-child(10),
.strategy-table td:nth-child(11) {
  white-space: nowrap;
}

.strategy-table__days-col,
.strategy-table__days-cell {
  width: var(--strategy-days-col-width);
  min-width: var(--strategy-days-col-width);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.strategy-table th.strategy-table__days-col {
  text-align: right;
}

.strategy-table tbody tr:last-child td {
  border-bottom: 0;
}

.strategy-table__node {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--cp-color-text-primary);
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.strategy-table__objective-main {
  display: flex;
  align-items: center;
  gap: 2px;
  width: 100%;
  min-width: 0;
}

.strategy-table__collapse-slot {
  width: 28px;
  height: 28px;
  display: inline-flex;
  flex: 0 0 28px;
}

.strategy-table__node i {
  color: var(--cp-color-text-muted);
  flex: 0 0 auto;
}

.strategy-table__node--objective {
  display: flex;
  font-weight: 600;
  overflow: hidden;
}

.strategy-table__title-link {
  display: flex;
  align-items: center;
  flex: 1 1 0;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: inherit;
  text-align: left;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  cursor: pointer;
}

.strategy-table__title-link:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.strategy-table__title-link:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cp-color-accent) 70%, white 30%);
  outline-offset: 2px;
  border-radius: 6px;
}

.strategy-table__objective-title {
  display: block;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  flex: 1 1 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.strategy-objective-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  min-width: 0;
}

.strategy-objective-alignment {
  --strategy-kr-align-outline: color-mix(
    in srgb,
    var(--cp-color-border-strong) 78%,
    var(--cp-color-text-secondary) 22%
  );
  margin-left: 72px;
  margin-bottom: 6px;
  padding: 6px 8px;
  border: 1px solid var(--strategy-kr-align-outline);
  border-radius: 12px;
  background: transparent;
  color: var(--cp-color-text-secondary);
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--cp-size-secondary);
  cursor: pointer;
  text-align: left;
  position: relative;
  width: calc(100% - 72px);
  max-width: clamp(220px, 34vw, 440px);
  min-width: 0;
  box-sizing: border-box;
  overflow: visible;
}

.strategy-objective-alignment > i {
  flex: 0 0 auto;
  position: relative;
}

.strategy-objective-alignment > i::before {
  content: "";
  position: absolute;
  left: -14px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 6px solid var(--strategy-kr-align-outline);
  pointer-events: none;
}

.strategy-objective-alignment > span {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1 1 auto;
}

.strategy-objective-alignment::before {
  content: "";
  position: absolute;
  top: calc(50% - 0.5px);
  left: -36.5px;
  width: 32px;
  border-top: 1px solid var(--strategy-kr-align-outline);
  pointer-events: none;
}

.strategy-objective-alignment::after {
  content: "";
  position: absolute;
  top: 16px;
  left: -36.5px;
  width: 0;
  height: calc(50% + 12px);
  border-left: 1px solid var(--strategy-kr-align-outline);
  pointer-events: none;
}

.strategy-objective-alignment:hover {
  color: var(--cp-color-text-primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.strategy-objective-alignment:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cp-color-accent) 70%, white 30%);
  outline-offset: 2px;
  border-radius: 6px;
}

.strategy-kr-alignment {
  --kr-align-rise: 0px;
  margin-top: 4px;
  margin-left: 36px;
  padding-left: 74px;
  border: 0;
  background: transparent;
  color: var(--cp-color-text-secondary);
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--cp-size-secondary);
  text-align: left;
  position: relative;
  width: calc(100% - 36px);
  max-width: calc(100% - 36px);
  min-width: 0;
  box-sizing: border-box;
}

.strategy-kr-alignment > span {
  display: block;
  max-width: clamp(140px, 22vw, 300px);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1 1 auto;
}

.strategy-kr-alignment:nth-of-type(n+2) {
  --kr-align-rise: 17px;
}

.strategy-kr-alignment::before {
  content: "";
  position: absolute;
  left: 10px;
  top: calc(-4px - var(--kr-align-rise));
  width: 64px;
  height: calc(16px + var(--kr-align-rise));
  border-left: 1px solid var(--cp-color-text-muted);
  border-bottom: 1px solid var(--cp-color-text-muted);
  pointer-events: none;
}

.strategy-kr-alignment::after {
  content: "";
  position: absolute;
  left: 6.5px;
  top: -5px;
  width: 0;
  height: 0;
  border-bottom: 6px solid var(--cp-color-text-muted);
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  pointer-events: none;
}

.strategy-kr-alignment:nth-of-type(n+2)::after {
  display: none;
}

.strategy-kr-alignment-card {
  --strategy-kr-align-outline: color-mix(
    in srgb,
    var(--cp-color-border-strong) 78%,
    var(--cp-color-text-secondary) 22%
  );
  margin-top: 6px;
  margin-left: 72px;
  width: calc(100% - 72px);
  max-width: clamp(220px, 34vw, 440px);
  border: 1px solid var(--strategy-kr-align-outline);
  border-radius: 12px;
  background: transparent;
  position: relative;
}

.strategy-kr-alignment-card::before {
  content: "";
  position: absolute;
  top: calc(50% );
  left: -27px;
  width: 26px;
  border-top: 1px solid var(--strategy-kr-align-outline);
  pointer-events: none;
}

.strategy-kr-alignment-card::after {
  content: "";
  position: absolute;
  top: -7px;
  left: -27px;
  width: 0;
  height: calc(50% + 7px);
  border-left: 1px solid var(--strategy-kr-align-outline);
  pointer-events: none;
}

.strategy-kr-alignment-card__header::before {
  content: "";
  position: absolute;
  left: -30.5px;
  top: -8px;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 6px solid var(--strategy-kr-align-outline);
  pointer-events: none;
}

.strategy-kr-alignment-card__header {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 6px 8px;
}

.strategy-kr-alignment-card__icon {
  color: var(--cp-color-text-muted);
  flex: 0 0 auto;
  line-height: 1;
}

.strategy-kr-alignment-card__title,
.strategy-kr-alignment-card__item {
  border: 0;
  background: transparent;
  color: var(--cp-color-text-secondary);
  padding: 0;
  margin: 0;
  font-size: var(--cp-size-secondary);
  text-align: left;
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.strategy-kr-alignment-card__title:hover,
.strategy-kr-alignment-card__item:hover {
  color: var(--cp-color-text-primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.strategy-kr-alignment-card__title:focus-visible,
.strategy-kr-alignment-card__item:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cp-color-accent) 70%, white 30%);
  outline-offset: 2px;
  border-radius: 6px;
}

.strategy-kr-alignment-card__list {
  display: grid;
  gap: 2px;
  padding: 0 8px 8px 30px;
}

.alignment-ladder {
  min-width: max-content;
  width: 100%;
  justify-items: center;
}

.alignment-ladder__pane {
  max-height: min(72vh, 760px);
  overflow: hidden;
  padding: 8px;
  border: 1px solid var(--cp-color-border-subtle);
  border-radius: 12px;
  background: var(--cp-color-surface-subtle);
}

.alignment-ladder__row {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

.alignment-ladder__level-wrap {
  display: flex;
  width: fit-content;
  max-width: 100%;
  justify-content: center;
}

.alignment-ladder__level {
  display: inline-block;
  width: fit-content;
  max-width: min(560px, 82vw);
}

.alignment-ladder .org-callout {
  padding: 8px 10px;
}

.alignment-ladder__line {
  width: 1px;
  height: 18px;
  margin: 2px auto;
  background: var(--cp-color-border-strong);
  position: relative;
}

.alignment-ladder__line--to-kr {
  width: 1px;
  background: var(--cp-color-border-subtle);
}

.alignment-ladder__line--alignment {
  width: 2px;
  height: 25px;
  margin-top: -4px;
  background: var(--cp-color-text-muted);
}

.alignment-ladder__line--alignment::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -7px;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 7px solid var(--cp-color-text-muted);
}

.alignment-ladder__objective {
  background: var(--cp-color-surface);
  width: max-content;
  padding: 10px 12px;
}

.alignment-ladder__kr {
  background: color-mix(in srgb, var(--cp-color-accent-subtle) 65%, white 35%);
  border-color: color-mix(in srgb, var(--cp-color-accent) 45%, var(--cp-color-border-subtle) 55%);
  padding: 6px 10px;
}

.alignment-ladder__kr-row {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: start;
  gap: 12px;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
}

.alignment-ladder__kr-grid {
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-wrap: nowrap;
  width: max-content;
}

.alignment-ladder__kr-row--all {
  display: flex;
  justify-content: center;
}

.alignment-ladder__kr-side {
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  min-height: 1px;
}

.alignment-ladder__kr-side--left {
  justify-content: flex-end;
}

.alignment-ladder__kr-side--right {
  justify-content: flex-start;
}

.alignment-ladder__kr-side--all {
  justify-content: center;
  flex-wrap: wrap;
}

.alignment-ladder__kr-center {
  display: inline-flex;
  justify-content: center;
}

.alignment-ladder__kr-item {
  position: relative;
  width: clamp(10rem, 18vw, 24ch);
  max-width: clamp(10rem, 18vw, 24ch);
  overflow: hidden;
}

.alignment-ladder__kr-item p {
  font-size: 0.82rem;
  line-height: 1.25;
}

.alignment-ladder__kr-text {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.alignment-ladder__kr-item--left::before,
.alignment-ladder__kr-item--right::before {
  content: none;
}

.alignment-ladder__kr-item--left::after,
.alignment-ladder__kr-item--right::after {
  content: none;
}

.alignment-ladder__svg {
  display: block;
  min-width: max-content;
  touch-action: pan-x pan-y;
}

.alignment-ladder__svg-hitarea {
  fill: transparent;
}

.alignment-ladder__zoom-wrap {
  position: relative;
  width: 100%;
  height: min(72vh, 760px);
  min-height: 320px;
}

.alignment-ladder__zoom-controls {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--cp-color-border-subtle);
  border-radius: 8px;
  background: color-mix(in srgb, var(--cp-color-surface) 90%, white 10%);
}

.alignment-ladder__zoom-scroll {
  width: 100%;
  height: 100%;
  overflow: auto;
  padding-top: 36px;
}

.alignment-ladder__zoom-canvas {
  width: max-content;
  min-width: max-content;
}

.alignment-ladder__zoom-btn {
  border: 1px solid var(--cp-color-border-subtle);
  background: var(--cp-color-surface);
  color: var(--cp-color-text-primary);
  border-radius: 6px;
  min-width: 36px;
  height: 28px;
  font-size: 12px;
  line-height: 1;
}

.alignment-ladder__zoom-btn--reset {
  min-width: 78px;
  padding: 0 8px;
}

.alignment-ladder__zoom-label {
  min-width: 40px;
  text-align: right;
  color: var(--cp-color-text-secondary);
  font-size: 12px;
  font-weight: 500;
}

.alignment-ladder__zoom-btn:hover {
  border-color: var(--cp-color-accent);
}

.alignment-ladder__edge {
  stroke: var(--cp-color-text-muted);
  stroke-width: 1.5;
  transition: opacity 0.18s ease;
  pointer-events: none;
}

.alignment-ladder__edge--faded {
  opacity: 0.36;
}

.alignment-ladder__arrowhead {
  fill: var(--cp-color-text-muted);
}

.alignment-ladder__node,
.alignment-ladder__kr-pill {
  cursor: pointer;
  transition: opacity 0.18s ease;
}

.alignment-ladder__node-action {
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}

.alignment-ladder__node:hover .alignment-ladder__node-action,
.alignment-ladder__node:focus-within .alignment-ladder__node-action {
  opacity: 1;
  pointer-events: auto;
}

.alignment-ladder__node-action-rect {
  fill: var(--cp-color-surface);
  stroke: var(--cp-color-border-subtle);
  stroke-width: 1;
}

.alignment-ladder__node-action-icon {
  fill: var(--cp-color-text-secondary);
  font-size: 12px;
  font-weight: 600;
}

.alignment-ladder__node-action:hover .alignment-ladder__node-action-rect,
.alignment-ladder__node-action:focus-visible .alignment-ladder__node-action-rect {
  stroke: var(--cp-color-accent);
}

.alignment-ladder__node:focus-visible .alignment-ladder__node-rect,
.alignment-ladder__kr-pill:focus-visible .alignment-ladder__kr-rect {
  stroke: var(--cp-color-focus-ring);
  stroke-width: 2;
}

.alignment-ladder__node--faded,
.alignment-ladder__kr-pill--faded {
  opacity: 0.42;
}

.alignment-ladder__node-rect {
  fill: var(--cp-color-surface);
  stroke: var(--cp-color-border-subtle);
  stroke-width: 1;
}

.alignment-ladder__node--selected .alignment-ladder__node-rect {
  stroke: var(--cp-color-accent);
  stroke-width: 2;
}

.alignment-ladder__node--compact .alignment-ladder__node-rect {
  stroke: color-mix(in srgb, var(--cp-color-border-subtle) 80%, var(--cp-color-text-muted) 20%);
}

.alignment-ladder__node--compact .alignment-ladder__scope-label {
  font-size: 11px;
}

.alignment-ladder__node--compact .alignment-ladder__objective-title {
  font-size: 12px;
}

.alignment-ladder__scope-meta {
  fill: var(--cp-color-text-secondary);
  font-size: 12px;
  font-weight: 500;
  pointer-events: none;
}

.alignment-ladder__scope-icon-glyph {
  font-family: "bootstrap-icons";
  font-weight: 400;
}

.alignment-ladder__scope-label {
  fill: var(--cp-color-text-secondary);
  font-size: 12px;
  font-weight: 500;
}

.alignment-ladder__objective-title {
  fill: var(--cp-color-text-primary);
  font-size: 13px;
  font-weight: 600;
}

.alignment-ladder__node-to-kr {
  stroke: var(--cp-color-border-subtle);
  stroke-width: 1;
}

.alignment-ladder__kr-rect {
  fill: color-mix(in srgb, var(--cp-color-accent-subtle) 65%, white 35%);
  stroke: color-mix(in srgb, var(--cp-color-accent) 45%, var(--cp-color-border-subtle) 55%);
  stroke-width: 1;
}

.alignment-ladder__kr-hitbox {
  fill: transparent;
  pointer-events: all;
}

.alignment-ladder__kr-fade {
  pointer-events: none;
}

.alignment-ladder__kr-scroll-btn {
  cursor: pointer;
}

.alignment-ladder__kr-scroll-btn circle {
  fill: color-mix(in srgb, var(--cp-color-surface) 90%, white 10%);
  stroke: var(--cp-color-border-subtle);
  stroke-width: 1;
}

.alignment-ladder__kr-scroll-btn:hover circle,
.alignment-ladder__kr-scroll-btn:focus-visible circle {
  stroke: var(--cp-color-accent);
}

.alignment-ladder__kr-scroll-btn-icon {
  fill: var(--cp-color-text-secondary);
  font-size: 13px;
  font-weight: 700;
  pointer-events: none;
}

.alignment-ladder__kr-scroll-btn--disabled {
  cursor: default;
}

.alignment-ladder__kr-scroll-btn--disabled circle {
  fill: color-mix(in srgb, var(--cp-color-surface-subtle) 92%, white 8%);
  stroke: var(--cp-color-border-subtle);
}

.alignment-ladder__kr-scroll-btn--disabled .alignment-ladder__kr-scroll-btn-icon {
  fill: var(--cp-color-text-muted);
}

.alignment-ladder__kr-pill--selected .alignment-ladder__kr-rect {
  stroke: var(--cp-color-accent);
  stroke-width: 2;
}

.alignment-ladder__kr-text {
  fill: var(--cp-color-text-primary);
  font-size: 12px;
  font-weight: 500;
}

.strategy-table__node--kr {
  display: flex;
  align-items: center;
  width: calc(100% - var(--strategy-kr-indent));
  max-width: calc(100% - var(--strategy-kr-indent));
  min-width: 0;
  margin-left: var(--strategy-kr-indent);
  overflow: hidden;
}

.strategy-table__kr-title {
  display: block;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  flex: 1 1 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.strategy-table__node--hypothesis {
  display: flex;
  align-items: center;
  width: calc(100% - var(--strategy-hypothesis-indent));
  max-width: calc(100% - var(--strategy-hypothesis-indent));
  min-width: 0;
  margin-left: var(--strategy-hypothesis-indent);
  overflow: hidden;
}

.strategy-table__hypothesis-title {
  display: block;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  flex: 1 1 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.strategy-table__node--initiative {
  display: flex;
  align-items: center;
  width: calc(100% - var(--strategy-initiative-indent));
  max-width: calc(100% - var(--strategy-initiative-indent));
  min-width: 0;
  margin-left: var(--strategy-initiative-indent);
  overflow: hidden;
}

.strategy-table__initiative-title {
  display: block;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  flex: 1 1 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.strategy-table__row--objective td {
  background: color-mix(in srgb, var(--cp-color-accent-subtle) 25%, white 75%);
}

.strategy-table__row--objective td:first-child {
  padding-left: 8px;
}

.strategy-table__actions-cell {
  position: sticky;
  right: -1px;
  z-index: 4;
  width: var(--strategy-actions-col-width);
  min-width: var(--strategy-actions-col-width);
  text-align: center;
  background: var(--cp-color-surface);
  box-shadow: -1px 0 0 var(--cp-color-border-subtle);
}

.strategy-table__actions-cell:has(.cp-action-menu.is-open) {
  z-index: 20;
}

.strategy-table__confidence-cell {
  text-align: center;
  vertical-align: middle;
}

.strategy-table__trend-cell {
  text-align: center;
  vertical-align: middle;
}

.strategy-table__action-group {
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
  gap: 2px;
  width: 112px;
}

.strategy-table__actions-cell::after {
  content: "";
  position: absolute;
  top: 0;
  right: -2px;
  bottom: 0;
  width: 2px;
  background: inherit;
  pointer-events: none;
}

.strategy-table__action-slot {
  width: 44px;
  height: 32px;
  display: inline-flex;
}

.strategy-table__row--objective .strategy-table__actions-cell {
  background: color-mix(in srgb, var(--cp-color-accent-subtle) 25%, white 75%);
}

.strategy-table__actions-cell .cp-btn:not(.cp-action-menu__trigger) {
  min-width: 32px;
  width: 32px;
  padding-left: 0;
  padding-right: 0;
}

.strategy-note {
  margin: 0;
  color: var(--cp-color-text-secondary);
  font-size: var(--cp-size-secondary);
}

.strategy-confidence-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  width: 32px;
  height: 32px;
  background: hsl(var(--cp-confidence-hue), 68%, 88%);
  border: 1px solid hsl(var(--cp-confidence-hue), 56%, 72%);
  color: hsl(var(--cp-confidence-hue), 56%, 28%);
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.01em;
}

.strategy-confidence-chip--none {
  background: var(--cp-color-surface-subtle);
  border-color: var(--cp-color-border-subtle);
}

.strategy-confidence-chip--ghost {
  visibility: hidden;
}

.strategy-kr-risk-meta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 32px;
}

.strategy-kr-metric-meta__rag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.strategy-rag-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  width: 32px;
  height: 32px;
  border: 1px solid transparent;
  vertical-align: middle;
}

.strategy-rag-chip--green {
  background: color-mix(
    in srgb,
    var(--cp-color-status-on-track) 18%,
    var(--cp-color-surface) 82%
  );
  border-color: color-mix(
    in srgb,
    var(--cp-color-status-on-track) 42%,
    var(--cp-color-surface) 58%
  );
}

.strategy-rag-chip--amber {
  background: var(--cp-color-status-at-risk-subtle);
  border-color: color-mix(
    in srgb,
    var(--cp-color-status-at-risk-subtle) 65%,
    var(--cp-color-status-at-risk) 35%
  );
}

.strategy-rag-chip--red {
  background: color-mix(
    in srgb,
    var(--cp-color-status-off-track) 18%,
    var(--cp-color-surface) 82%
  );
  border-color: color-mix(
    in srgb,
    var(--cp-color-status-off-track) 42%,
    var(--cp-color-surface) 58%
  );
}

.strategy-rag-chip--unknown {
  background: var(--cp-color-surface-subtle);
  border-color: var(--cp-color-border-subtle);
}

.strategy-kr-trend {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  line-height: 1;
}

.strategy-kr-trend.is-positive {
  color: var(--cp-color-status-on-track);
}

.strategy-kr-trend.is-negative {
  color: var(--cp-color-status-off-track);
}

.strategy-kr-trend.is-flat,
.strategy-kr-trend--empty {
  color: var(--cp-color-text-secondary);
}

.strategy-kr-trend__icon {
  font-size: 1em;
  line-height: 1;
}

.strategy-kr-value-input {
  display: flex;
  align-items: center;
  gap: 8px;
}

.strategy-kr-value-input__field {
  min-width: 0;
}

.strategy-kr-value-input__suffix {
  color: var(--cp-color-text-secondary);
  font-weight: 600;
  line-height: 1;
}

@media (max-width: 1100px) {
  .strategy-layout {
    grid-template-columns: 1fr;
  }
}