
/* App-wide: no text caret on non-editable clicks. */
html, body {
  caret-color: transparent;
}
input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]),
textarea,
[contenteditable="true"],
[contenteditable=""] {
  caret-color: auto;
}

body {
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: var(--app-body-size);
  line-height: var(--app-line-height);
  background: #f2f4f7;
  color: var(--app-text);
  margin: 0;
  padding: 18px 22px max(5rem, calc(76px + env(safe-area-inset-bottom, 0px)));
  box-sizing: border-box;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* Required-field asterisks (templates + KesheroRequiredFields in _footer_watermark.html). */
.required-star {
  color: var(--app-action-danger) !important;
  display: inline;
  font-weight: 800;
  line-height: 1;
  margin-left: 2px;
  vertical-align: baseline;
}

:where(label:has(> .required-star):has(> input),
  label:has(> .required-star):has(> select),
  label:has(> .required-star):has(> textarea),
  label:has(> .required-star):has(> .keshero-date-format-field)) {
  display: block !important;
}

:where(label:has(> .required-star) > input,
  label:has(> .required-star) > select,
  label:has(> .required-star) > textarea,
  label:has(> .required-star) > .keshero-date-format-field) {
  margin-top: 6px;
}
hr,
.app-section-divider,
[class*="__divider"],
[class*="-divider"] {
  border: 0;
  border-top: var(--app-divider-line) !important;
}

.inbox-toolbar__divider {
  border-top: 0 !important;
}

.checkin-detail__section,
.checkin-hub-action-group + .checkin-hub-action-group,
.checkin-session-action-group + .checkin-session-action-group,
.profile-appearance-header,
.profile-controls-grid--photo,
.profile-avatar-preview--editor .profile-controls-grid--avatar-colors {
  border-top: var(--app-divider-line) !important;
}

.app-progress-track {
  background: var(--app-progress-track);
  border-radius: 999px;
  container-type: inline-size;
  overflow: hidden;
}

.app-progress-fill {
  background-color: transparent;
  background-image: var(--app-progress-gradient);
  background-position: left center;
  background-repeat: no-repeat;
  /* Map the gradient across the full track; the fill width reveals that slice. */
  background-size: 100cqw;
  display: block;
  height: 100%;
}

.app-progress-label-on-fill {
  color: var(--app-progress-label-on-fill);
  text-shadow: var(--app-progress-label-shadow);
}
/* Shared work-progress presentation. Labels follow the completed portion and
   move just beyond it when there is not enough room for readable white text.
   The fill gradient is sized to the full track so early progress stays cyan/blue
   and purple only appears as completion approaches 100%. */
.app-progress-bar {
  --app-progress-pct: 0%;
  background: var(--app-progress-track);
  border-radius: 999px;
  container-type: inline-size;
  height: 20px;
  overflow: visible;
  position: relative;
  width: 100%;
}

.app-progress-bar__fill {
  background-color: transparent;
  background-image: var(--app-progress-gradient);
  background-position: left center;
  background-repeat: no-repeat;
  background-size: 100cqw;
  border-radius: inherit;
  display: block;
  height: 100%;
  overflow: hidden;
  transition: width 160ms ease;
  width: var(--app-progress-pct);
}

.app-progress-bar__label {
  color: var(--app-progress-label-on-fill);
  font-size: 12px;
  font-weight: 800;
  left: var(--app-progress-pct);
  line-height: 1;
  position: absolute;
  text-align: right;
  text-shadow: var(--app-progress-label-shadow);
  top: 50%;
  transform: translate(calc(-100% - 4px), -50%);
  white-space: nowrap;
  z-index: 1;
}

.app-progress-bar.is-low-progress .app-progress-bar__label {
  color: #101828;
  left: min(calc(var(--app-progress-pct) + 6px), calc(100% - 22px));
  text-align: left;
  text-shadow: none;
  transform: translateY(-50%);
}

.assignment-action-status {
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  color: #b42318;
  display: block;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
  margin: 8px 0 0;
  padding: 8px 10px;
}

.assignment-action-status.is-success {
  background: #ecfdf3;
  border-color: #b8ebd4;
  color: #027a48;
}

.assignment-action-status[hidden] {
  display: none;
}

.employee-detail-inline-status {
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  color: #b42318;
  display: block;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
  padding: 8px 10px;
}

.employee-detail-inline-status[hidden] {
  display: none;
}

.task-category-picker {
  display: grid;
  gap: 6px;
}

.task-category-picker__control {
  align-items: stretch;
  display: flex;
  gap: 6px;
  min-width: 0;
  position: relative;
  width: 100%;
}

.task-category-picker__control input {
  border-radius: 8px !important;
  flex: 1 1 auto;
  min-height: 38px;
  min-width: 0;
}

.task-category-picker__control input::-webkit-calendar-picker-indicator,
.task-category-picker__control input::-webkit-list-button {
  display: none !important;
  opacity: 0 !important;
}

.task-category-picker__add,
button.task-category-picker__add.button-add-small,
button.task-category-picker__add.button-add-small.button-icon-only {
  align-items: center !important;
  align-self: stretch;
  aspect-ratio: 1 !important;
  background: var(--app-success-surface);
  border: 1px solid var(--app-success-border);
  border-radius: 8px;
  box-sizing: border-box !important;
  color: var(--app-success-fg);
  cursor: pointer;
  display: inline-grid !important;
  flex: 0 0 var(--app-control-height, 38px);
  font: inherit;
  font-size: 24px !important;
  font-weight: 700 !important;
  height: var(--app-control-height, 38px) !important;
  justify-content: center !important;
  line-height: 1 !important;
  max-height: none !important;
  max-width: none !important;
  min-height: var(--app-control-height, 38px) !important;
  min-width: var(--app-control-height, 38px) !important;
  /* Optical center: bold + sits slightly low — lift it. */
  padding: 0 0 4px 0 !important;
  place-items: center !important;
  text-align: center !important;
  width: var(--app-control-height, 38px) !important;
}

.task-category-picker__add:hover,
.task-category-picker__add:focus-visible,
button.task-category-picker__add.button-add-small:hover,
button.task-category-picker__add.button-add-small:focus-visible,
button.task-category-picker__add.button-add-small.button-icon-only:hover,
button.task-category-picker__add.button-add-small.button-icon-only:focus-visible {
  background: var(--app-success-surface-hover);
  border-color: var(--app-success-border-strong);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  color: var(--app-success-fg-hover);
  outline: none;
  transform: none !important;
}

.task-category-picker__hint {
  color: var(--app-muted);
  font-size: 11px;
  font-weight: 700;
}

.task-category-picker__suggestions {
  background: var(--ks-field-dropdown-bg, #fff);
  border: 1px solid var(--ks-field-border, #d0d7e2);
  border-radius: 10px;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16);
  box-sizing: border-box;
  display: grid;
  gap: 3px;
  left: 0;
  margin-top: 6px;
  max-height: min(260px, 45vh);
  min-width: 100%;
  overflow: auto;
  padding: 6px;
  position: absolute;
  top: 100%;
  z-index: 10000;
}

.task-category-picker__suggestions[hidden] {
  display: none;
}

.task-category-picker__suggestion {
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--ks-field-text, #101828);
  cursor: pointer;
  font: inherit;
  font-weight: 400 !important;
  min-height: 32px;
  overflow-wrap: anywhere;
  padding: 8px 10px;
  text-align: left;
  width: 100%;
}

.task-category-picker__suggestion:hover,
.task-category-picker__suggestion:focus-visible {
  background: var(--ks-field-dropdown-hover, #eef8ff);
  outline: none;
}

.task-category-chip-list {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 24px;
}

.task-category-chip {
  align-items: center;
  background: #eefbff;
  border: 1px solid #93e7fb;
  border-radius: 999px;
  color: #155e75;
  display: inline-flex;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  gap: 5px;
  min-height: 24px;
  padding: 4px 8px;
}

.task-category-chip.is-selected {
  background: #ede9fe;
  border-color: #c4b5fd;
  color: #5b21b6;
}

button.task-category-chip {
  cursor: pointer;
}

.task-category-chip__edit {
  align-items: center;
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid currentColor;
  border-radius: 999px;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  height: 18px;
  justify-content: center;
  line-height: 0;
  padding: 0;
  width: 18px;
}

.task-category-chip__edit svg {
  display: block;
  fill: none;
  height: 11px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
  width: 11px;
}

:root {
  /* Keshero brand palette (reference + reuse across UI) */
  --keshero-teal: #2ec5ff;
  --keshero-cyan-glow: #6fe3ff;
  --keshero-indigo: #5a4bff;
  --keshero-blue: #3a7bff;
  --keshero-dark-blue: #075985;
  --keshero-purple: #8a2be2;
  --keshero-violet-glow: #b57cff;
  --keshero-red: #ff4d5a;
  --keshero-light-red: #ff9aa2;
  --keshero-burgundy: #800020;
  --keshero-burgundy-hover: #5c0018;
  --keshero-light-burgundy: #c99aaa;
  --keshero-yellow: #ffc857;
  --keshero-light-yellow: #ffe7a3;
  --keshero-green: #34c38f;
  --keshero-light-green: #a8e6cf;

  /* All numbered sequence and field markers use one solid company color. */
  --app-numbered-marker-bg: var(--keshero-dark-blue);
  --app-numbered-marker-border: var(--keshero-dark-blue);
  --app-numbered-marker-fg: #ffffff;

  --app-progress-start: var(--keshero-cyan-glow);
  --app-progress-end: var(--keshero-purple);
  --app-progress-gradient: linear-gradient(90deg, var(--app-progress-start) 0%, var(--app-progress-end) 100%);
  --app-progress-track: #dbeafe;
  --app-progress-label-on-fill: #ffffff;
  --app-progress-label-shadow: 0 1px 2px rgba(15, 23, 42, 0.55);

  --app-surface: #ffffff;
  --app-surface-muted: #f8fafc;
  --app-border: #cbd5e1;
  --app-border-soft: #d8e1eb;
  --app-divider-color: #5a4bff;
  --app-divider-line: 3px solid var(--app-divider-color);
  --app-logo-tile-color: #ffffff;
  --app-logo-tile-opacity: 1;
  --app-container-border: #cbd5e1;
  --app-container-shadow: 0 1px 0 rgba(255, 255, 255, 0.86) inset, 0 12px 28px rgba(15, 23, 42, 0.07);
  --app-container-shadow-hover: 0 1px 0 rgba(255, 255, 255, 0.9) inset, 0 16px 34px rgba(15, 23, 42, 0.105);
  --app-text: #182230;
  --app-heading: #0f172a;
  --app-muted: #667085;
  --app-shadow-card: 0 10px 24px rgba(15, 23, 42, 0.055);
  --app-shadow-card-hover: 0 14px 32px rgba(15, 23, 42, 0.09);
  --app-radius-card: 8px;
  --app-radius-control: 6px;
  --app-card-padding: 14px;
  --app-table-border: #e4e7ec;
  --app-table-header-bg: #f8fafc;
  --app-table-header-text: #344054;
  --app-table-row-hover: #f2fcff;
  --app-table-stripe: #fcfdff;
  --app-action-primary: var(--keshero-teal);
  --app-action-primary-hover: #20b5e8;
  --app-action-primary-border: #14a8d4;
  --app-action-primary-glow: var(--keshero-cyan-glow);
  --app-action-secondary: #ffffff;
  --app-action-secondary-hover: #f8fafc;
  --app-action-danger: var(--keshero-red);
  --app-action-danger-hover: #c5303c;
  --app-danger-surface: #fff5f6;
  --app-action-delete: var(--keshero-burgundy);
  --app-action-delete-hover: var(--keshero-burgundy-hover);
  --app-delete-surface: #faf2f5;
  --app-danger-border: #ffcdd2;
  --app-danger-border-strong: #ffb3bb;
  --app-success: var(--keshero-green);
  --app-success-fg: #0d6f52;
  --app-success-surface: #ecfdf5;
  --app-success-border: #b8ebd4;
  --app-success-surface-hover: #d1fae5;
  --app-success-fg-hover: #065f46;
  --app-success-border-strong: #6ee7b7;
  --app-warning: var(--keshero-yellow);
  --app-warning-surface: var(--keshero-light-yellow);
  --app-warning-border: #f5d78a;
  --app-accent-indigo: var(--keshero-indigo);
  --app-accent-blue: var(--keshero-blue);
  --app-accent-purple: var(--keshero-purple);
  --app-accent-violet-glow: var(--keshero-violet-glow);
  /* Accent pairings: indigo/blue = charts & secondary emphasis; purple/violet = Talent / succession chrome (not action buttons); yellow = non-blocking warning status (not action buttons); green = Add/Create buttons and positive KPIs.
     Action button system:
     - button-primary (teal): Search, Apply, primary submit
     - button-add-small (green): Add / Create / +
     - button-delete-small (burgundy): Delete (destructive entity actions)
     - button-danger-small (red): labeled Remove for standalone / high-stakes actions
     - app-icon-btn--danger (red ×): remove a dense list/row editor line item
     - button-neutral-action (gray): Clear / Cancel / Close
     - button-save-small (light blue): Save
     - button-archive (muted gray): Archive
  */
  --app-focus-ring: rgba(46, 197, 255, 0.32);
  --app-font-sans: "Segoe UI", Arial, Helvetica, sans-serif;
  --app-line-height: 1.48;
  --app-text-adjust: 0px;
  --app-text-adjust-small: 0px;
  --app-text-zoom: 1;
  --app-body-size: 13px;
  --app-h1-size: 28px;
  --app-h2-size: 22px;
  --app-h3-size: 17px;
  --app-control-height: 38px;
  --app-textarea-min-height: calc(var(--app-control-height) * 2);
  --keshero-cursor-default: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='5' y1='3' x2='25' y2='28' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23000000'/%3E%3Cstop offset='.5' stop-color='%23000000'/%3E%3Cstop offset='1' stop-color='%23000000'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M5 3 25 15 16.4 18.2Q15.1 18.7 14.5 20L12.1 27.2Q11.4 29 10.2 27.3Z' fill='none' stroke='white' stroke-width='6' stroke-linejoin='round' stroke-linecap='round'/%3E%3Cpath d='M5 3 25 15 16.4 18.2Q15.1 18.7 14.5 20L12.1 27.2Q11.4 29 10.2 27.3Z' fill='url(%23g)' stroke='url(%23g)' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") 5 3, auto;
  --keshero-cursor-pointer: var(--keshero-cursor-default);
  --keshero-cursor-primary: #000000;
  --keshero-cursor-secondary: #000000;
}

html[data-keshero-text-size] {
  /* Tokens are applied live via --app-* CSS variables from theme bootstrap. */
}

html[data-keshero-text-size="12"] {
  --app-text-adjust: -1px;
  --app-text-adjust-small: -0.5px;
  --app-text-zoom: 0.923;
  --app-body-size: 12px;
  --app-h1-size: 26px;
  --app-h2-size: 20px;
  --app-h3-size: 16px;
}

html[data-keshero-text-size="15"] {
  --app-text-adjust: 2px;
  --app-text-adjust-small: 1px;
  --app-text-zoom: 1.154;
  --app-body-size: 15px;
  --app-h1-size: 32px;
  --app-h2-size: 25px;
  --app-h3-size: 20px;
}

html[data-keshero-text-size="18"] {
  --app-text-adjust: 5px;
  --app-text-adjust-small: 2px;
  --app-text-zoom: 1.385;
  --app-body-size: 18px;
  --app-h1-size: 39px;
  --app-h2-size: 30px;
  --app-h3-size: 24px;
}

body {
  font-size: var(--app-body-size);
}

html[data-keshero-text-size] :where(
  p, a, button, input, select, textarea, summary, label, th, td, li,
  .button-small, .button-primary, .button-secondary, .button-add-small, .button-danger-small, .profile-save-button,
  .app-topnav__label, .app-rounded-select__button, .app-rounded-select__option,
  .topbar-search__input, .ks-field__label, .pm-label-text
):not(.home-news-carousel__arrow):not(.home-news-carousel__dot):not(.home-news-carousel__toggle):not(.inline-help-button):not(.setup-checklist-launcher):not(.ezer-launcher):not(.in-app-help-bubble):not(.app-info-bubble):not(.keshboard-drawer__field-help):not(.development-item-creation-help__icon):not(.app-help-trigger__icon):not(.in-app-help-bubble__mark):not(.pm-field-help-button):not(.pr-edit-th-help) {
  font-size: calc(1em * var(--app-text-zoom, 1)) !important;
}

.app-rounded-select-source {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  height: 1px !important;
  margin: -1px !important;
  opacity: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

.app-rounded-select {
  box-sizing: border-box;
  display: block;
  min-width: 0;
  max-width: 100%;
  position: relative;
  width: 100%;
}

.app-rounded-select[hidden] {
  display: none !important;
}

.app-rounded-select__button {
  align-items: center;
  background: var(--ks-field-bg, #fff);
  border: 1px solid var(--ks-field-border, #d0d7e2);
  border-radius: var(--app-radius-control, 8px);
  color: var(--ks-field-text, #101828);
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: var(--app-control-font-size, 13px);
  font-weight: var(--app-control-font-weight, 400);
  gap: 10px;
  justify-content: space-between;
  box-sizing: border-box;
  line-height: 1.35;
  max-width: 100%;
  min-height: var(--app-control-height, 38px);
  min-width: 0;
  overflow: visible;
  padding: 8px 34px 8px 10px;
  position: relative;
  text-align: left;
  width: 100%;
}

.app-rounded-select__button:focus-visible {
  border-color: var(--ks-field-focus, #1aa6d6);
  box-shadow: 0 0 0 3px rgba(26, 166, 214, 0.18);
  outline: none;
}

.app-rounded-select__button:disabled {
  background: var(--ks-field-disabled-bg, #f2f4f7);
  color: var(--ks-field-disabled-text, #667085);
  cursor: not-allowed;
}

.app-rounded-select__label {
  display: block;
  flex: 1 1 auto;
  line-height: 1.35;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  padding-block: 2px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-rounded-select.is-placeholder .app-rounded-select__button,
.app-rounded-select.is-placeholder .app-rounded-select__label,
.app-rounded-select__option.is-placeholder-option {
  color: var(--ks-field-placeholder, #98a2b3);
}

.app-rounded-select__chevron {
  border-bottom: 2px solid #667085;
  border-right: 2px solid #667085;
  height: 8px;
  pointer-events: none;
  position: absolute;
  right: 12px;
  top: calc(50% - 6px);
  transform: rotate(45deg);
  width: 8px;
}

.app-rounded-select__menu {
  background: var(--ks-field-dropdown-bg, #fff);
  border: 1px solid var(--ks-field-border, #d0d7e2);
  border-radius: 10px;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16);
  display: grid;
  gap: 3px;
  left: 0;
  margin-top: 6px;
  max-height: min(420px, 60vh);
  max-width: calc(100vw - 24px);
  min-width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 6px;
  position: absolute;
  top: 100%;
  z-index: 10000;
}

.app-rounded-select__menu[popover] {
  margin: 0;
  min-width: 0;
}

.app-rounded-select__menu[hidden] {
  display: none;
}

.app-rounded-select__search {
  background: var(--ks-field-dropdown-bg, #fff);
  border-bottom: 1px solid #e4e7ec;
  display: block;
  margin: -6px -6px 4px;
  padding: 8px;
  position: sticky;
  top: -6px;
  z-index: 1;
}

.app-rounded-select__search-input {
  background: #f8fafc;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  min-height: 32px;
  padding: 6px 9px;
  width: 100%;
}

.app-rounded-select__search-input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  outline: none;
}

.app-rounded-select__empty {
  color: #667085;
  display: block;
  font-size: 12px;
  font-weight: 700;
  padding: 10px 12px;
}

.app-rounded-select__empty[hidden] {
  display: none;
}

.app-rounded-select__group {
  border-bottom: 2px solid transparent;
  border-image: linear-gradient(90deg, #2ec5ff 0%, #7c3aed 100%) 1;
  color: #344054;
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  margin: 7px 4px 2px;
  padding: 5px 6px 7px;
}

.app-rounded-select__group[hidden] {
  display: none;
}

.app-rounded-select__option[data-option-group-id] {
  padding-left: 14px;
}

.app-rounded-select__option {
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--ks-field-text, #101828);
  cursor: pointer;
  font: inherit;
  font-weight: 400;
  min-height: 32px;
  overflow-wrap: anywhere;
  padding: 8px 10px;
  text-align: left;
  white-space: nowrap;
  width: 100%;
}

.app-rounded-select__menu.is-constrained .app-rounded-select__option {
  white-space: normal;
}

.app-rounded-select__option:hover,
.app-rounded-select__option:focus-visible {
  background: var(--ks-field-dropdown-hover, #eef8ff);
  outline: none;
}

.app-rounded-select__option.is-selected {
  background: var(--ks-field-selected-bg, #dff3ff);
  color: var(--ks-field-text, #075985);
}

.app-rounded-select__option:disabled {
  color: #98a2b3;
  cursor: not-allowed;
}

:where(
  dialog,
  [popover],
  [role="menu"],
  [role="listbox"],
  .dropdown-menu,
  .app-topnav__popover,
  .app-topnav-apps-menu,
  .app-topnav-favorites-menu,
  .home-site-view-dd-panel,
  .keshboard-drawer__multiselect-menu,
  .keshboard-drawer__multiselect-panel,
  .pm-create-recipient-menu,
  .recipient-picker-menu,
  .spotlight-tag-picker__menu
) {
  border-radius: 10px;
}

html,
body {
  cursor: var(--keshero-cursor-default);
}

html[data-keshero-theme="dark"] {
  --app-surface: #111827;
  --app-surface-muted: #1f2937;
  --app-border: #374151;
  --app-border-soft: #2f3a4a;
  --app-container-border: #4b5563;
  --app-container-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 16px 34px rgba(0, 0, 0, 0.42);
  --app-container-shadow-hover: 0 1px 0 rgba(255, 255, 255, 0.05) inset, 0 20px 42px rgba(0, 0, 0, 0.52);
  --app-text: #e5e7eb;
  --app-heading: #f9fafb;
  --app-muted: #a7b0be;
  --app-shadow-card: 0 12px 30px rgba(0, 0, 0, 0.36);
  --app-shadow-card-hover: 0 16px 38px rgba(0, 0, 0, 0.46);
  --app-table-border: #334155;
  --app-table-header-bg: #1f2937;
  --app-table-header-text: #d1d5db;
  --app-table-row-hover: rgba(46, 197, 255, 0.1);
  --app-table-stripe: #172033;
  --app-action-secondary: #111827;
  --app-action-secondary-hover: #1f2937;
  --app-danger-surface: #3b1118;
  --app-danger-border: #7f1d2a;
  --app-danger-border-strong: #9f2434;
  --app-delete-surface: #2a1218;
  --app-success-surface: #06251b;
  --app-success-border: #145a43;
  --app-warning-surface: #33270b;
  --app-warning-border: #7a5b12;
}

html[data-keshero-theme="dark"] body {
  background:
    linear-gradient(180deg, #07111f 0%, #0f172a 240px, #111827 100%);
  color: var(--app-text);
}

html[data-keshero-theme="dark"] input,
html[data-keshero-theme="dark"] select,
html[data-keshero-theme="dark"] textarea {
  background-color: #111827;
  border-color: #475569;
  color: #e5e7eb;
}

html[data-keshero-theme="dark"] input::placeholder,
html[data-keshero-theme="dark"] textarea::placeholder {
  color: #94a3b8;
}

html[data-keshero-theme="dark"] .app-topnav__popover,
html[data-keshero-theme="dark"] .topbar-profile-menu__panel {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 22px 52px rgba(15, 23, 42, 0.2);
  display: grid;
  gap: 4px;
  min-width: 250px;
  padding: 10px;
  position: absolute;
  right: 0;
  top: calc(100% + 12px);
  z-index: 80;
}

html[data-keshero-theme="dark"] .app-footer-watermark {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.55) 0%, var(--app-surface-muted) 100%);
  border-color: var(--app-border);
  color: var(--app-muted);
}

html[data-keshero-theme="dark"] .app-footer-watermark__year,
html[data-keshero-theme="dark"] .app-footer-watermark__brand,
html[data-keshero-theme="dark"] .app-footer-watermark__entity {
  color: var(--app-muted);
}

html[data-keshero-theme="dark"] .profile-section-card h3,
html[data-keshero-theme="dark"] .profile-avatar-preview,
html[data-keshero-theme="dark"] .profile-empty-state,
html[data-keshero-theme="dark"] .mfa-status-card--off {
  background-color: var(--app-surface-muted);
  border-color: var(--app-border);
  color: var(--app-muted);
}

html[data-keshero-theme="dark"] h1,
html[data-keshero-theme="dark"] h2,
html[data-keshero-theme="dark"] h3,
html[data-keshero-theme="dark"] h4,
html[data-keshero-theme="dark"] .profile-summary-card h1,
html[data-keshero-theme="dark"] .profile-details-header h2,
html[data-keshero-theme="dark"] .profile-editor-card__header h3,
html[data-keshero-theme="dark"] .profile-avatar-preview__meta strong,
html[data-keshero-theme="dark"] .profile-section-card h3,
html[data-keshero-theme="dark"] .mfa-status-card strong,
html[data-keshero-theme="dark"] .mfa-setup__steps strong {
  color: var(--app-heading);
}

html[data-keshero-theme="dark"] p,
html[data-keshero-theme="dark"] small,
html[data-keshero-theme="dark"] .profile-summary-card p,
html[data-keshero-theme="dark"] .profile-details-header p,
html[data-keshero-theme="dark"] .profile-editor-card__header p,
html[data-keshero-theme="dark"] .profile-avatar-preview__meta,
html[data-keshero-theme="dark"] .profile-section-table th {
  color: var(--app-muted);
}

html[data-keshero-theme="dark"] table,
html[data-keshero-theme="dark"] th,
html[data-keshero-theme="dark"] td,
html[data-keshero-theme="dark"] .profile-section-table th,
html[data-keshero-theme="dark"] .profile-section-table td {
  border-color: var(--app-table-border);
}

html[data-keshero-theme="dark"] a {
  color: #7dd3fc;
}

html[data-keshero-theme="dark"] .topbar,
html[data-keshero-theme="dark"] .topbar-layout,
html[data-keshero-theme="dark"] .topbar-row,
html[data-keshero-theme="dark"] .app-topnav-apps-menu__panel,
html[data-keshero-theme="dark"] .page-intro,
html[data-keshero-theme="dark"] .succession-edit-intro,
html[data-keshero-theme="dark"] .succession-edit-form,
html[data-keshero-theme="dark"] .settings-page-shell,
html[data-keshero-theme="dark"] .admin-access-tabs,
html[data-keshero-theme="dark"] .admin-section-sidebar,
html[data-keshero-theme="dark"] .pm-section,
html[data-keshero-theme="dark"] .pm-inline-panel,
html[data-keshero-theme="dark"] .spotlight-dashboard-panel,
html[data-keshero-theme="dark"] .spotlight-feed-card,
html[data-keshero-theme="dark"] .spotlight-award-card,
html[data-keshero-theme="dark"] .spotlight-leader-row,
html[data-keshero-theme="dark"] .inbox-row,
html[data-keshero-theme="dark"] .cycle-edit-actions {
  background-color: var(--app-surface);
  border-color: var(--app-border);
  color: var(--app-text);
}

html[data-keshero-theme="dark"] .profile-card--hero {
  background:
    radial-gradient(circle at 2% 0%, rgba(46, 197, 255, 0.16), transparent 28%),
    radial-gradient(circle at 96% 0%, rgba(18, 183, 106, 0.13), transparent 24%),
    var(--app-surface);
}

html[data-keshero-theme="dark"] .app-topnav__link,
html[data-keshero-theme="dark"] .app-topnav__button,
html[data-keshero-theme="dark"] .topbar-profile-menu summary,
html[data-keshero-theme="dark"] .button-small:not(.button-add-small):not(.button-primary):not(.button-danger-small):not(.button-delete-small):not(.button-save-small),
html[data-keshero-theme="dark"] .settings-sidebar__link,
html[data-keshero-theme="dark"] .admin-section-sidebar__link,
html[data-keshero-theme="dark"] .admin-access-tab,
html[data-keshero-theme="dark"] .spotlight-tabs a,
html[data-keshero-theme="dark"] .spotlight-dashboard-scopes a {
  background-color: #162234;
  border-color: #334155;
  color: #dbeafe;
}

html[data-keshero-theme="dark"] .app-topnav__link:hover,
html[data-keshero-theme="dark"] .app-topnav__button:hover,
html[data-keshero-theme="dark"] .app-topnav__link:focus-visible,
html[data-keshero-theme="dark"] .app-topnav__button:focus-visible,
html[data-keshero-theme="dark"] .button-small:not(.button-add-small):not(.button-primary):not(.button-danger-small):not(.button-delete-small):not(.button-save-small):hover,
html[data-keshero-theme="dark"] .settings-sidebar__link:hover,
html[data-keshero-theme="dark"] .admin-section-sidebar__link:hover,
html[data-keshero-theme="dark"] .admin-access-tab:hover {
  background-color: #1f3148;
  border-color: #38bdf8;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.22), 0 10px 22px rgba(0, 0, 0, 0.32);
  color: #f8fafc;
}

html[data-keshero-theme="dark"] .app-topnav__button--favorites {
  background: #3d3010;
  border-color: #9a7b2e;
  color: #ffe8a3;
}

html[data-keshero-theme="dark"] .app-topnav__button--favorites:hover,
html[data-keshero-theme="dark"] .app-topnav__button--favorites:focus-visible,
html[data-keshero-theme="dark"] .app-topnav-favorites-menu[open] .app-topnav__button--favorites {
  background: #4d3c14;
  border-color: #ffc857;
  box-shadow: 0 0 0 3px rgba(255, 200, 87, 0.22), 0 10px 22px rgba(0, 0, 0, 0.32);
  color: #fff2c7;
}

html[data-keshero-theme="dark"] .app-topnav__button--notifications {
  background: #172554;
  border-color: #1d4ed8;
  color: #bfdbfe;
}

html[data-keshero-theme="dark"] .app-topnav__button--notifications:hover,
html[data-keshero-theme="dark"] .app-topnav__button--notifications:focus-visible,
html[data-keshero-theme="dark"] .app-topnav__button--notifications[aria-expanded="true"] {
  background: #1e3a8a;
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22), 0 10px 22px rgba(0, 0, 0, 0.32);
  color: #eff6ff;
}

html[data-keshero-theme="dark"] .app-topnav__button--calendar {
  background: #052e1a;
  border-color: #15803d;
  color: #bbf7d0;
}

html[data-keshero-theme="dark"] .app-topnav__button--calendar:hover,
html[data-keshero-theme="dark"] .app-topnav__button--calendar:focus-visible {
  background: #064e2d;
  border-color: #4ade80;
  box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.22), 0 10px 22px rgba(0, 0, 0, 0.32);
  color: #ecfdf5;
}

html[data-keshero-theme="dark"] .page-favorite-star,
html[data-keshero-theme="dark"] .page-favorite-star.is-favorited {
  background: #f8fafc;
  border-color: rgba(248, 250, 252, 0.86);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.28);
  color: #fbbf24;
}

html[data-keshero-theme="dark"] .page-favorite-star:hover,
html[data-keshero-theme="dark"] .page-favorite-star:focus-visible {
  background: #fff7ed;
  border-color: #fbbf24;
  box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.22), 0 8px 18px rgba(0, 0, 0, 0.34);
  color: #d97706;
}

html[data-keshero-theme="dark"] .settings-sidebar__link.is-active,
html[data-keshero-theme="dark"] .admin-section-sidebar__link.is-active,
html[data-keshero-theme="dark"] .admin-access-tab.is-active,
html[data-keshero-theme="dark"] .spotlight-tabs a.is-active,
html[data-keshero-theme="dark"] .spotlight-dashboard-scopes a.is-active {
  background-color: #0891b2;
  border-color: #22d3ee;
  color: #ffffff;
}

html[data-keshero-theme="dark"] .admin-section-sidebar__group,
html[data-keshero-theme="dark"] .settings-sidebar__group {
  background: #162234;
  border-color: #334155;
  box-shadow: inset 0 1px 0 rgba(148, 163, 184, 0.06);
}

html[data-keshero-theme="dark"] .settings-sidebar__group-title,
html[data-keshero-theme="dark"] .admin-section-sidebar__group-title {
  background: rgba(51, 65, 85, 0.82);
  color: #e2e8f0;
}

html[data-keshero-theme="dark"] thead th,
html[data-keshero-theme="dark"] .pm-table th,
html[data-keshero-theme="dark"] .spotlight-dashboard-table th,
html[data-keshero-theme="dark"] .user-access-matrix th,
html[data-keshero-theme="dark"] .person-profile-table th {
  background-color: var(--app-table-header-bg);
  color: var(--app-table-header-text);
}

html[data-keshero-theme="dark"] tbody tr,
html[data-keshero-theme="dark"] .pm-table td,
html[data-keshero-theme="dark"] .spotlight-dashboard-table td,
html[data-keshero-theme="dark"] .user-access-matrix td,
html[data-keshero-theme="dark"] .person-profile-table td,
html[data-keshero-theme="dark"] .profile-section-table td {
  background-color: var(--app-surface);
  color: var(--app-text);
}

html[data-keshero-theme="dark"] tbody tr:nth-child(even),
html[data-keshero-theme="dark"] .pm-table tr:nth-child(even) td {
  background-color: var(--app-table-stripe);
}

html[data-keshero-theme="dark"] tbody tr:hover,
html[data-keshero-theme="dark"] .pm-table tr:hover td {
  background-color: var(--app-table-row-hover);
}

html[data-keshero-theme="dark"] .profile-appearance-option {
  background-color: #162234;
  border-color: #334155;
}

html[data-keshero-theme="dark"] .profile-appearance-option:has(input:checked) {
  background-color: rgba(46, 197, 255, 0.18);
  border-color: #22d3ee;
}

html[data-keshero-theme="dark"] .profile-language-options,
html[data-keshero-theme="dark"] .profile-display-preferences .profile-time-zone-form,
html[data-keshero-theme="dark"] .profile-display-preferences .profile-date-format-form,
html[data-keshero-theme="dark"] .profile-text-size-options {
  background-color: #162234;
  border-color: #334155;
}

html[data-keshero-theme="dark"] .profile-time-zone-option {
  background-color: #162234;
  border-color: #334155;
}

html[data-keshero-theme="dark"] .profile-time-zone-option:has(input:checked) {
  background-color: rgba(46, 197, 255, 0.18);
  border-color: #22d3ee;
}

html[data-keshero-theme="dark"] .profile-time-zone-manual {
  color: var(--app-muted);
}

html[data-keshero-theme="dark"] .profile-date-format-card {
  background: var(--app-surface);
  border-color: var(--app-border);
  color: var(--app-text);
}

html[data-keshero-theme="dark"] .profile-date-format-card__head h4,
html[data-keshero-theme="dark"] .profile-date-format-label {
  color: var(--app-heading, var(--app-text));
}

html[data-keshero-theme="dark"] .profile-date-format-card__head p {
  color: var(--app-muted);
}

html[data-keshero-theme="dark"] .profile-date-format-card select,
html[data-keshero-theme="dark"] .profile-date-format-card input[type="text"] {
  background-color: #0f172a;
  border-color: #334155;
  color: var(--app-text);
}

html[data-keshero-theme="dark"] .profile-date-format-example {
  background: rgba(46, 197, 255, 0.13);
  border-color: rgba(46, 197, 255, 0.35);
  color: #bae6fd;
}

html[data-keshero-theme="dark"] .profile-section-table td,
html[data-keshero-theme="dark"] .profile-section-table th {
  color: var(--app-text);
}

html[data-keshero-theme="dark"] .profile-section-table th {
  color: var(--app-muted);
}

.proxy-mode-banner {
  align-items: center;
  background: var(--app-warning-surface);
  border: 1px solid var(--app-warning-border);
  border-radius: 8px;
  box-shadow: 0 8px 18px rgba(255, 200, 87, 0.18);
  color: #6b4e00;
  display: flex;
  flex-wrap: nowrap;
  font-size: 13px;
  font-weight: 700;
  gap: 12px 16px;
  justify-content: space-between;
  max-width: 100%;
  padding: 6px 8px;
  text-align: left;
  width: fit-content;
}

.proxy-mode-banner__copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.proxy-mode-banner__copy > span {
  display: block;
  line-height: 1.3;
}

.proxy-mode-banner__access {
  color: #7a5a10;
  font-size: 12px;
  font-weight: 650;
}

.proxy-mode-banner form {
  align-self: center;
  flex: 0 0 auto;
  margin: 0;
}


.admin-proxy-error {
  color: #b42318;
  font-weight: 700;
  margin-top: 10px;
}

.admin-proxy-panel {
  display: grid;
  gap: 16px;
  max-width: 1040px;
}

.admin-proxy-toolbar {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr);
}

.admin-proxy-toolbar h3 {
  color: var(--app-text);
  font-size: 18px;
  line-height: 1.2;
  margin: 0;
}

.admin-proxy-description {
  color: var(--app-muted);
  font-size: 13px;
  line-height: 1.45;
  margin: 4px 0 0;
  max-width: 760px;
}

.admin-proxy-search-row {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(220px, 380px) minmax(180px, 240px) auto;
  justify-content: start;
}

.admin-proxy-search-row p {
  color: var(--app-muted);
  font-size: 13px;
  font-weight: 700;
  grid-column: 1 / -1;
  margin: 0;
  white-space: nowrap;
}

.admin-proxy-access-group {
  margin: 0;
  min-width: 0;
}

.admin-proxy-access-group__label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.admin-proxy-access-group__label > span {
  color: var(--app-muted);
  font-size: 12px;
  font-weight: 700;
}

.admin-proxy-access-group .ks-dropdown,
.admin-proxy-access-group .ks-dropdown__trigger {
  min-height: var(--app-control-height, 38px);
  width: 100%;
}

.admin-proxy-search {
  align-items: center;
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-height: 34px;
  padding: 2px 4px 2px 9px;
}

.admin-proxy-search:focus-within {
  border-color: var(--app-border);
  box-shadow: none;
}

.admin-proxy-search__leading {
  align-items: center;
  color: #98a2b3;
  display: inline-flex;
  flex-shrink: 0;
  justify-content: center;
}

.admin-proxy-search__leading svg {
  fill: none;
  height: 15px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
  width: 15px;
}

.admin-proxy-search__label {
  color: var(--app-muted);
  font-size: 12px;
  font-weight: 700;
}

.admin-proxy-search input {
  background: transparent;
  border: 0;
  color: var(--app-text);
  font-size: 13px;
  height: 28px;
  min-height: 28px !important;
  min-width: 0;
  outline: 0;
  padding: 4px 0;
  width: 100%;
}

.admin-proxy-search input:focus {
  box-shadow: none;
  outline: none;
}

.admin-proxy-user-list {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 4px;
  width: 100%;
}

.admin-proxy-user-row {
  align-items: center;
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-width: 0;
  padding: 10px;
}

.admin-proxy-user-row[hidden] {
  display: none !important;
}

.admin-proxy-user-row:hover {
  border-color: #2ec5ff;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.08);
}

.admin-proxy-user-main {
  align-items: flex-start;
  display: flex;
  gap: 8px;
  min-width: 0;
}

.admin-proxy-user-main b {
  color: var(--app-text);
  display: block;
  font-size: 13px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-proxy-user-main > div {
  min-width: 0;
  width: 100%;
}

.admin-proxy-card-tooltip {
  position: fixed;
  z-index: 10000;
  width: max-content;
  max-width: min(420px, calc(100vw - 24px));
  box-sizing: border-box;
  padding: 14px 16px;
  border: 1px solid var(--app-border);
  border-radius: 10px;
  background: var(--app-surface);
  color: var(--app-text);
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.16);
  font-size: 13px;
  line-height: 1.6;
  white-space: pre-line;
  overflow-wrap: anywhere;
  max-height: calc(100vh - 24px);
  overflow-y: auto;
}

@media (max-width: 1250px) {
  .admin-proxy-user-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 850px) {
  .admin-proxy-user-list { grid-template-columns: minmax(0, 1fr); }
}

.admin-proxy-user-meta {
  align-items: flex-start;
  color: var(--app-muted);
  display: grid;
  font-size: 11px;
  gap: 2px;
  line-height: 1.45;
  margin-top: 3px;
  min-width: 0;
}

.admin-proxy-user-meta span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-proxy-user-meta__details {
  align-items: baseline;
  display: flex;
  gap: 8px;
  line-height: 1.45;
  min-width: 0;
  overflow: hidden;
  padding-bottom: 1px;
  white-space: nowrap;
}

.admin-proxy-user-meta__details span:last-child {
  flex: 1 1 auto;
}

.admin-proxy-user-meta__separator {
  flex: 0 0 auto;
  line-height: inherit;
}

.admin-proxy-user-row form {
  align-self: center;
  display: flex;
  justify-content: flex-end;
  margin: 0;
}

.admin-proxy-user-row .button-primary {
  min-height: 30px;
  padding: 5px 12px;
}

@media (max-width: 720px) {
  .admin-proxy-search-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-proxy-search-row p {
    grid-column: auto;
  }

  .admin-proxy-search {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .admin-proxy-search__label {
    display: none;
  }

  .admin-proxy-user-row {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Copyright: in page flow (not fixed); stays at bottom on short pages via margin-top: auto */
.app-footer-watermark {
  align-items: center;
  background:
    linear-gradient(180deg, rgba(244, 251, 255, 0.92) 0%, rgba(250, 250, 252, 0.98) 100%);
  border-top: 0;
  box-sizing: border-box;
  color: #667085;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  justify-content: center;
  letter-spacing: 0.06em;
  margin-top: auto;
  padding: 18px 16px calc(16px + env(safe-area-inset-bottom, 0px));
  position: relative;
  text-align: center;
  user-select: none;
}

.app-footer-watermark__text {
  align-items: baseline;
  display: inline-flex;
  flex-wrap: wrap;
  font-size: 12px;
  font-weight: 600;
  gap: 0.35em;
  justify-content: center;
  line-height: 1.35;
}

.app-footer-watermark__year,
.app-footer-watermark__brand,
.app-footer-watermark__entity {
  color: #667085;
  font-weight: 600;
  letter-spacing: 0.04em;
}

html {
  box-sizing: border-box;
  color: var(--app-text);
  font-family: var(--app-font-sans);
  line-height: var(--app-line-height);
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

.sr-only {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

table {
  border-collapse: separate;
  border-spacing: 0;
}

th, td {
  vertical-align: top;
}

h1,
h2,
h3,
h4 {
  color: var(--app-heading);
  letter-spacing: 0;
  line-height: 1.2;
}

h1 {
  font-size: var(--app-h1-size);
}

h2 {
  font-size: var(--app-h2-size);
}

h3 {
  font-size: var(--app-h3-size);
}

p {
  line-height: var(--app-line-height);
}

input,
select,
textarea,
button {
  font: inherit;
}

textarea.keshero-autosize-textarea {
  overflow-y: hidden;
  resize: vertical;
}

.cell {
  width: 218px;
  min-width: 200px;
}

.changed {
  color: var(--app-action-danger);
  font-weight: 700;
}

.placement-cell-inner {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  gap: 6px;
}

.placement-cell-text {
  flex: 1 1 auto;
  min-width: 0;
}

.placement-star {
  color: var(--app-action-danger);
  font-weight: 800;
  flex-shrink: 0;
  font-size: 1.15em;
  line-height: 1;
}

.placement-cell-inner .admin-placement-dd {
  flex: 1 1 auto;
  min-width: 0;
  margin-bottom: 0;
}

.note {
  margin-top: 6px;
  font-size: 12px;
  color: #444;
  white-space: pre-wrap;
}

.topbar {
  background: var(--topbar-banner-background, linear-gradient(90deg, var(--topbar-banner-start, #d8ecff) 0%, var(--topbar-banner-end, #c8f1ff) 100%));
  border: 1px solid var(--topbar-banner-border, #60a5fa);
  border-radius: 12px;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.12);
  color: var(--topbar-banner-text, #0f172a);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  flex-wrap: nowrap;
  justify-content: flex-start;
  gap: 0;
  margin: 0 0 18px;
  min-height: 78px;
  overflow: visible;
  padding: 14px 18px;
  position: sticky;
  top: 0;
  /* Above page sticky chrome/filters so topnav tooltips and menus are not covered. */
  z-index: 500;
}

.topbar-layout {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  overflow: visible;
  width: 100%;
}

.topbar-row--title + .topbar-row--account {
  margin-top: 0;
}

.topbar-row--nav {
  align-items: center;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 12px 18px;
  justify-content: flex-start;
  min-height: 44px;
  overflow: visible;
  /* Keep icon tooltips above the search row that follows in the DOM. */
  position: relative;
  width: 100%;
  z-index: 3;
}

.topbar-row--nav > .proxy-mode-banner {
  left: 50%;
  max-width: min(560px, calc(100% - 360px));
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.topbar-logo-link {
  /* Image-only control: a click must not paint a text insertion caret. */
  caret-color: transparent;
  -webkit-user-select: none;
  user-select: none;
  align-items: center;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.72);
  display: inline-flex;
  flex-shrink: 0;
  isolation: isolate;
  line-height: 0;
  overflow: hidden;
  padding: 3px 4px;
  position: relative;
  text-decoration: none;
}

.topbar-logo-link::before {
  background: var(--app-logo-tile-color, #ffffff);
  content: "";
  inset: 0;
  opacity: var(--app-logo-tile-opacity, 1);
  position: absolute;
  z-index: -1;
}

.topbar-logo-link:focus-visible {
  border-radius: 10px;
  outline: 2px solid rgba(46, 197, 255, 0.45);
  outline-offset: 3px;
}

.topbar-logo-link__img {
  pointer-events: none;
  -webkit-user-drag: none;
  user-select: none;
  display: block;
  filter: drop-shadow(0 2px 4px rgba(15, 23, 42, 0.34));
  height: 48px;
  max-height: 64px;
  max-width: min(230px, 50vw);
  object-fit: contain;
  width: auto;
}

.topbar-row--nav .topbar-right-cluster {
  align-items: center;
  flex: 1 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px 14px;
  justify-content: flex-end;
  margin-left: auto;
  max-width: 100%;
  min-width: 0;
  position: relative;
  width: auto;
}

.topbar-nav-search {
  flex: 1 1 240px;
  max-width: min(560px, 100%);
  min-width: min(200px, 100%);
  order: 0;
}

.topbar-row--nav .topbar-nav-search .topbar-search-wrap {
  margin-left: 0;
  max-width: none;
  min-width: 0;
  width: 100%;
}

.topbar-row--nav .topbar-right-bubbles {
  flex: 0 1 auto;
  margin-left: 0;
}

.topbar-row--title {
  min-width: 0;
  padding-right: 4px;
  width: 100%;
}

.topbar-row--account {
  min-width: 0;
  width: 100%;
}

.topbar-account-line {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  justify-content: space-between;
  min-width: 0;
  width: 100%;
}

.topbar-row--account .account-topbar-subhead {
  flex: 0 1 auto;
  margin-top: 0;
  min-width: 0;
}

.topbar-brand-identity {
  align-items: center;
  display: flex;
  flex: 1 1 auto;
  gap: 14px;
  min-width: 0;
}

.topbar-identity-stack {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.topbar-identity-stack .topbar-row--title,
.topbar-identity-stack .topbar-row--account {
  padding-right: 0;
  width: auto;
}

.topbar-identity-stack .topbar-account-line {
  justify-content: flex-start;
  width: auto;
}

.topbar-row--nav .topbar-right-cluster {
  flex: 0 0 auto;
}

.topbar-row--lower {
  align-items: flex-start;
  display: flex;
  gap: 12px 18px;
  justify-content: space-between;
  margin-top: 8px;
  min-width: 0;
  position: relative;
  width: 100%;
  z-index: 2;
}

.topbar-lower-search {
  align-items: flex-start;
  display: flex;
  flex: 1 1 560px;
  flex-direction: column;
  gap: 8px;
  max-width: min(560px, 100%);
  min-width: min(280px, 100%);
}

.topbar-lower-search .topbar-search-wrap {
  margin: 0 !important;
  max-width: none;
  min-width: 0;
  width: 100%;
}

.topbar-row--lower .topbar-search-actions {
  align-items: flex-start;
  align-self: flex-start;
  flex: 0 1 auto;
  margin-left: auto;
}

.topbar-search-actions {
  align-items: center;
  display: flex;
  flex: 1 1 auto;
  gap: 10px;
  justify-content: flex-end;
  margin-left: clamp(12px, 2vw, 28px);
  min-width: 0;
}

.topbar-search-actions .topbar-search-wrap {
  flex: 1 1 auto;
  margin-left: 0;
  max-width: none;
  min-width: min(280px, 100%);
}

.topbar-after-search {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  min-width: 0;
}

.topbar-after-search .home-site-view-bar {
  align-items: center;
  display: flex;
  flex-shrink: 0;
  flex-wrap: nowrap;
  gap: 0;
  justify-content: flex-start;
  overflow: visible;
  position: relative;
}

.topbar-after-search .home-site-view-field {
  align-items: center;
  color: #344054;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  margin: 0;
  overflow: visible;
  position: relative;
}

.topbar-after-search .home-site-view-dd {
  position: relative;
  width: 200px;
}

.topbar-after-search .home-site-view-dd.is-open {
  z-index: 82;
}

.topbar-after-search .home-site-view-dd-toggle {
  align-items: center;
  appearance: none;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  box-shadow:
    0 1px 2px rgba(16, 24, 40, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.85);
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  height: 36px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  justify-content: space-between;
  min-height: 36px;
  min-width: 0;
  padding: 0 12px 0 14px;
  text-align: left;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
  width: 100%;
}

.topbar-after-search .home-site-view-dd-toggle:hover {
  background-color: #eef4ff;
  background-image: none;
  border-color: #b2ddff;
  color: #1aa6d6;
}

.topbar-after-search .home-site-view-dd.is-open .home-site-view-dd-toggle,
.topbar-after-search .home-site-view-dd-toggle:focus-visible {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.18);
  outline: none;
}

.topbar-after-search .home-site-view-dd-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topbar-after-search .home-site-view-dd-chevron {
  background-image: var(--app-dropdown-arrow-icon);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 14px 14px;
  flex-shrink: 0;
  height: 14px;
  transition: transform 0.15s ease;
  width: 14px;
}

.topbar-after-search .home-site-view-dd.is-open .home-site-view-dd-chevron {
  transform: rotate(180deg);
}

.topbar-after-search .home-site-view-dd-panel {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 14px;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.14);
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  min-width: 320px;
  padding: 8px;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 80;
}

.topbar-after-search .home-site-view-dd-panel[hidden] {
  display: none !important;
}

.topbar-after-search .home-site-view-dd-option {
  align-items: flex-start;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #344054;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  font-family: inherit;
  gap: 3px;
  padding: 10px 12px;
  position: relative;
  text-align: left;
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
  width: 100%;
}

.topbar-after-search .home-site-view-dd-option:hover {
  background: #f8fafc;
  border-color: #e4e7ec;
}

.topbar-after-search .home-site-view-dd-option:focus-visible {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.18);
  outline: none;
}

.topbar-after-search .home-site-view-dd-option.is-selected {
  background: linear-gradient(180deg, #eef9ff 0%, #f8fcff 100%);
  border-color: #b2ddff;
}

.topbar-after-search .home-site-view-dd-option__title {
  color: #101828;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
}

.topbar-after-search .home-site-view-dd-option__desc {
  color: #667085;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
}


body:has(.progress-summary-drawer__tab) .topbar-search-actions {
  margin-right: max(0px, calc(var(--right-drawer-tab-reserve, 58px) - var(--home-right-edge-nudge, 20px) - 16px));
}

body:has(.progress-summary-drawer__tab) .topbar-search-actions .topbar-search-wrap {
  margin-right: 0;
}

body:has(.home-primary-actions):has(.progress-summary-drawer__tab) .topbar-search-actions {
  margin-right: calc(var(--right-drawer-tab-reserve, 58px) - var(--topbar-search-actions-nudge, 36px));
}

body:has(.home-primary-actions):has(.progress-summary-drawer__tab) .topbar-search-actions .topbar-search-wrap {
  margin-right: 0;
}

/* Title + layout fill the topbar; nav row is logo + bubbles. */
.topbar > .topbar-layout {
  flex: none;
  min-width: 0;
  width: 100%;
}

.topbar h2 {
  color: var(--topbar-banner-text, #0f172a);
  font-size: 22px;
  line-height: 1.15;
  letter-spacing: 0;
  margin: 0;
  overflow: visible;
  word-break: break-word;
  white-space: normal;
}

.topbar .account-topbar-subhead,
.topbar .topbar-account-line,
.topbar .topbar-heading-stack .account-topbar-subhead {
  color: var(--topbar-banner-muted, #475467);
}

/* Performance Rating grid: wrapped title + inline help in the heading column. */
.topbar .topbar-title-wrap--multiline {
  min-width: 0;
}

.topbar .topbar-title-wrap--multiline h2.cycle-grid-page-title {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  word-break: break-word;
}

.topbar .topbar-title-wrap--multiline h2.cycle-grid-page-title .inline-help-button {
  flex-shrink: 0;
}

/* People Directory (and similar): page title alone on first row; identity on second row, one line. */
.topbar-heading-stack {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.topbar-heading-stack > h2 {
  word-break: break-word;
  white-space: normal;
}

.topbar-heading-stack .account-topbar-subhead {
  margin-top: 4px;
}

.topbar-heading-stack--people-directory .account-topbar-subhead {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  max-width: min(560px, 72vw);
  min-width: 0;
  overflow: hidden;
}

.topbar-heading-stack--people-directory .account-topbar-subhead > span:first-child {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topbar-heading-stack--people-directory .account-topbar-subhead__role {
  flex-shrink: 0;
}

.topbar-right-cluster {
  align-self: stretch;
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
  justify-content: flex-end;
  max-width: 100%;
  overflow: visible;
  width: 100%;
}

.topbar-right-bubbles {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
  margin-left: auto;
  margin-right: 0;
  max-width: 100%;
  overflow: visible;
}

/* Keep icon cluster flush with Search when there is no right-drawer tab strip. */
body:has(.progress-summary-drawer__tab) .topbar-right-bubbles {
  margin-right: max(0px, calc(var(--right-drawer-tab-reserve, 58px) - var(--home-right-edge-nudge, 20px) - 16px));
}

body:has(.home-primary-actions):has(.progress-summary-drawer__tab) .topbar-right-bubbles {
  margin-right: max(0px, calc(var(--right-drawer-tab-reserve, 58px) - var(--home-right-edge-nudge, 20px) - 16px));
}

.topbar-right-row1 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.topbar-right-row2 {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  text-align: right;
}

.topbar-search-wrap {
  flex: 1 1 auto;
  margin-left: auto;
  max-width: none;
  min-width: min(220px, 100%);
  position: relative;
}

body:has(.progress-summary-drawer__tab) .topbar-search-wrap {
  margin-right: calc(var(--right-drawer-tab-reserve, 58px) - var(--home-right-edge-nudge, 20px));
}

body:has(.home-primary-actions):has(.progress-summary-drawer__tab) .topbar-search-wrap {
  margin-right: calc(var(--right-drawer-tab-reserve, 58px) - var(--home-right-edge-nudge, 20px));
}

.topbar-search {
  align-items: center;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  box-shadow:
    0 1px 2px rgba(16, 24, 40, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.85);
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  height: 36px;
  min-height: 36px;
  padding: 3px 4px 3px 10px;
  position: relative;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
  width: 100%;
}

.topbar-search:focus-within {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border-color: #e4e7ec;
  box-shadow:
    0 1px 2px rgba(16, 24, 40, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.topbar-search__leading {
  align-items: center;
  color: #98a2b3;
  display: inline-flex;
  flex-shrink: 0;
  justify-content: center;
}

.topbar-search__leading svg {
  fill: none;
  height: 15px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
  width: 15px;
}

.topbar-search:focus-within .topbar-search__leading {
  color: #98a2b3;
}

.topbar-search__composer {
  align-items: center;
  display: flex;
  flex: 1 1 180px;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 0;
}

.topbar-search__chips {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.topbar-search__chips[hidden] {
  display: none !important;
}

.topbar-search__chip {
  align-items: center;
  background: #f2f4f7;
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  color: #344054;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 2px;
  max-width: 160px;
  min-height: 24px;
  padding: 0 4px 0 8px;
}

.topbar-search__chip-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topbar-search__chip-and {
  color: #667085;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.topbar-search__chip-remove {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: #667085;
  cursor: pointer;
  display: inline-flex;
  flex-shrink: 0;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  height: 20px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 20px;
}

.topbar-search__chip-remove:hover,
.topbar-search__chip-remove:focus-visible {
  background: #e4e7ec;
  color: #101828;
  outline: none;
}

.topbar-search__input {
  background: transparent;
  border: 0;
  color: #101828;
  flex: 1 1 120px;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  min-height: 28px;
  min-width: 80px;
  outline: none;
  padding: 0;
  width: auto;
}

.topbar-search__input::placeholder {
  color: #98a2b3;
  font-weight: 500;
}

.topbar-search__add-term {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  flex-shrink: 0;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  height: 28px;
  justify-content: center;
  min-height: 28px;
  padding: 0 8px;
  white-space: nowrap;
}

.topbar-search__add-term:hover,
.topbar-search__add-term:focus-visible {
  background: #eff8ff;
  border-color: #7dd3fc;
  color: #026aa2;
  outline: none;
}

.topbar-search__hint {
  color: var(--topbar-banner-muted, #475467);
  font-size: 11px;
  line-height: 1.35;
  margin: 0;
}
.topbar-search__meta {
  align-items: center;
  display: none;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 6px 2px 0;
}
.topbar-search-wrap:focus-within .topbar-search__meta,
.topbar-search-wrap.is-hint-visible .topbar-search__meta {
  display: flex;
}
.topbar-search__hint strong {
  color: inherit;
  font-weight: 800;
}
.topbar-search__hint-key {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.topbar-search__match {
  display: inline-flex;
  flex-shrink: 0;
}
.topbar-search__match-btn {
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  color: #475569;
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1;
  min-height: 26px;
  padding: 4px 10px;
}
.topbar-search__match-btn:first-child {
  border-radius: 8px 0 0 8px;
}
.topbar-search__match-btn:last-child {
  border-left: 0;
  border-radius: 0 8px 8px 0;
}
.topbar-search__match-btn:hover {
  background: #eef2f6;
  color: #1f2937;
}
.topbar-search__match-btn.is-active {
  background: var(--keshero-purple, #8a2be2);
  border-color: var(--keshero-purple, #8a2be2);
  color: #ffffff;
  z-index: 1;
}
.topbar-search__chip-joiner {
  background: transparent;
  border: 0;
  border-radius: 4px;
  cursor: pointer;
  font: inherit;
  padding: 0 2px;
}
.topbar-search__chip-joiner:hover,
.topbar-search__chip-joiner:focus-visible {
  color: #175cd3;
  outline: none;
  text-decoration: underline;
}

.topbar-search__submit {
  align-items: center;
  background: linear-gradient(180deg, #38bdf8 0%, #0284c7 100%);
  border: 0;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(2, 132, 199, 0.28);
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  flex-shrink: 0;
  height: 28px;
  justify-content: center;
  min-height: 28px;
  transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease;
  width: 32px;
}

.topbar-search__submit svg {
  fill: none;
  height: 15px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.3;
  width: 15px;
}

.topbar-search__submit:hover,
.topbar-search__submit:focus-visible {
  box-shadow: 0 4px 10px rgba(2, 132, 199, 0.32);
  filter: brightness(1.04);
  transform: translateY(-1px);
}

.topbar-search__submit:active {
  filter: brightness(0.96);
  transform: translateY(0);
}

html[data-keshero-theme="dark"] .topbar-search {
  background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
  border-color: #334155;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-keshero-theme="dark"] .topbar-search:focus-within {
  background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
  border-color: #334155;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-keshero-theme="dark"] .topbar-search__input {
  color: #f8fafc;
}

html[data-keshero-theme="dark"] .topbar-search__dropdown {
  background: #1e293b;
  border-color: #334155;
}

.topbar-search__dropdown {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 12px;
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.14);
  display: none;
  gap: 8px;
  left: 0;
  margin-top: 8px;
  max-height: min(420px, 60vh);
  overflow: auto;
  padding: 8px;
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 120;
}

.topbar-search__dropdown.is-open {
  display: grid;
}

.topbar-search__group {
  display: grid;
  gap: 4px;
}

.topbar-search__group-label {
  color: #667085;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  padding: 4px 8px 0;
  text-transform: uppercase;
}

.topbar-search__option,
.topbar-search__footer {
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: inherit;
  cursor: pointer;
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  text-align: left;
  width: 100%;
}

.topbar-search__option strong,
.topbar-search__footer {
  color: #101828;
  font-size: 13px;
}

.topbar-search__option span {
  color: #667085;
  font-size: 12px;
}

.topbar-search__option:hover,
.topbar-search__option.is-active,
.topbar-search__footer:hover {
  background: #f0fcff;
}

.topbar-search__footer {
  border-top: 1px solid #eaecf0;
  color: #175cd3;
  font-size: 12px;
  font-weight: 800;
  margin-top: 2px;
}

.topbar-search__empty {
  color: #667085;
  font-size: 12px;
  padding: 10px;
}

.app-topnav {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: 7px;
  justify-content: flex-end;
  overflow: visible;
  position: relative;
  z-index: 1;
}

.app-topnav-favorites-menu {
  display: inline-flex;
  order: 6;
  position: relative;
}

.app-topnav-favorites-menu > summary {
  align-items: center;
  box-sizing: border-box;
  display: inline-flex;
  height: 44px;
  justify-content: center;
  list-style: none;
  min-height: 44px;
  min-width: 44px;
  padding: 0;
  width: 44px;
}

.app-topnav-favorites-menu > summary::-webkit-details-marker {
  display: none;
}

.app-topnav__button--favorites {
  background: #fff8e1;
  border-color: #ffd98a;
  color: #7a4b00;
}

.app-topnav__button--favorites:hover,
.app-topnav__button--favorites:focus-visible,
.app-topnav-favorites-menu[open] .app-topnav__button--favorites {
  background: #fffaf0;
  border-color: #b7791f;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.72), 0 10px 22px rgba(90, 54, 0, 0.2);
  color: #5f3900;
  outline: none;
  transform: translateY(-1px);
}

.app-topnav__button--notifications {
  background: #eff8ff;
  border-color: #b2ddff;
  color: #175cd3;
}

.app-topnav__button--notifications:hover,
.app-topnav__button--notifications:focus-visible,
.app-topnav__button--notifications[aria-expanded="true"] {
  background: #ffffff;
  border-color: #1570ef;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.72), 0 10px 22px rgba(23, 92, 211, 0.18);
  color: #1849a9;
  outline: none;
  transform: translateY(-1px);
}

.app-topnav__button--calendar {
  background: #ecfdf3;
  border-color: #abefc6;
  color: #067647;
}

.app-topnav__button--calendar:hover,
.app-topnav__button--calendar:focus-visible {
  background: #ffffff;
  border-color: #079455;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.72), 0 10px 22px rgba(6, 118, 71, 0.18);
  color: #05603a;
  outline: none;
  transform: translateY(-1px);
}

.app-topnav__star {
  color: #ffc857;
  display: block;
  font-size: 22px;
  line-height: 1;
  text-shadow: 0 1px 0 rgba(95, 57, 0, 0.18);
  transform: translateY(-1px);
}

.app-topnav-favorites-menu__panel {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  box-shadow: 0 18px 44px rgba(16, 24, 40, 0.16);
  box-sizing: border-box;
  display: grid;
  gap: 6px;
  max-width: calc(100vw - 44px);
  padding: 9px;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  width: min(410px, calc(100vw - 44px));
  z-index: 140;
}

.app-topnav-favorites-menu__header {
  border-bottom: 1px solid #c5cdd8;
  padding-bottom: 6px;
}

.app-topnav-favorites-menu__header,
.app-topnav-favorites-menu__footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.app-topnav-favorites-menu__header strong {
  color: #101828;
  font-size: 13px;
}

.app-topnav-favorites-menu__header span {
  color: #667085;
  font-size: 11px;
  font-weight: 700;
}

.app-topnav-favorites-menu__body {
  --app-topnav-favorites-row-height: 64px;
  display: grid;
  gap: 0;
  max-height: calc(var(--app-topnav-favorites-row-height) * 5);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 2px;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.app-topnav-favorites-menu__body::-webkit-scrollbar {
  width: 8px;
}

.app-topnav-favorites-menu__body::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 999px;
}

.app-topnav-favorites-menu__body::-webkit-scrollbar-track {
  background: transparent;
}

.app-topnav-favorites-menu__item {
  border-bottom: 1px solid #c5cdd8;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 32px;
  padding: 0;
  position: relative;
}

.app-topnav-favorites-menu__item:last-child {
  border-bottom: 0;
}

.app-topnav-favorites-menu__item-link {
  align-items: flex-start;
  border-radius: 6px;
  box-sizing: border-box;
  color: #344054;
  display: flex;
  gap: 8px;
  min-height: var(--app-topnav-favorites-row-height, 42px);
  min-width: 0;
  padding: 9px 4px 9px 6px;
  text-decoration: none;
  width: 100%;
}

.app-topnav-favorites-menu__item-link:hover,
.app-topnav-favorites-menu__item-link:focus-visible {
  background: #f8fbff;
  outline: none;
}

.app-topnav-favorites-menu__item-star {
  color: #ffc857;
  flex-shrink: 0;
  line-height: 1.35;
}

.app-topnav-favorites-menu__item-label {
  color: #101828;
  flex: 1 1 auto;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.app-topnav-favorites-menu__item-copy {
  display: grid;
  flex: 1 1 auto;
  gap: 2px;
  min-width: 0;
}

.app-topnav-favorites-menu__item-title-row {
  align-items: center;
  display: flex;
  gap: 6px;
  min-width: 0;
}

.app-topnav-favorites-menu__item-context {
  color: #667085;
  display: block;
  font-size: 11px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.app-topnav-favorites-menu__current {
  background: #e0f2fe;
  border: 1px solid #7dd3fc;
  border-radius: 999px;
  color: #075985;
  flex: 0 0 auto;
  font-size: 9px;
  font-weight: 850;
  line-height: 1;
  padding: 3px 5px;
  text-transform: uppercase;
}

.app-topnav-favorites-menu__item.is-current {
  background: #f0f9ff;
}

.app-topnav-favorites-menu__actions-toggle {
  align-self: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 7px;
  color: #667085;
  cursor: pointer;
  height: 30px;
  padding: 6px;
  width: 30px;
}

.app-topnav-favorites-menu__actions-toggle:hover,
.app-topnav-favorites-menu__actions-toggle:focus-visible,
.app-topnav-favorites-menu__actions-toggle[aria-expanded="true"] {
  background: #eef6ff;
  border-color: #93c5fd;
  color: #075985;
  outline: none;
}

.app-topnav-favorites-menu__actions-toggle svg {
  display: block;
  fill: none;
  height: 16px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 16px;
}

.app-topnav-favorites-menu__actions {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 9px;
  box-shadow: 0 12px 28px rgba(16, 24, 40, 0.18);
  display: grid;
  min-width: 180px;
  padding: 5px;
  position: fixed;
  z-index: 10000;
}

.app-topnav-favorites-menu__actions[hidden] {
  display: none !important;
}

.app-topnav-favorites-menu__actions button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: #344054;
  cursor: pointer;
  font: inherit;
  display: flex;
  font-size: 12px;
  font-weight: 700;
  justify-content: flex-start;
  line-height: 1.3;
  min-height: 34px;
  padding: 8px 10px;
  text-align: left;
  width: 100%;
}

.app-topnav-favorites-menu__actions a {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: #344054;
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  justify-content: flex-start;
  line-height: 1.3;
  min-height: 34px;
  padding: 8px 10px;
  text-align: left;
  text-decoration: none;
  width: 100%;
}

.app-topnav-favorites-menu__actions button:hover,
.app-topnav-favorites-menu__actions button:focus-visible,
.app-topnav-favorites-menu__actions a:hover,
.app-topnav-favorites-menu__actions a:focus-visible {
  background: #f2f4f7;
  outline: none;
}

.app-topnav-favorites-menu__actions button.is-danger {
  color: #d92d20 !important;
  font-weight: 850 !important;
}

.app-topnav-favorites-menu__actions button.is-danger:hover,
.app-topnav-favorites-menu__actions button.is-danger:focus-visible {
  background: #fef3f2;
  color: #b42318 !important;
}

.app-topnav-favorites-menu__action-icon,
.app-topnav-favorites-menu__action-icon.app-external-link-icon {
  fill: none;
  flex: 0 0 auto;
  height: 16px;
  margin-left: auto;
  min-height: 16px;
  min-width: 16px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
  width: 16px;
}

.app-topnav-favorites-menu__item-status {
  color: #b42318;
  display: block;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.3;
}

.app-topnav-favorites-menu__item-status[hidden] {
  display: none !important;
}

.app-topnav-favorites-menu__item.is-stale .app-topnav-favorites-menu__item-star,
.app-topnav-favorites-menu__item.is-stale .app-topnav-favorites-menu__item-label,
.app-topnav-favorites-menu__item.is-stale .app-topnav-favorites-menu__item-context {
  color: #98a2b3;
}

.app-topnav-favorites-menu__footer button {
  background: #2ec5ff;
  border: 1px solid #0788c7;
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  min-height: 28px;
  padding: 4px 9px;
}

.app-topnav-favorites-menu__footer {
  border-top: 1px solid #c5cdd8;
  gap: 8px;
  padding-top: 6px;
}

.app-topnav-favorites-menu__footer .app-topnav-favorites-menu__start-page {
  background: #ffffff;
  border-color: #0788c7;
  color: #0674a8;
}

.app-topnav-favorites-menu__footer .app-topnav-favorites-menu__start-page:hover,
.app-topnav-favorites-menu__footer .app-topnav-favorites-menu__start-page:focus-visible {
  background: #eaf8ff;
  border-color: #056a9d;
  color: #055b83;
}

.app-topnav-favorites-menu__footer button:hover,
.app-topnav-favorites-menu__footer button:focus-visible {
  background: #0ea5e9;
  border-color: #056a9d;
  color: #ffffff;
  outline: none;
}

.app-topnav-favorites-menu__empty {
  border: 1px dashed #d0d5dd;
  border-radius: 10px;
  color: #667085;
  display: grid;
  gap: 4px;
  padding: 14px;
  text-align: center;
}

.app-topnav-favorites-menu__empty strong {
  color: #344054;
}

.app-topnav > a[href="/"] {
  order: 1;
}

.app-topnav-apps-menu {
  order: 2;
}

.app-topnav > a[href="/inbox"] {
  order: 2;
}

.app-topnav__popover-wrap--notifications {
  order: 4;
}

.app-topnav > .app-topnav__button--calendar {
  order: 5;
}

.app-topnav__link {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-radius: 999px;
  box-sizing: border-box;
  color: #344054;
  display: inline-flex;
  font-family: inherit;
  font-size: 14px;
  font-weight: 800;
  gap: 0;
  height: 44px;
  justify-content: center;
  line-height: 1;
  min-height: 44px;
  min-width: 44px;
  padding: 0;
  position: relative;
  text-decoration: none;
  white-space: nowrap;
  width: 44px;
}

.app-topnav__link[aria-current="page"] {
  background: #ffffff;
  border-color: #38bdf8;
  box-shadow: inset 0 0 0 1px rgba(14, 165, 233, 0.22), 0 6px 16px rgba(14, 165, 233, 0.14);
  color: #075985;
}

.app-topnav__link:hover,
.app-topnav__link:focus-visible {
  background: #ffffff;
  border-color: #0788c7;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.72), 0 10px 22px rgba(15, 23, 42, 0.18);
  color: #075985;
  outline: none;
  transform: translateY(-1px);
}

.app-topnav__button {
  -webkit-appearance: none;
  appearance: none;
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-radius: 999px;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, color 0.14s ease, transform 0.14s ease;
}

.app-topnav__icon {
  display: block;
  fill: currentColor;
  flex: 0 0 auto;
  height: 26px;
  width: 26px;
}

.app-topnav__icon--gold {
  fill: var(--keshero-yellow);
}

.app-topnav__label {
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  color: inherit;
  display: inline-block;
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: 800;
  height: 1px;
  letter-spacing: 0;
  line-height: 1;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.app-topnav-apps-menu__chevron {
  display: none;
}

.app-topnav [data-topnav-tooltip]::after {
  background: #101828;
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.18);
  color: #fff;
  content: attr(data-topnav-tooltip);
  font-size: 12px;
  font-weight: 800;
  left: 50%;
  line-height: 1;
  max-width: 220px;
  opacity: 0;
  overflow: hidden;
  padding: 8px 10px;
  pointer-events: none;
  position: absolute;
  text-overflow: ellipsis;
  top: calc(100% + 8px);
  transform: translate(-50%, -4px);
  transition: opacity 0.14s ease, transform 0.14s ease;
  white-space: nowrap;
  z-index: 250;
}

.app-topnav [data-topnav-tooltip]::before {
  border: 5px solid transparent;
  border-bottom-color: #101828;
  content: "";
  left: 50%;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: calc(100% - 1px);
  transform: translate(-50%, -4px);
  transition: opacity 0.14s ease, transform 0.14s ease;
  z-index: 251;
}

.app-topnav [data-topnav-tooltip]:hover::after,
.app-topnav [data-topnav-tooltip]:focus-visible::after,
.app-topnav [data-topnav-tooltip]:hover::before,
.app-topnav [data-topnav-tooltip]:focus-visible::before {
  opacity: 1;
  transform: translate(-50%, 0);
}

.app-topnav-favorites-menu[open] > [data-topnav-tooltip]::after,
.app-topnav-favorites-menu[open] > [data-topnav-tooltip]::before,
.app-topnav-apps-menu[open] > [data-topnav-tooltip]::after,
.app-topnav-apps-menu[open] > [data-topnav-tooltip]::before,
.app-topnav__button--notifications[aria-expanded="true"]::after,
.app-topnav__button--notifications[aria-expanded="true"]::before {
  opacity: 0;
  transform: translate(-50%, -4px);
}

.app-topnav__button--notifications .topbar-inbox-badge,
.app-topnav__button--calendar .topbar-inbox-badge {
  box-shadow: 0 0 0 2px #ffffff;
  font-size: 10px;
  height: 18px;
  min-width: 18px;
  padding: 0 5px;
  position: absolute;
  right: -5px;
  top: -5px;
}

.app-topnav__button--notifications .topbar-inbox-badge {
  background: var(--keshero-purple);
}

.topbar-row--title {
  align-items: flex-end;
  display: flex;
  gap: 4px;
}

.topbar-title-main {
  min-width: 0;
}

.page-favorite-star {
  align-items: center;
  background: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.88);
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.14);
  color: #fbbf24;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  height: 23px;
  justify-content: center;
  line-height: 1;
  margin-bottom: 0;
  padding: 0;
  transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, color 0.14s ease, transform 0.14s ease;
  width: 23px;
}

.page-favorite-star__icon {
  fill: none;
  height: 16px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 16px;
}

.page-favorite-star:hover,
.page-favorite-star:focus-visible {
  background: #fffdf5;
  border-color: #fbbf24;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.64), 0 8px 18px rgba(146, 64, 14, 0.2);
  color: #f59e0b;
  outline: none;
  transform: translateY(-1px) scale(1.04);
}

.pm-subtabs {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.pm-subtabs a {
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  padding: 8px 10px;
  text-decoration: none;
}

.pm-subtabs a:hover,
.pm-subtabs a:focus-visible {
  background: #eff6ff;
  border-color: #93c5fd;
  outline: none;
}

.page-favorite-star.is-favorited {
  background: #ffffff;
  color: #fbbf24;
}

.page-favorite-star.is-favorited .page-favorite-star__icon {
  fill: currentColor;
}

.favorites-modal[hidden] {
  display: none;
}

.favorites-manage-modal[hidden] {
  display: none;
}

.start-page-modal[hidden] {
  display: none;
}

.favorites-modal {
  inset: 0;
  position: fixed;
  z-index: 2000;
}

.favorites-manage-modal {
  inset: 0;
  position: fixed;
  z-index: 2000;
}

.start-page-modal {
  inset: 0;
  position: fixed;
  z-index: 2000;
}

.start-page-modal__dialog {
  background: #fff;
  border: 1px solid #b9dff5;
  border-radius: 18px;
  box-shadow: 0 28px 72px rgba(15, 23, 42, 0.28);
  display: grid;
  gap: 0;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  left: 50%;
  max-height: min(680px, calc(100vh - 32px));
  overflow: hidden;
  padding: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(560px, calc(100vw - 32px));
}

.start-page-modal__head {
  align-items: center;
  background: linear-gradient(135deg, #e9f8ff 0%, #d6f1ff 100%);
  border-bottom: 1px solid #9ddcf5;
  box-sizing: border-box;
  padding: 18px 20px 17px;
  width: 100%;
}

.start-page-modal__head h3 {
  font-size: 19px;
  letter-spacing: -0.01em;
}

.start-page-modal__head p {
  font-size: 12px;
  margin-top: 4px;
}

.start-page-modal__close {
  align-items: center;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid #91cfee;
  border-radius: 9px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 32px;
  font-size: 21px;
  height: 32px;
  justify-content: center;
  line-height: 1;
  padding: 0 0 2px;
  width: 32px;
}

.start-page-modal__close:hover,
.start-page-modal__close:focus-visible {
  background: #ffffff;
  border-color: #0788c7;
  color: #056a9d;
  outline: none;
}

.start-page-modal__options {
  background: #ffffff;
  display: grid;
  gap: 8px;
  max-height: min(380px, calc(100vh - 250px));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 14px 18px;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.start-page-modal__options::-webkit-scrollbar {
  width: 8px;
}

.start-page-modal__options::-webkit-scrollbar-thumb {
  background: #b8c5d6;
  border-radius: 999px;
}

.start-page-modal__option {
  align-items: center;
  background: #f9fbfd;
  border: 1px solid #d7dee8;
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  gap: 11px;
  min-height: 48px;
  padding: 10px 13px;
  transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.start-page-modal__option:hover {
  background: #f0f9ff;
  border-color: #8ed8f5;
}

.start-page-modal__option:has(input:checked) {
  background: #e4f6ff;
  border-color: #1597d3;
  box-shadow: 0 0 0 1px rgba(21, 151, 211, 0.18);
}

.start-page-modal__option input {
  accent-color: #0788c7;
  height: 17px;
  margin: 0;
  width: 17px;
}

.start-page-modal__option-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.start-page-modal__option-copy strong {
  color: #101828;
  font-size: 13px;
  line-height: 1.3;
}

.start-page-modal__option-copy small {
  color: #667085;
  font-size: 11px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.start-page-modal__status {
  margin: 0 18px 12px;
}

.start-page-modal__actions {
  background: #f8fafc;
  border-top: 1px solid #e4e7ec;
  padding: 13px 18px;
}

.favorites-modal__backdrop {
  background: rgba(15, 23, 42, 0.38);
  inset: 0;
  position: absolute;
}

.favorites-modal__dialog {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.24);
  display: grid;
  gap: 12px;
  left: 50%;
  padding: 20px;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(420px, calc(100vw - 32px));
}

.favorites-manage-modal__dialog {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.24);
  display: grid;
  gap: 12px;
  left: 50%;
  max-height: min(720px, calc(100vh - 40px));
  overflow: hidden;
  padding: 18px;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(640px, calc(100vw - 32px));
}

.favorites-manage-modal__head {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.favorites-manage-modal__head h3 {
  color: #101828;
  font-size: 18px;
  margin: 0;
}

.favorites-manage-modal__head p {
  color: #667085;
  font-size: 12px;
  margin: 3px 0 0;
}

.favorites-manage-modal__list {
  display: grid;
  gap: 8px;
  max-height: min(480px, calc(100vh - 220px));
  overflow-y: auto;
  padding-right: 2px;
}

.favorites-manage-modal__row {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  padding: 8px;
}

.favorites-manage-modal__row.is-dragging {
  border-color: #38bdf8;
  box-shadow: 0 8px 20px rgba(14, 165, 233, 0.18);
  opacity: 0.74;
}

.favorites-manage-modal__drag {
  align-items: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 7px;
  color: #667085;
  cursor: grab;
  display: inline-flex;
  height: 30px;
  justify-content: center;
  padding: 5px;
  width: 30px;
}

.favorites-manage-modal__drag:hover,
.favorites-manage-modal__drag:focus-visible {
  background: #eef6ff;
  border-color: #93c5fd;
  color: #075985;
  outline: none;
}

.favorites-manage-modal__drag:active {
  cursor: grabbing;
}

.favorites-manage-modal__star {
  color: #ffc857;
  font-size: 16px;
}

.favorites-manage-modal__row label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.favorites-manage-modal__row label span {
  color: #667085;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.favorites-manage-modal__row label .favorites-manage-modal__context {
  color: #667085;
  display: block;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
  text-transform: none;
}

.favorites-manage-modal__row input {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  font: inherit;
  font-size: 13px;
  font-weight: 750;
  min-width: 0;
  padding: 7px 8px;
  width: 100%;
}

.favorites-manage-modal__moves {
  display: inline-flex;
  gap: 4px;
}

.favorites-manage-modal__moves .button-small {
  min-height: 28px !important;
  padding: 0 8px !important;
}

.favorites-manage-modal__actions {
  border-top: 1px solid #eef2f6;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding-top: 12px;
}

.favorites-modal__dialog h3 {
  color: #101828;
  font-size: 18px;
  margin: 0;
}

.favorites-modal__dialog label {
  color: #344054;
  display: grid;
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
}

.favorites-modal__dialog input {
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  font: inherit;
  padding: 9px 10px;
}

.favorites-modal__dialog p {
  color: #667085;
  font-size: 12px;
  margin: 0;
}

.favorites-modal__status {
  background: #fff8eb;
  border: 1px solid #fedf89;
  border-radius: 10px;
  color: #b54708;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  padding: 9px 10px;
}

.favorites-modal__status[hidden] {
  display: none !important;
}

.favorites-modal__actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.favorites-modal__actions button[hidden] {
  display: none !important;
}

.app-topnav-apps-menu {
  display: inline-flex;
  position: relative;
}

.app-topnav-apps-menu summary {
  align-items: center;
  box-sizing: border-box;
  display: inline-flex;
  height: 44px;
  justify-content: center;
  list-style: none;
  min-height: 44px;
  min-width: 44px;
  padding: 0;
  width: 44px;
}

.app-topnav-apps-menu summary::-webkit-details-marker {
  display: none;
}

.app-topnav-apps-menu__chevron {
  color: #667085;
  display: none;
}

.app-topnav-apps-menu[open] .app-topnav__button--apps {
  background: #ffffff;
  border-color: #0788c7;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.72), 0 10px 22px rgba(15, 23, 42, 0.18);
  color: #075985;
  outline: none;
  transform: translateY(-1px);
}

.app-topnav-apps-menu__panel {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 252, 255, 0.96) 100%);
  border: 1px solid rgba(46, 197, 255, 0.48);
  border-radius: 14px;
  box-sizing: border-box;
  box-shadow: 0 22px 52px rgba(15, 23, 42, 0.18);
  display: grid;
  gap: 5px;
  max-height: calc(100vh - 104px);
  max-height: calc(100dvh - 104px);
  max-width: calc(100vw - 44px);
  min-width: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 10px 9px 9px;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  transform: translateX(var(--app-topnav-apps-menu-shift-x, 0px));
  width: min(324px, calc(100vw - 44px));
  z-index: 130;
  scrollbar-color: #98a2b3 transparent;
  scrollbar-width: thin;
}

.app-topnav-apps-menu--open-right .app-topnav-apps-menu__panel {
  left: 0;
  right: auto;
}

.app-topnav-apps-menu__panel::before {
  background: linear-gradient(90deg, #2ec5ff, #5a4bff 58%, #8a2be2);
  border-radius: 999px;
  content: "";
  height: 3px;
  inset: 6px 12px auto;
  pointer-events: none;
  position: absolute;
}

.app-topnav-apps-menu__item {
  align-items: center;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(219, 229, 239, 0.72);
  border-radius: 9px;
  color: #344054;
  display: grid;
  font: inherit;
  gap: 8px;
  grid-template-columns: 32px minmax(0, 1fr);
  padding: 6px 8px;
  position: relative;
  text-align: left;
  text-decoration: none;
  transition: background .14s ease, border-color .14s ease, box-shadow .14s ease, transform .14s ease;
  width: 100%;
}

.app-topnav-apps-menu__button {
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}

.app-topnav-apps-menu__item:hover,
.app-topnav-apps-menu__item:focus-visible {
  background: #ffffff;
  border-color: rgba(46, 197, 255, 0.42);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.1);
  outline: none;
  transform: translateY(-1px);
}

.app-topnav-apps-menu__item b,
.app-topnav-apps-menu__item small {
  display: block;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.app-topnav-apps-menu__item b {
  color: #182230;
  font-size: 13px;
  font-weight: 850;
}

.app-topnav-apps-menu__item small {
  color: #667085;
  font-size: 12px;
  font-weight: 650;
  margin-top: 2px;
}

.app-topnav-apps-menu__icon {
  align-items: center;
  background: #e8fbff;
  border: 1px solid #c8ebf8;
  border-radius: 999px;
  color: #0b7894;
  display: inline-flex;
  height: 32px;
  justify-content: center;
  width: 32px;
}

.app-topnav-apps-menu__icon svg {
  fill: currentColor;
  height: 18px;
  width: 18px;
}

.app-topnav-apps-menu__item--admin b {
  color: #7C3AED;
}

.app-topnav-apps-menu__item--admin {
  background: #EDE9FE;
}

.app-topnav-apps-menu__item--admin:hover,
.app-topnav-apps-menu__item--admin:focus-visible {
  background: #EDE9FE;
  border-color: #7C3AED;
}

.app-topnav-apps-menu__icon--admin {
  background: #EDE9FE;
  border-color: #7C3AED;
  color: #7C3AED;
}

.app-topnav-apps-menu__item--spotlight b {
  color: #F4B740;
}

.app-topnav-apps-menu__item--spotlight {
  background: #FEF3C7;
}

.app-topnav-apps-menu__item--spotlight:hover,
.app-topnav-apps-menu__item--spotlight:focus-visible {
  background: #FEF3C7;
  border-color: #F4B740;
}

.app-topnav-apps-menu__icon--spotlight {
  background: #FEF3C7;
  border-color: #F4B740;
  color: #F4B740;
}

.app-topnav-apps-menu__item--org-chart b {
  color: #0EA5E9;
}

.app-topnav-apps-menu__item--org-chart {
  background: #E0F2FE;
}

.app-topnav-apps-menu__item--org-chart:hover,
.app-topnav-apps-menu__item--org-chart:focus-visible {
  background: #E0F2FE;
  border-color: #0EA5E9;
}

.app-topnav-apps-menu__icon--org-chart {
  background: #E0F2FE;
  border-color: #0EA5E9;
  color: #0EA5E9;
}

.app-topnav-apps-menu__item--development-plan b {
  color: #166534;
}

.app-topnav-apps-menu__item--development-plan {
  background: #F0FDF4;
}

.app-topnav-apps-menu__item--development-plan:hover,
.app-topnav-apps-menu__item--development-plan:focus-visible {
  background: #DCFCE7;
  border-color: #16A34A;
}

.app-topnav-apps-menu__icon--development-plan {
  background: #E6FAF7;
  border-color: #99DDD4;
  color: #0D9488;
}

.app-topnav-apps-menu__icon--reporting {
  background: #EAF8FF;
  border-color: #A5E5F5;
  color: #089FC5;
}

.app-topnav-apps-menu__glyph--seedling {
  background-color: currentColor;
  display: block;
  height: 18px;
  width: 18px;
  -webkit-mask: url("/static/icons/gd-seedling.png") center / contain no-repeat;
  mask: url("/static/icons/gd-seedling.png") center / contain no-repeat;
}


.app-topnav-apps-menu__item--performance-review b {
  color: #2563EB;
}

.app-topnav-apps-menu__item--performance-review {
  background: #DBEAFE;
}

.app-topnav-apps-menu__item--performance-review:hover,
.app-topnav-apps-menu__item--performance-review:focus-visible {
  background: #DBEAFE;
  border-color: #2563EB;
}

.app-topnav-apps-menu__icon--performance-review {
  background: #DBEAFE;
  border-color: #2563EB;
  color: #2563EB;
}

.app-topnav-apps-menu__glyph--perf-review {
  background-color: currentColor;
  display: block;
  height: 18px;
  width: 18px;
  -webkit-mask: url("/static/icons/perf-review.png") center / contain no-repeat;
  mask: url("/static/icons/perf-review.png") center / contain no-repeat;
}


.app-topnav-apps-menu__item--surveys b {
  color: #22A06B;
}

.app-topnav-apps-menu__item--surveys {
  background: #DCFCE7;
}

.app-topnav-apps-menu__item--surveys:hover,
.app-topnav-apps-menu__item--surveys:focus-visible {
  background: #DCFCE7;
  border-color: #22A06B;
}

.app-topnav-apps-menu__icon--surveys {
  background: #DCFCE7;
  border-color: #22A06B;
  color: #22A06B;
}

.app-topnav-apps-menu__item--employee-relations b {
  color: #0F9D9A;
}

.app-topnav-apps-menu__item--employee-relations {
  background: #CCFBF1;
}

.app-topnav-apps-menu__item--employee-relations:hover,
.app-topnav-apps-menu__item--employee-relations:focus-visible {
  background: #CCFBF1;
  border-color: #0F9D9A;
}

.app-topnav-apps-menu__icon--employee-relations {
  background: #CCFBF1;
  border-color: #0F9D9A;
  color: #0F9D9A;
}

.app-topnav-apps-menu__item--pip-manager b {
  color: #E87924;
}

.app-topnav-apps-menu__item--pip-manager {
  background: #FFEDD5;
}

.app-topnav-apps-menu__item--pip-manager:hover,
.app-topnav-apps-menu__item--pip-manager:focus-visible {
  background: #FFEDD5;
  border-color: #E87924;
}

.app-topnav-apps-menu__icon--pip-manager {
  background: #FFEDD5;
  border-color: #E87924;
  color: #E87924;
}

.app-topnav-apps-menu__glyph--pip-stairs {
  background-color: currentColor;
  display: block;
  height: 18px;
  width: 18px;
  -webkit-mask: url("/static/icons/pip-stairs.png") center / contain no-repeat;
  mask: url("/static/icons/pip-stairs.png") center / contain no-repeat;
}


.app-topnav-apps-menu__item--recovery b {
  color: #D64545;
}

.app-topnav-apps-menu__item--recovery {
  background: #FEE2E2;
}

.app-topnav-apps-menu__item--recovery:hover,
.app-topnav-apps-menu__item--recovery:focus-visible {
  background: #FEE2E2;
  border-color: #D64545;
}

.app-topnav-apps-menu__icon--recovery {
  background: #FEE2E2;
  border-color: #D64545;
  color: #D64545;
}

.app-topnav-apps-menu__item--proxy {
  margin-top: 2px;
}

.app-topnav-apps-menu__item--proxy b {
  color: #64748B;
}

.app-topnav-apps-menu__item--proxy {
  background: #E2E8F0;
}

.app-topnav-apps-menu__item--proxy:hover,
.app-topnav-apps-menu__item--proxy:focus-visible {
  background: #E2E8F0;
  border-color: #64748B;
}

.app-topnav-apps-menu__icon--proxy {
  background: #E2E8F0;
  border-color: #64748B;
  color: #64748B;
}

.app-topnav-apps-menu__item--spotlight { --app-menu-accent: #F4B740; }
.app-topnav-apps-menu__item--org-chart { --app-menu-accent: #0EA5E9; }
.app-topnav-apps-menu__item--development-plan { --app-menu-accent: #166534; }
.app-topnav-apps-menu__item--performance-review { --app-menu-accent: #2563EB; }
.app-topnav-apps-menu__item--surveys { --app-menu-accent: #22A06B; }
.app-topnav-apps-menu__item--employee-relations { --app-menu-accent: #0F9D9A; }
.app-topnav-apps-menu__item--pip-manager { --app-menu-accent: #E87924; }
.app-topnav-apps-menu__item--recovery { --app-menu-accent: #D64545; }
.app-topnav-apps-menu__item--proxy { --app-menu-accent: #64748B; }
.app-topnav-apps-menu__item--admin { --app-menu-accent: #7C3AED; }

.app-topnav-apps-menu__item {
  background: color-mix(in srgb, var(--app-menu-accent, #2ec5ff) 7%, #ffffff);
  border-color: color-mix(in srgb, var(--app-menu-accent, #2ec5ff) 18%, #dbe5ef);
}

.app-topnav-apps-menu__item::before {
  background: var(--app-menu-accent, #2ec5ff);
  border-radius: 0 999px 999px 0;
  content: "";
  inset: 4px auto 4px 0;
  opacity: 0.72;
  position: absolute;
  width: 3px;
}

.app-topnav-apps-menu__item:hover,
.app-topnav-apps-menu__item:focus-visible {
  background: color-mix(in srgb, var(--app-menu-accent, #2ec5ff) 11%, #ffffff);
  border-color: color-mix(in srgb, var(--app-menu-accent, #2ec5ff) 48%, #dbe5ef);
}

.app-topnav-apps-menu__item b {
  color: color-mix(in srgb, var(--app-menu-accent, #182230) 82%, #182230);
}

.app-topnav-apps-menu__icon {
  background: color-mix(in srgb, var(--app-menu-accent, #2ec5ff) 11%, #ffffff);
  border-color: color-mix(in srgb, var(--app-menu-accent, #2ec5ff) 44%, #ffffff);
  color: var(--app-menu-accent, #0b7894);
}

/* App colors live on the icon badges; cards stay quiet unless they convey a special state. */
.app-topnav-apps-menu__item {
  background: #ffffff;
  border-color: #dfe5ec;
}

.app-topnav-apps-menu__item::before {
  display: none;
}

.app-topnav-apps-menu__item:hover,
.app-topnav-apps-menu__item:focus-visible {
  background: #f8fafc;
  border-color: #98a2b3;
}

.app-topnav-apps-menu__item b {
  color: #182230;
}

.app-topnav-apps-menu__item--spotlight:not([aria-current="page"]) {
  background: #fffbeb;
  border-color: #fedf89;
}

.app-topnav-apps-menu__item--recovery:not([aria-current="page"]) {
  background: #fff5f5;
  border-color: #fecaca;
}

.app-topnav-apps-menu__item--admin:not([aria-current="page"]) {
  background: #f7f5ff;
  border-color: #ddd6fe;
}

.app-topnav-apps-menu__item--admin:not([aria-current="page"]):hover,
.app-topnav-apps-menu__item--admin:not([aria-current="page"]):focus-visible {
  background: #f3f0ff;
  border-color: #a78bfa;
}

.app-topnav-apps-menu__item[aria-current="page"] {
  background: #eff8ff;
  border-color: #53b1fd;
}

.app-topnav-apps-menu__item[aria-current="page"] b {
  color: #175cd3;
}

.pm-recovery-page {
  box-sizing: border-box;
  display: grid;
  gap: 16px;
  margin: 0;
  max-width: none;
  padding: 18px 24px 28px;
  width: 100%;
}

.pm-recovery-vault,
.pm-recovery-card,
.pm-recovery-notice {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.06);
}

.pm-recovery-vault {
  display: grid;
  overflow: hidden;
}

.pm-recovery-vault__header {
  align-items: center;
  background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
  border-bottom: 1px solid #eef2f6;
  display: grid;
  gap: 12px;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  padding: 12px 16px;
}

.pm-recovery-vault__header h3 {
  color: #101828;
  font-size: 18px;
  font-weight: 850;
  margin: 0 0 4px;
}

.pm-recovery-vault__header p {
  color: #475467;
  margin: 0;
  max-width: 52rem;
}

.pm-recovery-vault__count {
  background: #eff4ff;
  border: 1px solid #b2ccff;
  border-radius: 999px;
  color: #175cd3;
  font-size: 13px;
  font-weight: 900;
  padding: 7px 12px;
  white-space: nowrap;
}

.pm-recovery-hero__image {
  align-items: center;
  background: #fff1f3;
  border: 1px solid #fecdd3;
  border-radius: 12px;
  color: #b42318;
  display: flex;
  height: 44px;
  justify-content: center;
  width: 44px;
}

.pm-recovery-hero__image svg {
  fill: none;
  height: 30px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 5;
  width: 30px;
}

.pm-recovery-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pm-recovery-sections {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 16px 18px 18px;
}

.pm-recovery-section {
  background: #fbfdff;
  border: 1px solid #eef2f6;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 14px;
}

.pm-recovery-section .pm-section-header {
  align-items: baseline;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  margin: 0;
}

.pm-recovery-section .pm-section-header h3 {
  color: #101828;
  font-size: 15px;
  font-weight: 850;
  margin: 0;
}

.pm-recovery-card {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.pm-recovery-list {
  display: grid;
  gap: 8px;
}

.pm-recovery-list .home-empty,
.pm-recovery-section > .home-empty {
  background: #fff;
  border: 1px dashed #d0d5dd;
  border-radius: 8px;
  color: #667085;
  font-size: 13px;
  font-weight: 600;
  margin: 0;
  padding: 14px 12px;
  text-align: left;
}

.pm-recovery-item {
  align-items: center;
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-width: 0;
  padding: 12px;
  transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

.pm-recovery-item:hover {
  border-color: #b2ccff;
  box-shadow: 0 4px 12px rgba(23, 92, 211, 0.08);
}

.pm-recovery-item > div:first-child {
  min-width: 0;
}

.pm-recovery-item__title {
  color: #101828;
  font-size: 14px;
  font-weight: 800;
}

.pm-recovery-item__meta {
  color: #667085;
  font-size: 12px;
  margin-top: 3px;
}

.pm-recovery-item__actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.pm-recovery-notice {
  color: #027a48;
  font-size: 14px;
  font-weight: 800;
  padding: 10px 12px;
}

.pm-recovery-notice--danger {
  color: #b42318;
}

@media (max-width: 960px) {
  .pm-recovery-sections {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  .pm-recovery-page {
    padding: 14px 14px 22px;
  }

  .pm-recovery-vault__header {
    grid-template-columns: 1fr;
    justify-items: start;
  }

  .pm-recovery-grid {
    grid-template-columns: 1fr;
  }

  .pm-recovery-item {
    align-items: stretch;
    flex-direction: column;
  }
}

.admin-access-tabs {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 14px;
}

.admin-access-tab {
  background: #f2f4f7;
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  color: #344054;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  padding: 7px 12px;
  text-align: center;
  text-decoration: none;
}

.admin-access-tab:hover {
  background: #e9eef5;
}

.admin-access-tab.is-active {
  background: var(--app-action-primary);
  border-color: var(--app-action-primary-border);
  color: #ffffff;
}

.admin-access-intro {
  color: #475467;
  font-size: 14px;
  line-height: 1.45;
  margin: 0 0 14px;
  max-width: 920px;
}

.admin-field-mapping-scan-card .field-management-section-header {
  margin-bottom: 12px;
}

.admin-field-mapping-scan {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.admin-field-mapping-scan__file {
  flex: 1 1 16rem;
  gap: 4px;
  margin: 0;
  max-width: 28rem;
  min-width: 12rem;
}

.admin-field-mapping-scan__file .ks-field__control {
  height: auto;
  min-height: var(--app-control-height, 38px);
  padding-block: 6px;
}

.admin-field-mapping-form {
  display: block;
}

.admin-field-mapping-form .field-management-section-footer {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}

.admin-field-mapping-section--soon {
  background: #f8fafc;
  border-style: dashed;
}

.admin-field-mapping-table {
  min-width: 780px;
  table-layout: fixed;
  width: 100%;
}

.admin-field-mapping-table thead th,
.admin-field-mapping-table tbody td {
  padding-bottom: 14px;
  padding-top: 14px;
  vertical-align: middle;
}

.admin-field-mapping-table th:nth-child(1),
.admin-field-mapping-table td:nth-child(1) {
  width: 16%;
}

.admin-field-mapping-table th:nth-child(2),
.admin-field-mapping-table td:nth-child(2) {
  white-space: nowrap;
  width: 6.5rem;
}

.admin-field-mapping-table th:nth-child(3),
.admin-field-mapping-table td:nth-child(3) {
  width: 24%;
}

.admin-field-mapping-table th:nth-child(4),
.admin-field-mapping-table td:nth-child(4),
.home-cycles-table.people-directory-table.admin-field-mapping-table thead th:nth-child(4),
.home-cycles-table.people-directory-table.admin-field-mapping-table tbody td:nth-child(4) {
  text-align: center;
  white-space: nowrap;
  width: 6.5rem;
}

.admin-field-mapping-table th:nth-child(5),
.admin-field-mapping-table td:nth-child(5) {
  width: 18%;
}

.admin-field-mapping-table th:nth-child(6),
.admin-field-mapping-table td:nth-child(6) {
  min-width: 5.5rem;
  white-space: normal;
  width: 6.5rem;
}

.admin-field-mapping-table th:nth-child(7),
.admin-field-mapping-table td:nth-child(7),
.home-cycles-table.people-directory-table.admin-field-mapping-table thead th:last-child,
.home-cycles-table.people-directory-table.admin-field-mapping-table tbody td:last-child {
  text-align: center;
  white-space: nowrap;
  width: 5.5rem;
}

.admin-field-mapping-row.is-warning > td {
  background: #fffcf5;
}

.admin-field-mapping-key {
  display: block;
  font-size: 12px;
  font-weight: 500;
  margin-top: 2px;
}

.admin-field-mapping-select,
.admin-field-mapping-rename,
.admin-field-mapping-type {
  gap: 0;
  margin: 0;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.admin-field-mapping-rename .ks-field__control {
  min-width: 10rem;
  width: 100%;
}

.admin-field-mapping-field {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-field-mapping-required-bubble {
  background: #fef3f2;
  border: 1px solid #fecdca;
  border-radius: 999px;
  color: #b42318;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1;
  padding: 4px 8px;
  white-space: nowrap;
}

.admin-field-mapping-enabled.employee-signal-status-toggle {
  align-items: flex-start;
  color: #344054;
  display: inline-flex;
  flex-direction: column;
  font-size: 12px;
  font-weight: 900;
  gap: 4px;
  min-width: 0;
  position: relative;
  user-select: none;
}

.admin-field-mapping-enabled.employee-signal-status-toggle.is-changed {
  box-sizing: border-box;
  max-width: 100%;
  padding-left: 8px;
}

.admin-field-mapping-enabled.employee-signal-status-toggle > .app-change-was {
  display: block;
  line-height: 1.25;
  margin: 0;
  max-width: 100%;
  position: static;
  white-space: normal;
}

.admin-field-mapping-enabled .employee-signal-status-switch {
  align-items: center;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 900;
  gap: 0;
  /* Match Name/Source control height so the 24px track sits mid-row */
  min-height: var(--app-control-height);
  padding: 0;
}

.admin-field-mapping-enabled .employee-signal-status-track {
  background: #d0d5dd;
  border: 1px solid #b8c2cc;
  border-radius: 999px;
  display: inline-block;
  flex: 0 0 auto;
  height: 24px;
  position: relative;
  transition: background 0.16s ease, border-color 0.16s ease;
  width: 44px;
}

.admin-field-mapping-enabled .employee-signal-status-track::after {
  background: #ffffff;
  border-radius: 999px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.14);
  content: "";
  height: 18px;
  left: 2px;
  position: absolute;
  top: 2px;
  transition: transform 0.16s ease;
  width: 18px;
}

.admin-field-mapping-enabled:has(input[value="enabled"]:checked) .employee-signal-status-track {
  background: #2ec5ff;
  border-color: #0ea5e9;
}

.admin-field-mapping-enabled:has(input[value="enabled"]:checked) .employee-signal-status-track::after {
  transform: translateX(20px);
}

.admin-field-mapping-enabled:has(input[value="enabled"]:checked) .employee-signal-status-switch {
  color: #0f172a;
}

.admin-field-mapping-enabled input[type="radio"] {
  height: 1px;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 1px;
}

.admin-field-mapping-enabled:has(input[type="radio"]:focus-visible) .employee-signal-status-track,
.admin-field-mapping-enabled .employee-signal-status-switch:focus-visible .employee-signal-status-track {
  outline: 2px solid #0088ff;
  outline-offset: 2px;
}

.admin-field-mapping-type-label {
  color: #475467;
  font-size: 13px;
  font-weight: 600;
}

.admin-field-mapping-row.is-unmapped > td {
  background: #fcfcfd;
}

.admin-field-mapping-status {
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.admin-field-mapping-status.is-ok { color: #027a48; }
.admin-field-mapping-status.is-warn { color: #b54708; }
.admin-field-mapping-status.is-miss { color: #b42318; }
.admin-field-mapping-status.is-idle { color: #98a2b3; }

.cycle-participants-hub-table {
  width: 100%;
}

.cycle-participants-hub-table .cycle-participants-hub-count {
  color: #075985;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  padding: 4px 10px;
  border-radius: 999px;
  background: #e0f2fe;
  border: 1px solid #b9e6fe;
  font-weight: 800;
  text-decoration: none;
}

.cycle-participants-hub-table .cycle-participants-hub-count:hover {
  background: #eff8ff;
  border-color: #53b1fd;
}

.admin-access-intro strong {
  color: #344054;
  font-weight: 700;
}

.people-directory-pagination {
  align-items: center;
  color: #475467;
  display: flex;
  flex-wrap: wrap;
  font-size: 13px;
  gap: 10px 14px;
  margin: 14px 0 8px;
}

.people-directory-pagination__summary {
  font-weight: 600;
  margin-right: 4px;
}

.people-directory-pagination input[type="number"] {
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  box-sizing: border-box;
  font: inherit;
  min-height: 34px;
  padding: 4px 8px;
  text-align: center;
  width: 56px;
}

.people-directory-pagination .people-directory-page-nav--disabled {
  cursor: not-allowed;
  opacity: 0.45;
  pointer-events: none;
}

/* Shared table pager (User Assignments gold pattern) */
.app-table-pager-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  justify-content: space-between;
  margin-top: 12px;
}

.app-table-pager {
  align-items: center;
  display: flex;
  flex: 1 1 240px;
  flex-wrap: wrap;
  gap: 10px 14px;
  justify-content: space-between;
  min-width: 0;
}

.app-table-pager-row .app-page-size,
.app-table-pager__size {
  margin-left: auto;
}

.app-table-pager__size {
  align-items: center;
  display: inline-flex;
  margin: 0;
}

.app-table-pager__summary {
  color: #475467;
  font-size: 13px;
}

.app-table-pager__summary strong {
  color: #1d2939;
  font-weight: 700;
}

.app-table-pager__muted {
  color: #98a2b3;
  font-weight: 500;
}

.app-table-pager__actions {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px 12px;
}

.app-table-pager__controls {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
}

.app-table-pager__page,
.app-table-pager__nav,
.app-table-pager__goto-btn {
  align-items: center;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 13px;
  font-weight: 650;
  justify-content: center;
  min-height: 34px;
  min-width: 34px;
  padding: 4px 10px;
  text-decoration: none;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}

a.app-table-pager__page:hover,
a.app-table-pager__nav:hover,
.app-table-pager__goto-btn:hover {
  background: #f8fafc;
  border-color: #98a2b3;
}

.app-table-pager__page.is-current {
  background: #eff8ff;
  border-color: #84caff;
  color: #175cd3;
  cursor: default;
}

.app-table-pager__nav.is-disabled {
  cursor: not-allowed;
  opacity: 0.4;
  pointer-events: none;
}

.app-table-pager__goto {
  align-items: center;
  color: #475467;
  display: inline-flex;
  font-size: 12px;
  font-weight: 650;
  gap: 6px;
  margin: 0;
  white-space: nowrap;
}

.app-table-pager__goto input {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  font: inherit;
  max-width: 64px;
  min-height: 34px;
  padding: 4px 8px;
  text-align: center;
  width: 64px;
}

.app-table-pager__goto-btn {
  min-width: 44px;
}

.app-table-pager__ellipsis {
  color: #98a2b3;
  font-weight: 700;
  min-width: 18px;
  text-align: center;
}

.app-table-scroll {
  height: var(--app-table-scroll-height);
  max-height: var(--app-table-scroll-height);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  width: 100%;
}

html[data-keshero-theme="dark"] .app-table-pager__summary,
html[data-keshero-theme="dark"] .app-table-pager__goto {
  color: #98a2b3;
}

html[data-keshero-theme="dark"] .app-table-pager__summary strong {
  color: #f8fafc;
}

html[data-keshero-theme="dark"] .app-table-pager__page,
html[data-keshero-theme="dark"] .app-table-pager__nav,
html[data-keshero-theme="dark"] .app-table-pager__goto-btn {
  background: #1f2937;
  border-color: #374151;
  color: #e5e7eb;
}

html[data-keshero-theme="dark"] .app-table-pager__page.is-current {
  background: #12263a;
  border-color: #38bdf8;
  color: #7dd3fc;
}

.topbar-profile-menu {
  position: relative;
}

.topbar-profile-menu summary {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 999px;
  box-shadow: none;
  cursor: pointer;
  display: inline-flex;
  list-style: none;
  min-height: 0;
  padding: 0;
  transition: transform 0.14s ease;
}

.topbar-profile-menu summary::-webkit-details-marker {
  display: none;
}

.topbar-profile-menu summary:hover,
.topbar-profile-menu summary:focus-visible,
.topbar-profile-menu[open] summary {
  background: transparent;
  box-shadow: none;
  outline: none;
  transform: translateY(-1px);
}

.topbar-profile-menu summary:hover .topbar-profile-avatar,
.topbar-profile-menu summary:focus-visible .topbar-profile-avatar,
.topbar-profile-menu[open] summary .topbar-profile-avatar {
  border-color: #7dd3fc;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.18);
}

html[data-keshero-theme="dark"] .topbar-profile-menu summary {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: inherit;
}

.topbar-profile-avatar {
  align-items: center;
  background: linear-gradient(135deg, #2ec5ff 0%, #8a2be2 100%);
  border: 2px solid rgba(255, 255, 255, 0.88);
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16);
  display: inline-flex;
  height: 40px;
  justify-content: center;
  overflow: hidden;
  padding: 2px;
  width: 40px;
}

.topbar-profile-avatar img {
  border-radius: inherit;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.topbar-profile-avatar__placeholder {
  align-items: center;
  background: #98a2b3;
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  height: 100%;
  justify-content: center;
  letter-spacing: 0;
  line-height: 1;
  position: relative;
  width: 100%;
}

.topbar-profile-avatar__placeholder::after {
  content: none;
}

.topbar-profile-menu__chevron {
  display: none;
}

.topbar-profile-menu[open] .topbar-profile-menu__chevron {
  transform: rotate(180deg);
}

.topbar-profile-menu__panel {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-sizing: border-box;
  box-shadow: 0 22px 52px rgba(15, 23, 42, 0.2);
  display: grid;
  gap: 4px;
  min-width: 250px;
  padding: 10px;
  position: absolute;
  right: 0;
  top: calc(100% + 12px);
  z-index: 80;
}

.topbar-profile-menu:not([open]) .topbar-profile-menu__panel {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 22px 52px rgba(15, 23, 42, 0.2);
  display: grid;
  gap: 4px;
  min-width: 250px;
  padding: 10px;
  position: absolute;
  right: 0;
  top: calc(100% + 12px);
  z-index: 80;
}

.topbar-profile-menu__identity {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-sizing: border-box;
  color: #0f172a;
  display: grid;
  gap: 2px;
  margin-bottom: 6px;
  max-width: 100%;
  padding: 4px 10px 8px;
}

.topbar-profile-menu__identity span {
  color: #667085;
  font-size: 12px;
  font-weight: 700;
}

.topbar-profile-menu__panel a,
.topbar-profile-menu__panel button {
  background: transparent;
  border: 0;
  border-radius: 7px;
  box-sizing: border-box;
  color: #344054;
  cursor: pointer;
  display: block;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  padding: 9px 10px;
  text-align: left;
  text-decoration: none;
  width: 100%;
}

.topbar-profile-menu__panel a:hover,
.topbar-profile-menu__panel button:hover,
.topbar-profile-menu__panel a:focus-visible,
.topbar-profile-menu__panel button:focus-visible {
  background: #f2f4f7;
  outline: none;
}

.topbar-profile-menu__panel form {
  margin: 0;
}

@media (max-width: 760px) {
  body {
    padding-left: 12px;
    padding-right: 12px;
  }

  .topbar {
    position: static;
  }

  .topbar-row--nav {
    align-items: flex-start;
    flex-direction: column;
  }

  .topbar-row--nav > .proxy-mode-banner {
    left: auto;
    max-width: 100%;
    order: 2;
    position: relative;
    top: auto;
    transform: none;
    width: 100%;
  }

  .topbar-row--nav .topbar-right-cluster {
    justify-content: flex-end;
    order: 3;
    width: 100%;
  }

  .topbar-brand-identity {
    order: 1;
    width: 100%;
  }

  .topbar-row--lower {
    align-items: stretch;
    flex-direction: column;
  }

  .topbar-lower-search {
    flex-basis: auto;
    max-width: 100%;
    min-width: 0;
    width: 100%;
  }

  .topbar-row--lower .topbar-search-actions {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }

  .topbar-nav-search {
    flex: 1 1 100%;
    max-width: 100%;
    order: -1;
    width: 100%;
  }

  .topbar-right-cluster {
    align-items: flex-end;
    justify-content: flex-end;
  }

  .proxy-mode-banner {
    max-width: calc(100% - 8px);
    width: auto;
  }

  .topbar-right-bubbles {
    justify-content: flex-end;
    margin-right: 0;
    width: 100%;
  }

  .topbar-search-actions {
    flex: 1 1 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-left: 0;
    width: 100%;
  }

  .topbar-search-actions .topbar-search-wrap {
    flex-basis: 100%;
    max-width: 100%;
  }

  .topbar-after-search {
    width: 100%;
  }

  .app-topnav {
    justify-content: flex-end;
  }

  .app-topnav__link {
    font-size: 13px;
    min-height: 34px;
    padding: 7px 10px;
  }

  .app-topnav-apps-menu summary {
    height: 34px;
    min-height: 34px;
    padding: 7px 10px;
  }

  .topbar-profile-menu {
    margin-left: auto;
  }
}

@media (max-width: 1280px) {
  .app-topnav__icon {
    height: 24px;
    width: 24px;
  }
  .app-topnav__star {
    font-size: 20px;
  }
  .app-topnav {
    flex-wrap: nowrap;
    gap: 6px;
  }

  .app-topnav__link,
  .app-topnav__button,
  .app-topnav-favorites-menu > summary,
  .app-topnav-apps-menu summary {
    gap: 0;
    height: 43px;
    justify-content: center;
    min-height: 43px;
    min-width: 43px;
    padding: 0;
    width: 43px;
  }

  .app-topnav__label {
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
  }

  .app-topnav-apps-menu__chevron {
    display: none;
  }

  .app-topnav [data-topnav-tooltip]::after {
    background: #101828;
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(16, 24, 40, 0.18);
    color: #fff;
    content: attr(data-topnav-tooltip);
    font-size: 12px;
    font-weight: 800;
    left: 50%;
    line-height: 1;
    max-width: 220px;
    opacity: 0;
    overflow: hidden;
    padding: 8px 10px;
    pointer-events: none;
    position: absolute;
    text-overflow: ellipsis;
    top: calc(100% + 8px);
    transform: translate(-50%, -4px);
    transition: opacity 0.14s ease, transform 0.14s ease;
    white-space: nowrap;
    z-index: 250;
  }

  .app-topnav [data-topnav-tooltip]::before {
    border: 5px solid transparent;
    border-bottom-color: #101828;
    content: "";
    left: 50%;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: calc(100% - 1px);
    transform: translate(-50%, -4px);
    transition: opacity 0.14s ease, transform 0.14s ease;
    z-index: 251;
  }

  .app-topnav [data-topnav-tooltip]:hover::after,
  .app-topnav [data-topnav-tooltip]:focus-visible::after,
  .app-topnav [data-topnav-tooltip]:hover::before,
  .app-topnav [data-topnav-tooltip]:focus-visible::before {
    opacity: 1;
    transform: translate(-50%, 0);
  }

  .app-topnav-favorites-menu[open] > [data-topnav-tooltip]::after,
  .app-topnav-favorites-menu[open] > [data-topnav-tooltip]::before,
  .app-topnav-apps-menu[open] > [data-topnav-tooltip]::after,
  .app-topnav-apps-menu[open] > [data-topnav-tooltip]::before,
  .app-topnav__button--notifications[aria-expanded="true"]::after,
  .app-topnav__button--notifications[aria-expanded="true"]::before {
    opacity: 0;
    transform: translate(-50%, -4px);
  }

  .app-topnav__button--notifications .topbar-inbox-badge,
  .app-topnav__button--calendar .topbar-inbox-badge {
    font-size: 10px;
    height: 18px;
    min-width: 18px;
    padding: 0 5px;
    position: absolute;
    right: -5px;
    top: -5px;
  }
}

/* Page blurb below the topbar (not under username) */
.page-intro {
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  box-shadow: var(--app-shadow-card);
  font-size: 13px;
  color: #475467;
  margin: 0 0 16px 0;
  max-width: 1100px;
  line-height: 1.45;
  padding: 14px 16px;
}

/* Same width/centering as .succession-config-form / .comp-config-form on admin edit shells */
.page-intro.page-intro--edit-shell-width {
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  max-width: min(1180px, 100%);
  min-width: 0;
  width: 100%;
}

/* Performance Rating cycle edit: match full-width cards (body gutters only). */
.page-intro.page-intro--cycle-edit-width {
  box-sizing: border-box;
  max-width: none;
  min-width: 0;
  width: 100%;
}

.page-intro.page-intro--grid-lock-warning {
  background: #fffaeb;
  border: 1px solid #fec84b;
  border-left: 4px solid #f79009;
  box-shadow: none;
  color: #7a2e0e;
  margin-bottom: 12px;
}

.page-intro.page-intro--grid-lock-warning p {
  margin: 0;
}

.page-intro.page-intro--grid-lock-warning strong {
  color: #b54708;
}

html[data-keshero-theme="dark"] .page-intro.page-intro--grid-lock-warning {
  background: #3d2e12;
  border-color: #f79009;
  color: #fecd89;
}

html[data-keshero-theme="dark"] .page-intro.page-intro--grid-lock-warning strong {
  color: #f79009;
}

.panel {
  box-sizing: border-box;
  display: block;
  max-width: none;
  min-width: 0;
  width: 100%;
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  box-shadow: var(--app-shadow-card);
  padding: var(--app-card-padding);
}

.app-card,
.home-table-wrap,
.inbox-panel,
.spotlight-compose,
.spotlight-card,
.succession-edit-section,
.pm-card,
.admin-proxy-user-row,
.comp-config-section,
.comp-analysis-card,
.comp-stat-card,
.spotlight-dashboard,
.succession-bench-card,
.succession-bench-container-card,
.perf-da-card,
.grid-top-legend-panel,
.grid-charts-panel {
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  box-sizing: border-box;
  box-shadow: var(--app-shadow-card);
  max-width: 100%;
  min-width: 0;
}

.app-card,
.home-table-wrap,
.inbox-panel,
.spotlight-compose,
.spotlight-card,
.succession-edit-section,
.pm-card,
.comp-config-section,
.spotlight-dashboard,
.grid-top-legend-panel,
.grid-charts-panel {
  padding: var(--app-card-padding);
}

.home-table-wrap h3,
.pm-card h3,
.succession-edit-section h3,
.comp-config-section h3,
.spotlight-compose h3,
.spotlight-stream h3,
.spotlight-dashboard-header h3,
.comp-analysis-card span,
.comp-stat-card span {
  letter-spacing: 0;
}

.app-card h3:first-child,
.panel h3:first-child,
.home-table-wrap h3:first-child,
.pm-card h3:first-child,
.succession-edit-section h3:first-child,
.comp-config-section h3:first-child {
  color: var(--app-heading);
  margin-top: 0;
}

.app-card:hover,
.home-table-wrap:hover,
.pm-card:hover,
.succession-edit-section:hover,
.comp-config-section:hover,
.spotlight-card:hover {
  box-shadow: var(--app-shadow-card-hover);
}

.grid-main-area {
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: stretch;
}

/* N-Box workspace: the overview, map, and employee table read as three deliberate steps. */
.cycle-grid-workspace {
  padding: clamp(14px, 1.6vw, 22px);
}

.cycle-grid-section-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  min-width: 0;
}

.cycle-grid-section-heading__copy {
  min-width: 0;
}

.cycle-grid-section-heading__copy p {
  margin: 3px 0 0;
  color: #667085;
  font-size: 12px;
  line-height: 1.4;
}

.cycle-grid-section-heading__title {
  color: #102a43;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.2;
}

.cycle-grid-section-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border: 2px solid #7dd3fc;
  border-radius: 50%;
  background: #075985;
  box-shadow: inset 0 0 0 2px #e0f2fe;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
}

.cycle-grid-section-step--compact {
  width: 24px;
  height: 24px;
  border-width: 1px;
  font-size: 12px;
}

/* Full-width header + legend above heatmap / charts */
.grid-top-legend {
  width: 100%;
  box-sizing: border-box;
  padding: 16px 18px;
  background: linear-gradient(135deg, #f0f9ff 0%, #f8fbff 50%, #f5f3ff 100%);
  border: 1px solid #c7e4f7;
  border-radius: 12px;
  font-size: 14px;
}

.cycle-grid-section-heading--summary {
  padding-bottom: 12px;
  border-bottom: 1px solid #d8e7f3;
}

.cycle-grid-section-heading__actions {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
}

.cycle-grid-edit-setup-action {
  background: #fff;
  border-color: #b9d9ed;
  color: #075985;
  font-weight: 800;
  text-decoration: none;
}

.cycle-grid-edit-setup-action:hover,
.cycle-grid-edit-setup-action:focus-visible {
  background: #e0f2fe;
  border-color: #38bdf8;
  color: #0c4a6e;
}

.grid-top-legend-title {
  color: #102a43;
  font-weight: 800;
  font-size: 17px;
  margin: 0;
  letter-spacing: 0.01em;
}

.cycle-grid-total-pill {
  align-self: center;
  margin-left: 0;
  padding: 5px 9px;
  border: 1px solid #bae6fd;
  border-radius: 999px;
  background: #fff;
  color: #075985;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.grid-top-legend-panel {
  margin-top: 10px;
  padding: 14px 18px;
  background: #fff !important;
  border: 1px solid #e0e4ea;
  border-radius: 6px;
}

/* These chart/legend cards use a quiet white surface; avoid the shared
   decorative accent strip competing with the chart content. */
.grid-top-legend-panel::before,
.grid-charts-panel::before {
  display: none;
}

.grid-top-legend-heading {
  font-weight: 700;
  margin-bottom: 8px;
}

.grid-top-legend-blurb {
  color: #444;
  margin-bottom: 12px;
  line-height: 1.45;
}

.grid-top-legend-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 28px;
  align-items: center;
}

.grid-top-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.grid-top-legend-swatch {
  width: 22px;
  height: 22px;
  border: 1px solid #999;
  border-radius: 3px;
  flex-shrink: 0;
}

.grid-filters-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 12px 16px;
  width: 100%;
  box-sizing: border-box;
  padding: 14px 18px 16px;
  background: #fafbfc;
  border: 1px solid #d8dde4;
  border-radius: 8px;
  font-size: 14px;
}

.grid-filters-bar-title {
  font-weight: 700;
  margin-right: 4px;
  padding-bottom: 2px;
  align-self: center;
}

/* Treat the N-Box filter label as a section heading, with controls below it. */
.cycle-grid-workspace .grid-filters-bar-title {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 100%;
  align-self: auto;
  margin-right: 0;
  padding-bottom: 0;
  font-size: 14px;
}

.grid-filter-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.grid-filter-label {
  font-size: 12px;
  color: #444;
  font-weight: 600;
}

.grid-filter-select {
  min-width: 160px;
  max-width: 220px;
  padding: 4px 8px;
  font-size: 13px;
}

.grid-filter-field--dropdown {
  max-width: min(280px, 100%);
}

.grid-filter-dropdown {
  position: relative;
  width: 100%;
  min-width: 160px;
  max-width: 280px;
}

.grid-filter-dropdown-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  text-align: left;
  padding: 6px 10px;
  font-size: 13px;
  font-weight: 500;
  color: #222;
  background: #fff;
  border: 1px solid #c5cdd8;
  border-radius: 6px;
  cursor: pointer;
  box-sizing: border-box;
  font-family: inherit;
  min-height: 40px;
}

.grid-filter-dropdown-toggle:hover {
  border-color: #98a3b3;
}

.grid-filter-dropdown-toggle:focus {
  outline: 2px solid var(--keshero-blue);
  outline-offset: 1px;
}

.grid-filter-dropdown-chevron {
  flex-shrink: 0;
  font-size: 10px;
  line-height: 1;
  color: #555;
  transition: transform 0.15s ease;
}

.grid-filter-dropdown.is-open .grid-filter-dropdown-chevron {
  transform: rotate(180deg);
}

.grid-filter-dropdown-panel {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 50;
  width: min(320px, 84vw);
  min-width: min(240px, 84vw);
  max-width: min(360px, 84vw);
  max-height: 260px;
  overflow-y: auto;
  padding: 6px;
  margin: 0;
  background: #fff;
  border: 1px solid #c5cdd8;
  border-radius: 10px;
  box-shadow: 0 18px 38px rgba(16, 24, 40, 0.16);
  font-size: 13px;
  font-weight: 400;
  flex-direction: column;
  gap: 2px;
  box-sizing: border-box;
}

.grid-filter-dropdown-panel.is-floating {
  right: auto;
  z-index: 10050;
}

.grid-filter-dropdown.is-open .grid-filter-dropdown-panel {
  display: flex;
}

.grid-filter-dropdown-panel[hidden] {
  display: none !important;
}

.grid-filter-dropdown-summary {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.grid-filter-check-label {
  align-items: center;
  border-radius: 7px;
  color: #101828;
  cursor: pointer;
  display: grid;
  font-size: 13px;
  font-weight: 700;
  gap: 9px;
  grid-template-columns: 16px minmax(0, 1fr);
  line-height: 1.25;
  min-height: 34px;
  padding: 7px 8px;
}

.grid-filter-check-label:hover {
  background: #f2f4f7;
}

.grid-filter-check-label:has(input[data-select-all-checkbox]),
.grid-filter-check-label:has(input[data-grid-filter-select-all]) {
  border-bottom: 1px solid #eaecf0;
  border-radius: 7px 7px 0 0;
  color: #1d4ed8;
  font-weight: 900;
  margin-bottom: 3px;
  padding-bottom: 9px;
}

.grid-filter-check-label input {
  accent-color: var(--app-checkbox-checked-bg, #12b76a);
  box-sizing: border-box;
  flex-shrink: 0;
  height: 16px;
  margin: 0;
  min-height: 0;
  width: 16px;
}

input[type="checkbox"][data-indeterminate="true"] {
  /* Shared indeterminate mark comes from design_system.css (white dash). */
  accent-color: var(--app-checkbox-checked-bg, var(--keshero-blue, #2ec5ff));
}

.grid-filter-check-label span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.grid-filter-check-label[hidden] {
  display: none !important;
}

.grid-filter-search-tools {
  border-bottom: 1px solid #eaecf0;
  margin: 0 0 4px;
  padding: 4px 4px 8px;
}

.grid-filter-search-input {
  background: #fff;
  border: 1px solid #c5cdd8;
  border-radius: 7px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  font-size: 13px;
  min-height: 34px;
  padding: 7px 9px;
  width: 100%;
}

.grid-filter-search-input:focus {
  border-color: var(--keshero-blue, #2ec5ff);
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  outline: none;
}

.grid-filter-overflow-tooltip {
  background: #173b63;
  border-radius: 7px;
  box-shadow: 0 12px 28px rgba(16, 24, 40, 0.18);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  max-width: min(360px, calc(100vw - 24px));
  opacity: 0;
  padding: 7px 9px;
  pointer-events: none;
  position: fixed;
  transform: translateY(3px);
  transition: opacity 0.12s ease, transform 0.12s ease;
  white-space: normal;
  width: max-content;
  z-index: 11000;
}

.grid-filter-overflow-tooltip.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.home-sv-filter-options label {
  align-items: center !important;
  border-radius: 8px;
  color: var(--app-text, #101828) !important;
  cursor: pointer;
  display: grid !important;
  font-size: 13px;
  font-weight: 600 !important;
  gap: 8px !important;
  grid-template-columns: 16px minmax(0, 1fr);
  line-height: 1.25;
  min-height: 32px;
  padding: 4px 8px;
}

.home-sv-filter-options label:hover {
  background: #f8fafc;
}

.home-sv-filter-options label:has(input[data-select-all-checkbox]) {
  border-bottom: 1px solid #eaecf0 !important;
  border-radius: 8px 8px 0 0;
  color: var(--app-label-color, #344054) !important;
  font-weight: 800 !important;
  margin-bottom: 2px !important;
  padding-bottom: 8px !important;
}

.home-sv-filter-options input[type="checkbox"] {
  color: var(--app-checkbox-mark, #ffffff);
  height: var(--app-checkbox-size, 16px);
  width: var(--app-checkbox-size, 16px);
}

.home-sv-filter-options input[type="checkbox"]:checked {
  background-color: var(--app-checkbox-checked-bg, #12b76a);
  border-color: var(--app-checkbox-checked-border, #039855);
}

.home-sv-filter-options input[type="checkbox"]:checked::after {
  border-color: var(--app-checkbox-mark, #ffffff);
}

.home-sv-filter-options input[type="checkbox"][data-indeterminate="true"]::after {
  background: var(--app-checkbox-mark, #ffffff);
}

.home-sv-filter-options span {
  color: inherit !important;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-sv-name-label {
  color: var(--app-label-color, #344054) !important;
  display: block;
  font-size: 12px;
  font-weight: 800;
  line-height: 18px;
}

.home-sv-name-input {
  background: var(--app-field-bg, #fff) !important;
  border: 1px solid var(--app-field-border, #d0d5dd) !important;
  border-radius: var(--app-field-radius, 8px) !important;
  box-sizing: border-box;
  color: var(--app-field-text, #101828) !important;
  max-width: 420px;
  min-height: var(--app-control-height, 38px) !important;
  min-width: 240px;
  padding: 0 12px !important;
  width: min(100%, 420px);
}

.home-sv-name-input:focus {
  border-color: var(--app-field-focus, var(--app-action-primary, #2ec5ff)) !important;
  box-shadow: 0 0 0 4px var(--app-focus-ring, rgba(46, 197, 255, 0.32));
  outline: none;
}

.home-sv-filter-options {
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  display: grid;
  gap: 1px;
  max-height: 132px;
  overflow: auto;
  padding: 4px;
}

.home-sv-filter-options .home-sv-filter-option,
.home-sv-filter-options .home-sv-filter-select-all {
  align-items: center !important;
  display: grid !important;
  gap: 8px !important;
}

.home-sv-filter-options .home-sv-filter-option {
  font-weight: 600;
}

.home-sv-filter-options .home-sv-filter-select-all {
  border-bottom: 1px solid #eaecf0 !important;
  font-weight: 800 !important;
  margin-bottom: 2px !important;
  padding-bottom: 6px !important;
}

.grid-filter-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  padding-bottom: 1px;
  align-self: flex-end;
}

.grid-filter-clear {
  font-size: 13px;
  color: var(--keshero-blue);
}

.stat-analysis-table-wrap {
  overflow: auto;
}

.stat-analysis-table-wrap--spaced {
  margin-bottom: 14px;
}

.stat-analysis-table {
  border-collapse: collapse;
  width: 100%;
}

.stat-analysis-cell--left {
  text-align: left;
}

.stat-analysis-cell--center {
  text-align: center;
}

.stat-analysis-cell--right {
  text-align: right;
}

.stat-analysis-cell--notes {
  min-width: 260px;
  text-align: left;
}

.stat-note-input {
  min-width: 240px;
  width: 100%;
}

.perf-rounds-cell--left {
  text-align: left;
}

.perf-rounds-cell--center {
  text-align: center;
}

.perf-rounds-cell--order-number {
  width: 72px;
}

.perf-rounds-cell--order-actions {
  width: 104px;
}

.perf-rounds-cell--remove {
  width: 96px;
}

.perf-rounds-panel,
.perf-rounds-table-wrap {
  max-width: 820px;
}

.perf-rounds-table-wrap {
  background: #ffffff;
  border-color: #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  margin-top: 8px;
}

table.perf-rounds-table {
  border-collapse: separate;
  border-spacing: 0;
  margin: 0;
  max-width: none;
  min-width: 560px;
  table-layout: fixed;
  width: 100%;
}

table.perf-rounds-table th.cell {
  background: #f8fafc;
  border-bottom: 1px solid #dbe5ef;
  color: #344054;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.01em;
  padding: 10px 12px;
  text-transform: none;
}

table.perf-rounds-table th.cell.perf-rounds-cell--left {
  text-align: left;
}

table.perf-rounds-table th.cell.perf-rounds-cell--center {
  text-align: center;
}

table.perf-rounds-table td.cell {
  background: #ffffff;
  border-bottom: 1px solid #eaecf0;
  padding: 11px 12px;
  vertical-align: middle;
}

table.perf-rounds-table tbody tr:last-child td.cell {
  border-bottom: 0;
}

table.perf-rounds-table tbody tr:hover td.cell {
  background: #f8fcff;
}

.perf-rounds-section--spaced {
  margin-top: 18px;
}

.perf-rounds-warning {
  background: #f8fafc;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  color: #1f2937;
  font-size: 13px;
  line-height: 1.4;
  margin: 8px 0 12px;
  padding: 10px 12px;
}

.perf-rounds-async-message {
  display: none;
  font-weight: 700;
  margin-bottom: 10px;
}

.perf-rounds-async-message--visible {
  display: block;
}

.perf-rounds-async-message--error {
  color: #b42318;
}

.perf-rounds-async-message--success {
  color: #067647;
}

.perf-rounds-name-input {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  min-height: 36px;
  padding: 7px 10px;
  width: 100%;
}

.perf-rounds-name-input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  outline: none;
}

.perf-rounds-score-note {
  align-items: center;
  background: #f2f4f7;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #475467;
  display: inline-flex;
  font-size: 11px;
  font-weight: 700;
  margin-top: 0;
  padding: 3px 7px;
  white-space: nowrap;
}

.perf-rounds-scores-cell {
  vertical-align: middle;
  white-space: nowrap;
}

.perf-rounds-score-empty {
  color: #98a2b3;
  font-size: 12px;
  font-weight: 600;
}

.perf-rounds-priority-cell {
  text-align: center;
}

.perf-rounds-priority-badge {
  align-items: center;
  background: #eef9ff;
  border: 1px solid #b9e6fe;
  border-radius: 6px;
  color: #075985;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  height: 28px;
  justify-content: center;
  min-width: 28px;
}

.perf-rounds-row-actions {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  justify-content: center;
}

.perf-rounds-row-actions .button-small {
  height: 30px;
  min-height: 30px !important;
  min-width: 30px;
  padding: 0 !important;
  width: 30px;
}

.perf-rounds-table .perf-rounds-remove-button {
  min-height: 30px !important;
  padding: 5px 9px !important;
  white-space: nowrap;
}

.perf-rounds-move-down {
  margin-left: 4px;
}

.perf-rounds-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

@media (max-width: 760px) {
  table.perf-rounds-table th.cell,
  table.perf-rounds-table td.cell {
    padding-left: 8px;
    padding-right: 8px;
  }

  .perf-rounds-cell--order-number {
    width: 64px;
  }

  .perf-rounds-cell--order-actions {
    width: 92px;
  }

  .perf-rounds-cell--remove {
    width: 86px;
  }
}

.round-remove-btn--danger {
  background: #fef3f2;
  border: 1px solid #b42318;
  color: #b42318;
  font-weight: 700;
}

.round-remove-btn--danger:hover {
  background: #fee4e2;
}

.round-remove-btn--danger:disabled {
  background: #fef6f5;
  border-color: #f0a39b;
  color: #d57a73;
}

body[data-help-context="performanceRating"] .grid-filter-actions button[type="submit"] {
  background: var(--app-action-primary);
  border-color: var(--app-action-primary-border);
  color: #fff;
}

body[data-help-context="performanceRating"] .grid-filter-actions button[type="submit"]:hover,
body[data-help-context="performanceRating"] .grid-filter-actions button[type="submit"]:focus-visible {
  background: var(--app-action-primary-hover);
  border-color: var(--app-action-primary-border);
  color: #fff;
}

body[data-help-context="performanceRating"] .grid-placements-scroll-box .grid-placements-table tbody tr[data-person-row],
body[data-help-context="performanceRating"] .grid-placements-scroll-box .grid-placements-table tbody tr[data-person-row] td {
  background: #fff;
  color: #344054;
}

body[data-help-context="performanceRating"] .grid-placements-scroll-box .grid-placements-table tbody tr[data-person-row]:nth-child(even),
body[data-help-context="performanceRating"] .grid-placements-scroll-box .grid-placements-table tbody tr[data-person-row]:nth-child(even) td {
  background: #fff;
}

body[data-help-context="performanceRating"] .grid-placements-scroll-box .grid-placements-table tbody tr[data-person-row] a {
  color: var(--keshero-blue);
}

/* Box grid + optional summary charts (toggle left of bars, inside shell table) */
.grid-heatmap-chart-row {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: stretch;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.grid-heatmap-main {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
}

.grid-heatmap-main--charts-only {
  width: 100%;
  max-width: 100%;
}

.grid-heatmap-chart-row--with-heatmap:not(.grid-heatmap-chart-row--with-charts) .grid-heatmap-main {
  width: 100%;
  max-width: 100%;
}

.grid-charts-shell {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border: 1px solid #cfd4dc;
  border-radius: 8px;
  background: #f8fafc;
  padding: 12px 14px 14px;
  font-size: 13px;
}

.grid-charts-shell--collapsed {
  width: fit-content;
  max-width: 100%;
}

.grid-summary-charts-shell-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.grid-charts-shell--collapsed .grid-summary-charts-shell-table {
  width: auto;
}

.grid-summary-charts-toggle-cell {
  vertical-align: top;
  width: 52px;
  padding: 0 10px 0 0;
  box-sizing: border-box;
}

.grid-summary-charts-content-cell {
  vertical-align: top;
  padding: 0;
  min-width: 0;
}

.grid-charts-shell--collapsed .grid-summary-charts-content-cell {
  display: none;
}

.grid-charts-toggle-btn {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #c5cdd8;
  border-radius: 8px;
  background: #fff;
  color: #344054;
  cursor: pointer;
  box-sizing: border-box;
}

.grid-charts-toggle-btn:hover {
  background: #f1f5f9;
  border-color: #94a3b8;
}

.grid-charts-toggle-btn:focus-visible {
  outline: 2px solid var(--keshero-blue);
  outline-offset: 2px;
}

/* Inner chart table (bars to the right of toggle) */
.grid-charts-panel {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border: none;
  padding: 0;
  background: transparent;
  border-radius: 0;
  font-size: inherit;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.grid-summary-charts-table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  table-layout: auto;
}

.grid-summary-charts-table tbody tr:not(:first-child) th,
.grid-summary-charts-table tbody tr:not(:first-child) td {
  border-top: 1px solid #e2e8f0;
  padding-top: 10px;
}

.grid-summary-charts-table tbody tr:first-child th,
.grid-summary-charts-table tbody tr:first-child td {
  padding-top: 0;
}

.grid-summary-chart-label {
  vertical-align: top;
  text-align: right;
  font-weight: 800;
  color: #000;
  padding: 0 14px 0 0;
  width: 15rem;
  max-width: 40%;
  line-height: 1.35;
  white-space: normal;
}

.grid-summary-chart-label--one-line {
  white-space: nowrap;
}

.grid-summary-chart-cell {
  vertical-align: top;
  padding: 0;
  min-width: 0;
}

.grid-summary-chart-cell--subgroup {
  min-width: 360px;
  padding-left: 12px;
}

.grid-chart-subgroup-title {
  font-size: 12px;
  font-weight: 700;
  color: #344054;
  margin: 0 0 8px;
}

.grid-chart-row-notes {
  margin-bottom: 8px;
}

.grid-charts-panel .grid-chart-side-note {
  margin: 0 0 4px;
  font-size: 11px;
  color: #475467;
  line-height: 1.35;
  font-weight: 400;
  /* Reset nowrap from .grid-summary-chart-label--one-line on a parent title span */
  white-space: normal;
}

.grid-charts-panel .grid-chart-side-note--round-order {
  font-weight: 600;
  color: #344054;
  word-break: break-word;
}

.grid-charts-panel .grid-chart-side-note--deemph {
  font-weight: 400;
  color: #64748b;
}

.grid-charts-panel .grid-chart-side-note--round-names {
  font-weight: 400;
  color: #344054;
  word-break: break-word;
}

.grid-charts-panel .grid-chart-side-note--emphasis {
  color: #000;
  font-weight: 700;
}

.grid-charts-panel .grid-chart-side-note--target-caption {
  font-weight: 400 !important;
}

.grid-charts-panel .grid-chart-side-note--warning {
  color: var(--app-action-danger);
}

.grid-charts-panel .grid-perf-score-pop-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  flex-wrap: nowrap;
  margin-bottom: 6px;
}

.grid-charts-panel .grid-perf-score-pop-row .grid-perf-score-pop-row__note {
  flex: 1;
  min-width: 0;
  margin: 0;
}

.grid-charts-panel .grid-perf-score-not-mapped-toggle {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #1d2939;
  cursor: pointer;
  line-height: 1.2;
  white-space: nowrap;
}

.grid-charts-panel .grid-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.cycle-grid-notice {
  box-sizing: border-box;
  font-size: 14px;
  line-height: 1.45;
  margin: 12px 0 0;
  padding: 10px 14px;
}

.cycle-grid-notice--review-population {
  background: #f0f9ff;
  color: #0c4a6e;
}

.cycle-grid-notice--error {
  background: #fde7e9;
  color: #5c1321;
}

.cycle-grid-toast {
  border-radius: 6px;
  display: none;
  font-size: 14px;
  margin: 12px 16px 0;
  padding: 10px 14px;
}

.cycle-grid-toast--visible {
  display: block;
}

.cycle-grid-toast--success {
  background: #ecfdf3;
  border: 1px solid #a6f4c5;
  color: #085d3a;
}

.cycle-grid-toast--error {
  background: #fde7e9;
  border: 1px solid #f5c2c7;
  color: #5c1321;
}

.cycle-grid-empty-warning {
  color: #b42318;
  font-weight: 600;
  margin-bottom: 12px;
}

.cycle-grid-legend-note {
  color: #526274;
  font-size: 12px;
  margin-top: 10px;
  line-height: 1.45;
}

.cycle-grid-legend-note--spaced {
  margin-top: 4px;
}

.cycle-grid-add-credit-form {
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  display: none;
  margin: 10px 0 12px;
  padding: 10px;
}

.cycle-grid-add-credit-form--visible {
  display: block;
}

.cycle-grid-add-credit-title {
  font-weight: 700;
  margin-bottom: 8px;
}

.cycle-grid-add-credit-fields {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(200px, 1fr));
}

.cycle-grid-add-credit-label {
  color: #475467;
  display: block;
  font-size: 11px;
  font-weight: 600;
  margin-bottom: 4px;
}

.cycle-grid-add-credit-input {
  box-sizing: border-box;
  width: 100%;
}

.cycle-grid-add-credit-actions {
  margin-top: 8px;
}

.cycle-grid-note-text {
  white-space: pre-wrap;
}

.cycle-grid-muted-value {
  color: #98a2b3;
}

/* Credits column follows Active Status (no drop-down). */
.grid-placements-table .grid-credits-locked {
  align-items: center;
  box-sizing: border-box;
  display: inline-flex;
  height: 34px;
  justify-content: center;
  min-height: 34px;
  min-width: 3.2rem;
  padding: 4px 8px;
  border-radius: 4px;
  background: #f2f4f7;
  color: #344054;
  font-size: 12px;
  line-height: 1.4;
}

.stacked-bar-horizontal {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  width: 100%;
  height: 36px;
  overflow: hidden;
  border: 1px solid #94a3b8;
  border-radius: 6px;
  background: #e8e8e8;
  box-sizing: border-box;
}

.stacked-bar-seg-h {
  flex: 0 0 auto;
  height: 100%;
  min-width: 3px;
  box-sizing: border-box;
  border-left: 1px solid rgba(255, 255, 255, 0.4);
}

.stacked-bar-seg-h:first-child {
  border-left: none;
}

.stacked-bar-legend-h {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 6px 14px;
  align-items: flex-start;
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  font-size: 12px;
}

.stacked-bar-legend-h li {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  max-width: 100%;
}

.stacked-bar-legend-h .legend-detail {
  color: #555;
  font-size: 11px;
}

.stacked-bar-legend-h .legend-label-two-line {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.25;
}

/* Legend swatches in same left-to-right order as bar segments; ?Not mapped to grid? last (margin-left: auto) */
.stacked-bar-legend-h--bar-order {
  justify-content: flex-start;
}

.stacked-bar-legend-h--bar-order .stacked-bar-legend-h__trailing {
  margin-left: auto;
}

@media (max-width: 720px) {
  .grid-summary-charts-table tbody tr {
    display: block;
  }

  .grid-summary-charts-table tbody th,
  .grid-summary-charts-table tbody td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }

  .grid-summary-chart-label {
    text-align: left;
    padding: 0 0 8px;
    max-width: none;
    width: auto;
  }

  .grid-summary-charts-table tbody tr:not(:first-child) th {
    padding-top: 10px;
  }

  .grid-summary-charts-shell-table tbody,
  .grid-summary-charts-shell-table tr {
    display: block;
    width: 100%;
  }

  .grid-summary-charts-shell-table .grid-summary-charts-toggle-cell {
    display: block;
    width: auto;
    padding: 0 0 10px 0;
  }

  .grid-summary-charts-shell-table .grid-summary-charts-content-cell {
    display: block;
    width: 100%;
  }

  .grid-charts-shell--collapsed .grid-summary-charts-content-cell {
    display: none;
  }

  .grid-heatmap-layout {
    grid-template-columns: 1fr;
  }
}

.grid-wrap {
  border: 1px solid #ddd;
  padding: 12px;
  min-width: 0;
}

.grid-wrap--heatmap {
  padding: 14px 16px 16px;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  border: 1px solid #d8e7f3;
  border-radius: 12px;
  background: #fff;
}

.grid-round-banner {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 700;
  color: #1f2937;
}

.grid-round-banner-wrap {
  margin: 0 0 12px;
}

.cycle-grid-section-heading--heatmap {
  margin: 0 0 14px;
  padding: 10px 12px;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: linear-gradient(90deg, #eff6ff, #f5f3ff);
}

.cycle-grid-section-heading--heatmap .grid-round-banner-select {
  flex: 0 1 330px;
  margin-left: auto;
}

@media (max-width: 720px) {
  .cycle-grid-section-heading--summary,
  .cycle-grid-section-heading--heatmap {
    align-items: flex-start;
  }

  .cycle-grid-section-heading--heatmap .grid-round-banner-select {
    width: 100%;
    margin-left: 40px;
  }

  .cycle-grid-total-pill {
    margin-left: 0;
  }

  .cycle-grid-section-heading__actions {
    margin-left: 40px;
  }

  .grid-heatmap-table-shell {
    max-height: min(30rem, 62vh);
  }
}

.grid-round-banner-select {
  min-width: min(100%, 360px);
  font-weight: 700;
}

.grid-round-banner-select--attention {
  color: #fff;
}

.grid-round-banner--attention {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--app-action-danger);
  color: #fff;
}

.grid-heatmap-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 272px);
  gap: 16px;
  align-items: start;
}

.grid-heatmap-layout.is-ungraded-hidden {
  grid-template-columns: minmax(0, 1fr);
}

.grid-wrap--placements {
  contain: paint;
  padding: 14px 16px;
  border: 1px solid #d8e7f3;
  border-radius: 12px;
  background: #fff;
}

.grid-table-scroll {
  max-width: 100%;
  box-sizing: border-box;
  container-type: inline-size;
  container-name: placements-grid;
}

.grid-table-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 6px;
  color: #526277;
  font-size: 12px;
}

.grid-table-pagination__actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.grid-table-pagination__link {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #b8c9d9;
  border-radius: 7px;
  background: #fff;
  color: #075985;
  font-weight: 750;
  text-decoration: none;
}

.grid-table-pagination__link:hover,
.grid-table-pagination__link:focus-visible {
  border-color: #38bdf8;
  background: #f0f9ff;
}

@media (max-width: 720px) {
  .grid-table-pagination {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Employee list: framed area with its own vertical + horizontal scroll (~10 compact rows visible) */
.grid-placements-scroll-box {
  border: 1px solid #d6e2ec;
  border-radius: 10px;
  background: #fbfdff;
  overflow: hidden;
  margin-top: 6px;
}

/* + Employee info: outside table, aligned over Notes column (approx. via grid) */
.grid-notes-employee-info-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, auto);
  align-items: center;
  column-gap: 0;
  padding: 6px 5px 8px;
  border-bottom: 1px solid #cfd4dc;
  background: #f6f7f9;
  box-sizing: border-box;
}

.grid-notes-employee-info-toolbar__left-zone {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.grid-notes-employee-info-toolbar__notes-zone {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}

.grid-placements-scroll-box .grid-table-scroll {
  overflow: auto;
  max-height: min(27.5rem, 52vh);
  -webkit-overflow-scrolling: touch;
}

.grid-placements-table {
  width: max-content;
  min-width: 100%;
}

/* Denser rows + controls inside the scroll box */
.grid-placements-scroll-box .grid-placements-table th,
.grid-placements-scroll-box .grid-placements-table td {
  padding: 3px 5px;
  font-size: 12px;
  line-height: 1.25;
  vertical-align: middle;
}

.grid-placements-scroll-box .grid-placements-table td select,
.grid-placements-scroll-box .grid-placements-table .admin-placement-dd {
  font-size: 12px;
  padding: 1px 4px;
  max-width: 100%;
}

.grid-placements-scroll-box .placement-cell-inner {
  gap: 4px;
}

.grid-placements-scroll-box .grid-placements-table .note {
  margin-top: 3px;
  font-size: 11px;
  line-height: 1.3;
}

/* Notes: height 2?5 lines via JS; scrollbar when content exceeds 5 lines */
.grid-placements-table textarea.cycle-notes-ta {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  min-height: 2.7em;
  overflow-x: hidden;
  resize: none;
}

.grid-notes-cell {
  min-width: 170px;
  max-width: 280px;
  vertical-align: top;
}

/* Employee and manager source-score columns */
.grid-employee-score-col,
.grid-manager-score-col {
  width: 5.5rem;
  min-width: 5.5rem;
  max-width: 6.5rem;
  text-align: center;
  word-break: break-word;
  hyphens: auto;
  font-size: 11px;
  line-height: 1.2;
}

.grid-employee-score-col .grid-th-sort,
.grid-manager-score-col .grid-th-sort {
  display: inline-block;
  max-width: 100%;
  white-space: normal;
}

/* Employee / placements table: header row stays under the viewport top while scrolling down */
.grid-placements-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f6f7f9;
  box-shadow: 0 1px 0 #cfd4dc;
  vertical-align: bottom;
  position: sticky;
  overflow: visible;
}

.grid-placements-table thead th[data-grid-col] {
  position: sticky;
}

.grid-col-resizer {
  position: absolute;
  top: 0;
  right: -2px;
  width: 8px;
  height: 100%;
  cursor: col-resize;
  user-select: none;
  touch-action: none;
}

.grid-col-resizer::after {
  content: "";
  position: absolute;
  top: 22%;
  bottom: 22%;
  left: 3px;
  width: 2px;
  background: #cbd5e1;
  border-radius: 1px;
  opacity: 0.85;
}

.grid-placements-table thead th[data-grid-col]:hover .grid-col-resizer::after {
  background: #94a3b8;
}

.grid-placements-table .grid-employee-info-col {
  display: none;
}

.grid-placements-table.grid-employee-info-visible .grid-employee-info-col {
  display: table-cell;
}

.grid-placements-table .grid-perf-reviews-col {
  display: none;
}

.grid-placements-table.grid-perf-reviews-visible .grid-perf-reviews-col {
  display: table-cell;
}

.grid-placements-table thead th.grid-perf-reviews-col,
.grid-placements-table tbody td.grid-perf-reviews-col {
  text-align: center;
}

.grid-placements-table th[data-grid-col^="perf_review_"] .grid-col-head-inner {
  align-items: center;
}

a.grid-perf-review-link {
  font-weight: 700;
  white-space: nowrap;
}

.grid-review-self-label {
  color: #344054;
  font-weight: 700;
}

.grid-perf-review-placeholder {
  color: #98a2b3;
  cursor: help;
}

/* Performance Complete, Active Status, Credits, Exclude, Active History ? hidden until + Perf Cycle Info */
.grid-placements-table:not(.grid-perf-cycle-info-visible) thead th[data-grid-col="perf_complete"],
.grid-placements-table:not(.grid-perf-cycle-info-visible) tbody td[data-grid-col="perf_complete"],
.grid-placements-table:not(.grid-perf-cycle-info-visible) thead th[data-grid-col="active_status"],
.grid-placements-table:not(.grid-perf-cycle-info-visible) tbody td[data-grid-col="active_status"],
.grid-placements-table:not(.grid-perf-cycle-info-visible) thead th[data-grid-col="credits"],
.grid-placements-table:not(.grid-perf-cycle-info-visible) tbody td[data-grid-col="credits"],
.grid-placements-table:not(.grid-perf-cycle-info-visible) thead th[data-grid-col="excluded"],
.grid-placements-table:not(.grid-perf-cycle-info-visible) tbody td[data-grid-col="excluded"],
.grid-placements-table:not(.grid-perf-cycle-info-visible) thead th[data-grid-col="active_history"],
.grid-placements-table:not(.grid-perf-cycle-info-visible) tbody td[data-grid-col="active_history"] {
  display: none !important;
}

/* Admin-selected Performance Progress columns stay grouped behind one table control. */
.grid-placements-table:not(.grid-perf-progress-info-visible)
  :is(thead th, tbody td).grid-perf-progress-col {
  display: none !important;
}

.grid-placements-table .grid-perf-progress-col {
  text-align: center;
}

.grid-placements-table th.grid-perf-progress-col .grid-col-head-inner {
  align-items: center;
}

.grid-placements-table td.grid-col-user-hidden {
  display: none !important;
}

.grid-placements-table thead th.grid-col-head-user-hidden {
  display: none !important;
}

.grid-placements-scroll-box .grid-placements-table thead th .grid-col-head-inner {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-end;
  gap: 4px;
  min-height: 2.75rem;
  position: relative;
  padding-right: 22px;
}

.grid-placements-scroll-box .grid-placements-table thead th .grid-col-head-main {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-width: 0;
  font-weight: 600;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.grid-placements-scroll-box .grid-placements-table thead th.grid-perf-progress-col .grid-col-head-inner,
.grid-placements-scroll-box .grid-placements-table thead th.grid-perf-progress-col .grid-col-head-main {
  align-items: center;
  text-align: center;
}

.grid-placements-scroll-box .grid-placements-table thead th .grid-col-hide-btn {
  flex-shrink: 0;
  line-height: 1;
  position: absolute;
  right: 4px;
  bottom: 4px;
  padding: 1px 5px;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid #94a3b8;
  border-radius: 4px;
  background: #fff;
  color: #0f172a;
}

.grid-placements-scroll-box .grid-placements-table thead th .grid-col-hide-btn:hover {
  background: #f1f5f9;
}

.grid-placements-scroll-box .grid-placements-table thead th .grid-col-hide-btn:focus-visible {
  outline: 2px solid var(--keshero-blue);
  outline-offset: 1px;
}

.grid-placements-scroll-box .grid-placements-table thead th.grid-col-head-is-collapsed .grid-col-head-main {
  display: none;
}

.grid-placements-scroll-box .grid-placements-table thead th.grid-col-head-is-collapsed .grid-col-head-inner {
  min-height: 0;
  align-items: center;
}

.grid-placements-scroll-box .grid-placements-table thead th.grid-col-head-is-collapsed {
  width: 2rem;
  min-width: 2rem;
  max-width: 2.5rem;
  padding-left: 3px;
  padding-right: 3px;
  vertical-align: middle;
  box-sizing: border-box;
}

.grid-placements-scroll-box .grid-placements-table thead th.grid-sticky-name.grid-col-head-is-collapsed {
  width: 2rem;
  min-width: 2rem;
  max-width: 2.5rem;
}

.grid-placements-scroll-box .grid-placements-table thead th.grid-notes-col.grid-col-head-is-collapsed {
  min-width: 0;
}

.grid-placements-scroll-box .grid-placements-table thead th.grid-col-head-is-collapsed .grid-col-hide-btn {
  align-self: center;
}

.grid-col-toggle-btn {
  padding: 4px 8px;
  font-size: 12px;
  cursor: pointer;
}

.grid-col-toggle-btn.is-active {
  background: var(--app-action-primary);
  border-color: var(--app-action-primary-border);
  color: #fff;
}

.grid-col-toggle-btn.is-active:hover,
.grid-col-toggle-btn.is-active:focus-visible {
  background: var(--app-action-primary-hover);
  border-color: var(--app-action-primary-hover);
  color: #fff;
}

/* Notes column header */
.grid-notes-col {
  vertical-align: bottom;
  min-width: 240px;
  text-align: center;
  font-weight: 700;
}

.grid-perf-complete-col {
  min-width: 92px;
  width: 92px;
}

.grid-role-score-col {
  min-width: var(--grid-round-col-width, 106px);
  width: var(--grid-round-col-width, 106px);
}

.grid-placements-table td[data-grid-col^="round_"] {
  min-width: var(--grid-round-col-width, 106px);
  width: var(--grid-round-col-width, 106px);
}

.grid-placements-scroll-box .grid-placements-table thead th .grid-col-head-main--round {
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.15;
}

.grid-actual-score-col {
  min-width: 252px;
  width: 252px;
  max-width: 280px;
  vertical-align: bottom;
}

.grid-actual-score-col .grid-th-sort {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  line-height: 1.25;
  text-align: center;
  hyphens: auto;
}

.grid-actual-score-cell {
  white-space: pre-line;
  line-height: 1.25;
}

.grid-confidential-panel {
  min-height: 94px;
  padding: 16px;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  background: #f8fafc;
  color: #475467;
}

.grid-confidential-panel__title {
  margin-bottom: 6px;
  font-weight: 800;
  color: #111827;
}

.grid-confidential-panel--compact {
  min-height: 72px;
}

.grid-ungraded-panel {
  border: 1px solid #d0d5dd;
  border-radius: 12px;
  background: #fcfcfd;
  padding: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  max-width: 272px;
}

.grid-heatmap-layout.is-ungraded-hidden .grid-ungraded-panel {
  display: none;
}

.grid-ungraded-panel-reveal {
  align-items: center;
  background: #ffffff;
  border: 1px solid #b2ddff;
  border-radius: 999px;
  color: #075985;
  cursor: pointer;
  display: none;
  font-family: inherit;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  grid-column: 1;
  justify-self: end;
  min-height: 30px;
  padding: 5px 11px;
}

.grid-heatmap-layout.is-ungraded-hidden .grid-ungraded-panel-reveal {
  display: inline-flex;
}

.grid-ungraded-panel-reveal:hover,
.grid-ungraded-panel-reveal:focus-visible {
  background: #eff8ff;
  border-color: #2ec5ff;
  outline: none;
}

.grid-ungraded-panel__header {
  margin-bottom: 10px;
}

.grid-ungraded-panel__title-row {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.grid-ungraded-panel__title {
  font-size: 15px;
  font-weight: 800;
  color: #101828;
}

.grid-ungraded-panel__hide {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  color: #344054;
  cursor: pointer;
  font-family: inherit;
  font-size: 11px;
  font-weight: 800;
  min-height: 26px;
  padding: 3px 8px;
}

.grid-ungraded-panel__hide:hover,
.grid-ungraded-panel__hide:focus-visible {
  background: #f8fafc;
  border-color: #98a2b3;
  outline: none;
}

.grid-ungraded-panel__subtitle,
.grid-ungraded-panel__count {
  margin-top: 4px;
  font-size: 12px;
  color: #475467;
  line-height: 1.45;
}

.grid-ungraded-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 620px;
  overflow: auto;
  padding-right: 2px;
}

.grid-ungraded-person {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #d0d5dd;
  border-radius: 12px;
  background: #fff;
  text-align: left;
  cursor: grab;
}

.grid-ungraded-person * {
  user-select: none;
  -webkit-user-drag: none;
}

.grid-ungraded-person:hover {
  border-color: #98a2b3;
  background: #f8fafc;
}

.grid-ungraded-person.is-selected {
  border-color: #1d4ed8;
  box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.12);
  background: #eff6ff;
}

.grid-ungraded-person.is-dragging {
  opacity: 0.65;
  cursor: grabbing;
}

.grid-ungraded-person__body {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.grid-ungraded-person__name {
  font-size: 13px;
  font-weight: 700;
  color: #111827;
}

.grid-ungraded-person__title {
  font-size: 11px;
  color: #667085;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.grid-ungraded-empty {
  padding: 14px 12px;
  border-radius: 10px;
  background: #f8fafc;
  color: #475467;
  font-size: 12px;
  line-height: 1.45;
}

.heatmap-cell--droppable {
  transition: box-shadow 0.12s ease, transform 0.12s ease;
}

.heatmap-cell--droppable.is-drop-target {
  box-shadow: inset 0 0 0 3px rgba(29, 78, 216, 0.45);
  transform: translateY(-1px);
}

.heatmap-cell--disabled {
  background: #111827 !important;
  border-color: #020617 !important;
  color: #e5e7eb !important;
  cursor: not-allowed;
  opacity: 0.94;
}

.heatmap-cell--disabled .heatmap-cell-title,
.heatmap-cell--disabled .heatmap-cell-metric,
.heatmap-cell--disabled .heatmap-cell-target-line {
  color: #e5e7eb !important;
}

.heatmap-cell--disabled .heatmap-name-item--confidential {
  background: rgba(255, 255, 255, 0.12);
  color: #f3f4f6;
}

.heatmap-name-item--confidential {
  grid-column: 1 / -1;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  color: #475467;
  font-size: 12px;
}

.grid-placements-table tbody tr.is-row-focused td {
  background: #eff6ff;
}

.grid-placements-table tbody tr.is-row-focused td.grid-sticky-name {
  background: #dbeafe;
}

.grid-perf-complete-col .perf-complete-dd {
  width: 100%;
  min-width: 0;
}

/* Keep finalized employees visible while reserving Performance Complete as the row's unlock control. */
.grid-placements-table tbody tr.is-performance-complete td {
  background: #f2f4f7 !important;
  color: #667085;
}

.grid-placements-table tbody tr.is-performance-complete td.grid-sticky-name {
  background: #eaecf0 !important;
}

.grid-placements-table tbody tr.is-performance-complete td:not(.grid-perf-complete-col) :is(
  .grid-name-cell,
  .cycle-grid-muted-value,
  .pm-status-chip,
  .grid-credits-locked,
  .placement-cell-text,
  .grid-perf-review-link,
  .grid-recognition-count,
  .grid-feedback-count
) {
  color: #667085;
  opacity: 0.72;
}

.grid-placements-table tbody tr.is-performance-complete td.grid-perf-complete-col {
  background: #fff !important;
}

.grid-placements-table tbody tr.is-performance-complete .perf-complete-dd + .app-rounded-select .app-rounded-select__button,
.grid-placements-table tbody tr.is-performance-complete .app-rounded-select:has(.perf-complete-dd) .app-rounded-select__button {
  border-color: #98a2b3;
}

/* Signed-in user avatar (account topbar): circle photo or gray placeholder */
.person-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 50%;
  overflow: hidden;
  background: #e5e7eb;
  box-sizing: border-box;
}

.person-avatar--topbar {
  width: 60px;
  height: 60px;
  min-width: 60px;
}

.person-avatar__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.person-avatar__placeholder {
  width: 100%;
  height: 100%;
  min-height: 1px;
  background: #d1d5db;
  border-radius: 50%;
}

.person-avatar__initials {
  align-items: center;
  display: inline-flex;
  font-size: 0.72em;
  font-weight: 800;
  height: 100%;
  justify-content: center;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
  width: 100%;
}

.person-avatar--clickable {
  cursor: zoom-in;
}

.person-avatar--clickable:focus-visible {
  outline: 3px solid rgba(37, 99, 235, 0.42);
  outline-offset: 3px;
}

.person-avatar-modal[hidden] {
  display: none;
}

.person-avatar-modal {
  align-items: center;
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 28px;
  position: fixed;
  z-index: 10000;
}

.person-avatar-modal__backdrop {
  background: rgba(15, 23, 42, 0.62);
  inset: 0;
  position: absolute;
}

.person-avatar-modal__dialog {
  align-items: center;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 10px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
  display: flex;
  justify-content: center;
  max-height: min(82vh, 720px);
  max-width: min(82vw, 720px);
  padding: 18px;
  position: relative;
  z-index: 1;
}

.person-avatar-modal__img {
  border-radius: 8px;
  display: block;
  max-height: calc(82vh - 56px);
  max-width: calc(82vw - 56px);
  object-fit: contain;
}

.person-avatar-modal__close {
  align-items: center;
  background: #0f172a;
  border: 0;
  border-radius: 999px;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  font-size: 22px;
  height: 34px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  position: absolute;
  right: -12px;
  top: -12px;
  width: 34px;
}

.person-avatar-modal-open {
  overflow: hidden;
}

.account-topbar-subhead--with-avatar {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
}

.account-topbar-subhead--with-avatar .account-topbar-subhead__col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-width: 0;
  padding-top: 8px;
}

.account-topbar-subhead {
  align-items: center;
  color: #667085;
  display: flex;
  flex-wrap: nowrap;
  font-size: 15px;
  font-weight: 700;
  gap: 7px;
  line-height: 1.35;
  margin-top: 9px;
  min-width: 0;
  white-space: nowrap;
}

.account-topbar-subhead > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-topbar-subhead__role {
  background: #eef4ff;
  border: 1px solid #c7d7fe;
  border-radius: 999px;
  color: var(--keshero-teal);
  font-size: 12px;
  padding: 2px 8px;
}

.account-topbar-subhead__identity {
  line-height: 1.35;
}

.account-topbar-subhead__profile-line {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  font-size: 15px;
  gap: 0;
  line-height: 1.35;
}

.account-topbar-subhead__profile-line a {
  font-weight: 600;
}

.account-topbar-subhead__separator {
  color: #98a2b3;
  margin: 0 7px;
}

.topbar-profile-link {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  text-decoration: none;
}

.topbar-profile-icon {
  fill: none;
  height: 21px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 21px;
}

.topbar-inbox-link {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  position: relative;
  text-decoration: none;
}

.topbar-inbox-icon {
  fill: currentColor;
  height: 21px;
  width: 21px;
}

.topbar-inbox-badge {
  align-items: center;
  background: var(--app-action-danger);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  height: 20px;
  justify-content: center;
  line-height: 1;
  min-width: 20px;
  padding: 0 6px;
}

.topbar-inbox-badge[hidden] {
  display: none !important;
}

.topbar-spotlight-link {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  text-decoration: none;
}

.topbar-spotlight-icon {
  height: 21px;
  width: 21px;
}

.app-celebration[hidden] {
  display: none;
}

.app-celebration {
  inset: 0;
  pointer-events: none;
  position: fixed;
  z-index: 12000;
}

.app-celebration__backdrop {
  background: radial-gradient(circle at center, rgba(255, 255, 255, 0.1), rgba(15, 23, 42, 0.2));
  inset: 0;
  opacity: 0;
  position: absolute;
  transition: opacity 180ms ease;
}

.app-celebration__dialog {
  align-items: center;
  background: linear-gradient(180deg, #fffdf7 0%, #fff7e6 100%);
  border: 1px solid #f7d58d;
  border-radius: 24px;
  box-shadow: 0 30px 80px rgba(15, 23, 42, 0.22);
  color: #7a2e0b;
  display: grid;
  gap: 8px;
  justify-items: center;
  left: 50%;
  max-width: min(420px, calc(100vw - 32px));
  opacity: 0;
  padding: 24px 24px 20px;
  position: absolute;
  text-align: center;
  top: 84px;
  transform: translate(-50%, -18px) scale(0.94);
  transition: opacity 220ms ease, transform 260ms ease;
}

.app-celebration.is-visible .app-celebration__backdrop {
  opacity: 1;
}

.app-celebration.is-visible .app-celebration__dialog {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
}

.app-celebration.is-leaving .app-celebration__backdrop {
  opacity: 0;
}

.app-celebration.is-leaving .app-celebration__dialog {
  opacity: 0;
  transform: translate(-50%, -10px) scale(0.96);
}

.app-celebration__graphic {
  align-items: center;
  background:
    radial-gradient(circle at 30% 30%, #fff5d6 0%, #ffe6a8 55%, #ffd166 100%);
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  display: inline-flex;
  font-size: 48px;
  height: 92px;
  justify-content: center;
  line-height: 1;
  width: 92px;
}

.app-celebration__title {
  color: #8f2d12;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.02em;
}

.app-celebration__message {
  color: #7a2e0b;
  font-size: 14px;
  font-weight: 700;
}

.app-celebration__graphic--ezer {
  background: transparent;
  box-shadow: none;
  height: auto;
  max-width: 148px;
  padding: 0;
  width: auto;
}

.app-celebration__graphic--ezer img {
  display: block;
  height: 120px;
  max-width: 140px;
  object-fit: contain;
  width: auto;
}

.app-celebration.is-visible {
  pointer-events: auto;
}

.app-celebration__dialog,
.app-celebration__backdrop {
  pointer-events: auto;
}

.inbox-title-block {
  display: grid;
  gap: 4px;
}

.inbox-title-block h2 {
  color: var(--app-heading);
  font-size: 22px;
  line-height: 1.2;
  margin: 0;
}

.inbox-title-block p {
  color: var(--app-muted);
  font-size: 13px;
  margin: 0;
}

.inbox-mailbox-tabs {
  align-items: center;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border: 1px solid #d8e2ee;
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.045);
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0;
  padding: 4px;
  width: fit-content;
}

.inbox-mailbox-tab {
  align-items: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 8px;
  color: #475467;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
  padding: 7px 14px;
  text-decoration: none;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.inbox-mailbox-tab:hover {
  background: #fff;
  border-color: #d8e2ee;
  color: #1f2937;
}

.inbox-mailbox-tab:focus-visible {
  outline: 2px solid #98a2b3;
  outline-offset: 2px;
}

.inbox-mailbox-tab.is-active {
  background: #fff;
  border-color: #c9eaf6;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  color: var(--keshero-teal);
}

.inbox-mailbox-tab__count {
  background: #f2f4f7;
  border-radius: 999px;
  color: #475467;
  font-size: 11px;
  font-weight: 800;
  min-width: 1.4em;
  padding: 1px 6px;
  text-align: center;
}

.inbox-mailbox-tab.is-active .inbox-mailbox-tab__count {
  background: #e0f7fa;
  color: var(--keshero-teal);
}

.inbox-page {
  display: grid;
  gap: 16px;
}

.inbox-toolbar {
  align-items: center;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border: 1px solid #d8e2ee;
  border-radius: 10px;
  box-sizing: border-box;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.045);
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 12px;
  justify-content: space-between;
  margin: 0;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  padding: 8px 10px;
  width: 100%;
}

.inbox-toolbar__actions,
.inbox-toolbar__pager {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 0;
  display: flex;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: max-content;
  padding: 0;
}

.inbox-toolbar__actions {
  display: grid;
  grid-template-columns: max-content minmax(150px, 190px) max-content max-content;
  justify-content: flex-start;
  margin-right: auto;
}

.inbox-toolbar__actions .inbox-bulk-control {
  align-self: center;
  justify-self: start;
  margin: 0;
  min-width: 0;
  white-space: nowrap;
  width: auto;
}

.inbox-toolbar__actions .inbox-bulk-control--action {
  width: 100%;
}

.inbox-toolbar__utility {
  align-items: stretch;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  min-width: 0;
}

.inbox-toolbar__pager {
  color: #475467;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
  justify-content: flex-end;
  margin-left: auto;
  white-space: nowrap;
}

.inbox-toolbar select {
  background-color: #fff;
  border: 1px solid #d0d8e4;
  border-radius: 999px;
  color: #344054;
  font-size: 12px;
  font-weight: 700;
  min-height: 32px;
  padding: 0 30px 0 11px;
}

.inbox-toolbar .button-small {
  box-sizing: border-box;
  height: 32px;
  border-radius: 999px;
  min-height: 32px;
  padding-inline: 12px;
}

.inbox-toolbar__pager label {
  align-items: center;
  color: #667085;
  display: inline-flex;
  gap: 6px;
  white-space: nowrap;
}

.inbox-toolbar__label {
  align-items: center;
  color: #344054;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 7px;
  min-height: 32px;
  padding: 0 4px;
  white-space: nowrap;
}

.inbox-card__check input {
  accent-color: var(--app-action-primary);
}

.inbox-select-all-button {
  background: #fff;
  border-color: #c9eaf6;
  color: #0b7894;
  font-weight: 850;
}

.inbox-select-all-button:hover,
.inbox-select-all-button:focus-visible {
  background: #e8fbff;
  border-color: var(--app-action-primary);
}

.inbox-selected-count {
  background: #fff;
  border: 1px solid #d8e2ee;
  border-radius: 999px;
  color: #667085;
  font-size: 12px;
  font-weight: 800;
  min-height: 32px;
  padding: 7px 11px;
  white-space: nowrap;
}

.inbox-pagination {
  border-top: 1px solid #e4e7ec;
  margin: 10px -14px -14px;
  padding: 12px 14px;
}

.inbox-pagination__jump {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  margin: 0 0 0 4px;
}

.inbox-pagination__page-status {
  color: #475467;
  font-size: 12px;
  font-weight: 850;
  margin-left: auto;
  white-space: nowrap;
}

.inbox-toolbar__divider {
  color: #98a2b3;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  padding: 0 2px;
}

.inbox-panel {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  overflow: hidden;
  padding: 14px;
}

.inbox-summary-strip {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 0;
}

.inbox-summary-card {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
  color: inherit;
  min-width: 0;
  padding: 12px 14px;
  text-decoration: none;
  transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

a.inbox-summary-card:hover {
  border-color: #b8cbe5;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
  transform: translateY(-1px);
}

.inbox-summary-card--unread {
  border-color: #c8ebf8;
}

.inbox-summary-card--active {
  border-color: var(--app-action-primary);
  box-shadow: 0 12px 24px rgba(46, 197, 255, 0.12);
}

.inbox-summary-card__label {
  color: #667085;
  display: block;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 4px;
  text-transform: uppercase;
}

.inbox-summary-card__value {
  color: var(--app-heading);
  font-size: 24px;
  line-height: 1;
}

.inbox-layout {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(360px, 0.82fr) minmax(420px, 1.18fr);
}

.inbox-layout--single {
  grid-template-columns: minmax(360px, 0.82fr) minmax(420px, 1.18fr);
}

.inbox-table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}

.inbox-table th,
.inbox-table td {
  border-bottom: 1px solid #e4e7ec;
  padding: 10px 8px;
  text-align: left;
  vertical-align: top;
}

.inbox-table th {
  background: #f8fafc;
  color: #344054;
  font-size: 12px;
  letter-spacing: 0;
}

.inbox-table tbody tr:hover {
  background: #f9fbff;
}

.inbox-row--selected {
  background: #eef4ff !important;
}

.inbox-row--unread .inbox-subject {
  font-weight: 800;
}

.inbox-message-link {
  color: inherit;
  display: block;
  text-decoration: none;
}

.inbox-message-line {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-bottom: 4px;
}

.inbox-message-dot {
  background: var(--app-action-primary, #2ec5ff);
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.28);
  display: inline-block;
  flex: 0 0 10px;
  height: 10px;
  width: 10px;
}

.inbox-subject {
  color: #1d4ed8;
  text-decoration: none;
}

.inbox-message-preview {
  color: #667085;
  font-size: 13px;
  line-height: 1.45;
}

.inbox-list {
  display: grid;
  gap: 10px;
}

.inbox-list-scroll {
  max-height: min(68vh, 760px);
  overflow-y: auto;
  padding-right: 6px;
  scrollbar-gutter: stable;
}

.inbox-list-scroll::-webkit-scrollbar {
  width: 10px;
}

.inbox-list-scroll::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border: 3px solid #fff;
  border-radius: 999px;
}

.inbox-list-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.inbox-card {
  align-items: start;
  background: linear-gradient(180deg, #ffffff 0%, #fcfdff 100%);
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 14px;
  position: relative;
  transition: background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.inbox-card:hover {
  background: #fbfdff;
  border-color: #cbd5e1;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.055);
}

.inbox-card--unread {
  background: linear-gradient(180deg, #d9f0ff 0%, #e8f6ff 100%);
  border-color: #7dd3fc;
  box-shadow: inset 4px 0 0 var(--app-action-primary, #2ec5ff);
}

.inbox-card--unread:hover {
  background: #d0ebff;
  border-color: #38bdf8;
  box-shadow: inset 4px 0 0 var(--app-action-primary, #2ec5ff), 0 10px 22px rgba(14, 165, 233, 0.1);
}

.inbox-card--selected {
  background: #f0fbff;
  border-color: var(--app-action-primary);
}

.inbox-card--unread.inbox-card--selected {
  background: #cceeff;
  border-color: var(--app-action-primary);
  box-shadow: inset 4px 0 0 var(--app-action-primary, #2ec5ff), 0 0 0 1px rgba(46, 197, 255, 0.22);
}

.inbox-card[hidden] {
  display: none;
}

.inbox-card__check {
  padding-top: 4px;
}

.inbox-card__star-form {
  margin: 0;
  position: absolute;
  right: 10px;
  top: 10px;
  z-index: 2;
}

.inbox-card__star {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: #e5a000;
  cursor: pointer;
  display: inline-flex;
  font-size: 22px;
  height: 32px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 32px;
}

.inbox-card__star:hover,
.inbox-card__star:focus-visible {
  background: #fff8e6;
  color: #c88700;
  outline: none;
}

.inbox-card__star.is-starred {
  color: #e5a000;
}

.inbox-card__delete-form {
  bottom: 10px;
  margin: 0;
  position: absolute;
  right: 10px;
  z-index: 2;
}

.inbox-card__main {
  color: inherit;
  display: grid;
  gap: 7px;
  min-width: 0;
  padding-right: 34px;
  text-decoration: none;
}

.inbox-card__topline,
.inbox-card__meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.inbox-card__received {
  color: #667085;
  font-size: 12px;
  font-weight: 750;
  margin-left: auto;
  white-space: nowrap;
}

.inbox-card h3 {
  align-items: center;
  color: var(--app-heading);
  display: flex;
  flex-wrap: wrap;
  font-size: 15px;
  font-weight: 700;
  gap: 8px;
  line-height: 1.3;
  margin: 0;
  overflow-wrap: anywhere;
}

.inbox-card--unread h3 {
  color: #075985;
  font-weight: 900;
}

.inbox-card p {
  color: #667085;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
  overflow-wrap: anywhere;
}

.inbox-card--unread p {
  color: #475467;
}

.inbox-card__unread-pill {
  align-items: center;
  background: #dbeafe;
  border: 1px solid #93c5fd;
  border-radius: 999px;
  color: #026aa2;
  display: inline-flex;
  font-size: 10px;
  font-weight: 900;
  justify-content: center;
  letter-spacing: 0.04em;
  line-height: 1;
  min-height: 22px;
  padding: 0 8px;
  text-transform: uppercase;
  white-space: nowrap;
}

.inbox-card__meta {
  color: #667085;
  font-size: 12px;
  min-height: 26px;
  padding-right: 58px;
}

.inbox-card__quick-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  grid-column: 2;
  padding-right: 58px;
}

.inbox-card__quick-actions form,
.inbox-message-body__actions form {
  margin: 0;
}

.inbox-quick-action {
  align-items: center;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  justify-content: center;
  line-height: 1;
  min-height: 34px;
  padding: 0 12px;
  text-decoration: none;
  white-space: nowrap;
}

.inbox-quick-action--view,
.inbox-quick-action--neutral {
  background: #eef2f6;
  border-color: #cbd5e1;
  color: #344054;
}

.inbox-quick-action--primary {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}

.inbox-quick-action--danger {
  background: #fff1f2;
  border-color: #fda4af;
  color: #be123c;
}

.inbox-quick-action:hover,
.inbox-quick-action:focus-visible {
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .14);
  outline: none;
}

.inbox-status-pill {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  justify-content: center;
  min-width: 72px;
  padding: 4px 10px;
}

.inbox-status-pill--read {
  background: #eef2f6;
  color: #475467;
}

.inbox-status-pill--unread {
  background: #e7f0ff;
  color: var(--keshero-teal);
}

.inbox-type-pill,
.inbox-priority-pill,
.inbox-mini-pill {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  justify-content: center;
  line-height: 1;
  min-height: 22px;
  padding: 0 8px;
  white-space: nowrap;
}

.inbox-type-pill {
  background: #eef2f6;
  color: #475467;
}

.inbox-type-pill--task {
  background: #e8fbff;
  color: #0b7894;
}

.inbox-type-pill--review,
.inbox-type-pill--survey,
.inbox-type-pill--feedback {
  background: #f3edff;
  color: #6941c6;
}

.inbox-type-pill--system {
  background: #f2f4f7;
  color: #344054;
}

.inbox-type-pill--calendar_note {
  background: #fff7ed;
  color: #9a3412;
}

.inbox-priority-pill {
  background: #f2f4f7;
  color: #475467;
}

.inbox-priority-pill--urgent,
.inbox-priority-pill--high {
  background: #fff5f6;
  color: #c5303c;
}

.inbox-priority-pill--normal {
  background: #ecfdf5;
  color: #087350;
}

.inbox-priority-pill--low {
  background: #f8fafc;
  color: #667085;
}

.inbox-mini-pill {
  background: #fff8e6;
  color: #8a5a00;
}

.inbox-filter-chip {
  background: transparent;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #475467;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  min-height: 32px;
  padding: 0 14px;
  text-decoration: none;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.inbox-filter-chip:hover {
  background: #fff;
  border-color: #d8e2ee;
  color: #1f2937;
}

.inbox-filter-chip.is-active {
  background: #fff;
  border-color: #c9eaf6;
  color: var(--keshero-teal);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.inbox-filter-chip:focus-visible {
  outline: 2px solid #98a2b3;
  outline-offset: 2px;
}

.inbox-message-body {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  margin-top: 0;
  min-height: 220px;
  max-height: min(78vh, 840px);
  overflow-y: auto;
  padding: 0;
  position: sticky;
  scrollbar-gutter: stable;
  top: 12px;
}

.inbox-message-body--empty {
  background: #fff;
}

.inbox-message-body__inner {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  min-height: 220px;
  padding: 18px;
}

.inbox-message-body__meta {
  align-items: center;
  color: #667085;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 12px;
}

.inbox-message-body h3 {
  color: var(--app-heading);
  font-size: 18px;
  line-height: 1.3;
  margin: 0 0 14px;
  overflow-wrap: anywhere;
}

.inbox-message-body__content {
  color: #344054;
  font-size: 14px;
  line-height: 1.55;
  margin-bottom: 16px;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.inbox-message-body__actions {
  align-self: stretch;
  border-top: 1px solid #eef2f6;
  display: flex;
  gap: 8px;
  margin-top: auto;
  padding-top: 12px;
}

.inbox-message-body__action {
  margin: 0;
}

.inbox-message-body__action--recognition {
  background: #fffbeb;
  border-color: #f59e0b;
  color: #92400e;
}

.inbox-message-body__action--recognition:hover,
.inbox-message-body__action--recognition:focus-visible {
  background: #fef3c7;
  border-color: #d97706;
  color: #78350f;
}

.pm-calendar-note-card--target {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 2px rgba(46, 197, 255, 0.18), 0 10px 22px rgba(15, 23, 42, 0.08);
}

.surveys-page {
  display: grid;
  gap: 14px;
  margin-bottom: 32px;
}

.surveys-workspace {
  display: grid;
  gap: 0;
  min-width: 0;
}

.surveys-workspace__tabs {
  align-items: end;
  display: flex;
  min-width: 0;
}

.surveys-view-tabs.app-tabs {
  align-items: stretch;
  background: transparent;
  border: 0;
  border-bottom: 3px solid var(--app-tab-divider, #b8c4d4);
  border-radius: 0;
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  gap: 6px 12px;
  min-width: 0;
  padding: 0;
}

.surveys-view-tabs__group {
  display: grid;
  gap: 2px;
  grid-template-rows: auto 1fr;
  min-width: 0;
}

.surveys-view-tabs__group-label {
  color: #667085;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.07em;
  line-height: 1;
  margin: 0;
  padding: 0 2px;
  text-transform: uppercase;
  white-space: nowrap;
}

.surveys-view-tabs__group-tabs {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  gap: var(--app-tab-gap, 4px);
  min-width: 0;
}

.surveys-view-tabs__group:has(.app-tab.is-active) .surveys-view-tabs__group-label {
  color: var(--app-action-primary-hover, #0284c7);
}

.surveys-view-tabs .app-tab {
  background: var(--app-tab-idle-bg, transparent);
  border: 1px solid var(--app-tab-idle-border, #cbd5e1);
  border-bottom: 0;
  border-radius: var(--app-tab-radius, 8px 8px 0 0);
  color: var(--app-tab-idle-text, #344054);
  font-size: 12px;
  font-weight: 800;
  gap: 7px;
  min-height: 32px;
  padding: 0 12px;
}

.surveys-view-tabs .app-tab:hover,
.surveys-view-tabs .app-tab:focus-visible {
  background: var(--app-tab-hover-bg, #f8fafc);
  border-color: var(--app-tab-idle-border, #cbd5e1);
  color: var(--app-tab-hover-text, var(--app-action-primary-hover, #20b5e8));
  outline: none;
}

.surveys-view-tabs .app-tab:focus-visible {
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.28);
}

.surveys-view-tabs .app-tab.is-active {
  background: var(--app-tab-active-bg, var(--app-action-primary, #2ec5ff));
  border-color: var(--app-tab-active-border, var(--app-action-primary-border, #14a8d4));
  color: var(--app-tab-active-text, #fff);
}

.surveys-tab-count {
  align-items: center;
  background: color-mix(in srgb, currentColor 11%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 22%, transparent);
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  height: 18px;
  justify-content: center;
  line-height: 1;
  min-width: 18px;
  padding: 0 5px;
}

.surveys-tab-count--alert {
  background: color-mix(in srgb, var(--app-action-danger, #f04438) 12%, #fff);
  border-color: color-mix(in srgb, var(--app-action-danger, #f04438) 30%, #fff);
  color: #b42318;
}

.surveys-view-tabs .app-tab.is-active .surveys-tab-count {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.38);
  color: inherit;
}

.surveys-view-tabs .app-tab.is-active .surveys-tab-count--alert {
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.4);
  color: inherit;
}

.surveys-workspace__body {
  background: var(--app-surface, #fff);
  border: 1px solid var(--app-border, #dbe5ef);
  border-radius: 0 0 12px 12px;
  border-top: 0;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
  display: grid;
  gap: 0;
  min-width: 0;
}

.surveys-workspace__body > .surveys-filter-bar {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--app-border-soft, #eef2f6);
  border-radius: 0;
  box-shadow: none;
  padding: 14px 16px 12px;
}

.surveys-workspace__body > .surveys-panel {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 16px;
}

.surveys-filter-bar {
  background: var(--app-surface, #fff);
  border: 1px solid var(--app-border, #dbe5ef);
  border-radius: var(--app-radius-card, 10px);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) !important;
  padding: 12px;
}

.surveys-filter-primary.app-filter-bar {
  align-items: stretch;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr);
  padding: 10px 12px;
}

.surveys-filter-primary__row {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  min-width: 0;
}

.surveys-filter-primary__row--main {
  display: grid;
  gap: 10px 12px;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}

.surveys-filter-primary__row > * {
  flex: 1 1 140px;
  min-width: 0;
}

.surveys-filter-primary__row--main > * {
  flex: unset;
  max-width: none;
  min-width: 0;
  width: 100%;
}

.surveys-filter-primary__row--main .surveys-filter-control--search {
  flex: unset;
  max-width: none;
  min-width: 0;
}

.surveys-filter-primary__row--secondary .surveys-filter-bar__actions {
  flex: 0 0 auto;
}

.surveys-filter-bar .surveys-filter-primary label:first-child,
.surveys-filter-bar .surveys-filter-primary .grid-filter-label,
.surveys-filter-bar .surveys-filter-primary .app-field__label {
  grid-column: auto;
  line-height: 1.2;
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
}

.surveys-filter-primary .app-filter-field,
.surveys-filter-primary .surveys-filter-control,
.surveys-filter-primary .surveys-status-filter-main,
.surveys-filter-primary .surveys-keshboard-filter {
  grid-template-columns: minmax(0, 1fr);
  max-width: none;
  min-width: 0;
  width: 100%;
}

.surveys-filter-primary [data-surveys-feedback-only-filter][hidden] {
  display: none !important;
}

.surveys-filter-primary .app-field__control,
.surveys-filter-primary .app-rounded-select,
.surveys-filter-primary .app-rounded-select__button,
.surveys-filter-primary .grid-filter-dropdown,
.surveys-filter-primary .grid-filter-dropdown-toggle,
.surveys-filter-primary select {
  background: #fff;
  box-sizing: border-box;
  max-width: none;
  min-width: 0;
  width: 100%;
}

.surveys-filter-primary .surveys-filter-bar__actions {
  align-self: end;
  display: flex;
  gap: 8px;
  justify-self: start;
}

@media (max-width: 820px) {
  .surveys-filter-primary__row > * {
    flex: 1 1 calc(50% - 6px);
  }

  .surveys-filter-primary__row--main {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .surveys-filter-primary .surveys-filter-bar__actions {
    flex: 1 1 100%;
    justify-content: flex-end;
    max-width: none;
  }

  .surveys-workspace__body {
    border-radius: 12px;
  }
}

@media (max-width: 540px) {
  .surveys-filter-primary__row > * {
    flex: 1 1 100%;
  }

  .surveys-workspace__tabs {
    align-items: stretch;
  }
}

.surveys-filter-bar__row--page > .grid-filter-field {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.surveys-filter-bar__row--page > .grid-filter-field .grid-filter-label {
  color: #344054;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.surveys-filter-bar__row--page .grid-filter-dropdown-toggle,
.surveys-filter-bar__row--page .app-rounded-select__button,
.surveys-filter-bar__row--page select,
.surveys-filter-bar__row--page input[type="search"],
.surveys-filter-bar__row--page input[type="date"] {
  min-height: var(--app-control-height);
  width: 100%;
}

.surveys-filter-bar__row--page .app-rounded-select__button {
  padding: 6px 34px 6px 8px;
}

.surveys-filter-bar label {
  box-sizing: border-box;
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  min-width: 0;
}

.surveys-filter-bar input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.surveys-filter-bar select {
  border: 1px solid #cfd8e3;
  border-radius: 7px;
  box-sizing: border-box;
  min-height: 36px;
  padding: 6px 8px;
  width: 100%;
}

.surveys-filter-bar .grid-filter-check-label input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  background-color: var(--app-checkbox-bg, #fff);
  border: 1px solid var(--app-checkbox-border, #98a2b3);
  border-radius: var(--app-checkbox-radius, 4px);
  box-sizing: border-box;
  flex: 0 0 auto;
  height: var(--app-checkbox-size, 16px);
  margin: 0;
  max-height: var(--app-checkbox-size, 16px);
  max-width: var(--app-checkbox-size, 16px);
  min-height: 0;
  min-width: var(--app-checkbox-size, 16px);
  padding: 0;
  width: var(--app-checkbox-size, 16px);
}

.surveys-filter-bar .grid-filter-check-label input[type="checkbox"]:checked {
  background-color: var(--app-checkbox-checked-bg, #12b76a);
  background-image: var(--app-checkbox-mark-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--app-checkbox-mark-size, 12px) var(--app-checkbox-mark-size, 12px);
  border-color: var(--app-checkbox-checked-border, #039855);
}

.surveys-status-filter,
.surveys-status-filter-main {
  box-sizing: border-box;
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  max-width: none;
  min-width: 0;
  width: 100%;
}

.surveys-keshboard-filter {
  box-sizing: border-box;
  min-width: 0;
}

.surveys-keshboard-filter.grid-filter-field--dropdown {
  max-width: none;
  width: 100%;
}

.surveys-keshboard-filter .grid-filter-dropdown {
  max-width: none;
  min-width: 0;
  width: 100%;
}

.surveys-keshboard-filter .grid-filter-dropdown-toggle {
  justify-content: flex-start;
  padding-right: 34px;
  position: relative;
  width: 100%;
}

.surveys-keshboard-filter .grid-filter-dropdown-chevron {
  margin-left: 0;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}

.surveys-keshboard-filter .grid-filter-dropdown.is-open .grid-filter-dropdown-chevron {
  transform: translateY(-50%) rotate(180deg);
}

.surveys-keshboard-filter .grid-filter-dropdown-panel {
  z-index: 120;
}

.surveys-status-filter .grid-filter-dropdown,
.surveys-status-filter-main .grid-filter-dropdown {
  max-width: none;
  min-width: 0;
  width: 100%;
}

.surveys-status-filter .grid-filter-dropdown-toggle,
.surveys-status-filter-main .grid-filter-dropdown-toggle {
  border-color: #cfd8e3;
  border-radius: 7px;
  padding: 6px 8px;
}

.surveys-status-filter .grid-filter-dropdown-panel,
.surveys-status-filter-main .grid-filter-dropdown-panel {
  max-height: 300px;
  z-index: 120;
}

.surveys-filter-bar__actions {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.surveys-filter-bar__actions .button-primary,
.surveys-filter-bar__actions .button-small {
  align-items: center;
  display: inline-flex;
  min-height: var(--app-control-height, 36px) !important;
  padding-block: 0 !important;
}

.surveys-filter-bar--managed {
  align-items: stretch;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.surveys-filter-bar__row {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  min-width: 0;
}

.surveys-filter-bar__row--page {
  border-bottom: 1px solid #eef2f6;
  padding-bottom: 10px;
}

.surveys-filter-bar__row--managed {
  padding-top: 2px;
}

.surveys-filter-bar--managed .surveys-filter-bar__actions {
  align-self: end;
}

.surveys-filter-bar--managed label:first-child {
  grid-column: auto;
}

.surveys-panel,
.surveys-sentiment-card {
  background: var(--app-surface, #fff);
  border: 1px solid var(--app-border, #dbe5ef);
  border-radius: var(--app-radius-card, 10px);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
  padding: 14px;
}

.surveys-section-tabs {
  align-items: center;
  border-bottom: 1px solid #e4e7ec;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: -2px 0 16px;
  padding-bottom: 12px;
}

.surveys-section-tabs a {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  color: #344054;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 7px;
  padding: 8px 11px;
  text-decoration: none;
}

.surveys-section-tabs a.is-active {
  background: #e8fbff;
  border-color: var(--app-action-primary);
  color: #0b7894;
}

.surveys-pending-badge {
  align-items: center;
  background: var(--app-action-danger);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  height: 19px;
  justify-content: center;
  line-height: 1;
  min-width: 19px;
  padding: 0 6px;
}

.surveys-panel__header {
  margin-bottom: 14px;
}

.surveys-panel__header h3,
.surveys-sentiment-card h3 {
  margin: 0 0 5px;
}

.surveys-panel__header p,
.surveys-sentiment-card p {
  color: var(--app-muted);
  font-size: 13px;
  margin: 0;
}

.surveys-panel__note {
  color: var(--app-muted, #667085);
  font-size: 12px;
  margin: 0 0 12px;
}

.surveys-panel__count {
  color: #344054;
  font-size: 13px;
  font-weight: 800;
  margin: 0 0 12px;
}

.surveys-empty-state {
  align-items: center;
  background: transparent;
  border: 0;
  display: grid;
  justify-items: center;
  min-height: 168px;
  padding: 40px 18px;
  text-align: center;
}

.surveys-empty-state__icon {
  align-items: center;
  background: var(--app-success-surface, #ecfdf3);
  border: 1px solid var(--app-success-border, #a6f4c5);
  border-radius: 999px;
  color: var(--app-success-fg, #067647);
  display: inline-flex;
  height: 36px;
  justify-content: center;
  margin-bottom: 10px;
  width: 36px;
}

.surveys-empty-state__icon svg {
  display: block;
}

.surveys-empty-state strong {
  color: var(--app-heading, #101828);
  font-size: 15px;
}

.surveys-empty-state p {
  color: var(--app-muted, #667085);
  font-size: 12px;
  margin: 4px 0 0;
}

.surveys-empty-state .button-small {
  margin-top: 12px;
}

.surveys-sentiment-card strong {
  color: var(--app-heading);
  display: block;
  font-size: 34px;
  line-height: 1;
  margin: 10px 0 6px;
}

.surveys-dashboard {
  display: grid;
  gap: 14px;
  overflow: visible;
}

.surveys-dashboard__header {
  align-items: flex-start;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 4px;
}

.surveys-dashboard__header-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.surveys-dashboard__eyebrow {
  color: #667085;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  margin: 0;
  text-transform: uppercase;
}

.surveys-dashboard__type {
  color: #101828;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0;
}

.surveys-dashboard__scope {
  background: #ecfdf3;
  border: 1px solid #abefc6;
  border-radius: 999px;
  color: #027a48;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  padding: 6px 10px;
  white-space: nowrap;
}

.surveys-dashboard__note {
  color: #667085;
  font-size: 13px;
  line-height: 1.45;
  margin: 2px 0 0;
  max-width: 52rem;
}

.surveys-dashboard__note--warn {
  color: #b54708;
}

.surveys-dashboard__metrics {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  overflow: visible;
}

.surveys-dashboard__metrics--2 {
  grid-template-columns: repeat(2, minmax(180px, 1fr));
}

.surveys-dashboard__metrics--3 {
  grid-template-columns: repeat(3, minmax(160px, 1fr));
}

.surveys-dashboard__metrics--4 {
  grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.surveys-dashboard__metric-label {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  position: relative;
  z-index: 1;
}

.surveys-dashboard-info {
  display: inline-flex;
  position: relative;
  vertical-align: middle;
  z-index: 5;
}

.surveys-dashboard-info.is-open {
  z-index: 40;
}

.surveys-dashboard-info__btn {
  align-items: center;
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f6 100%);
  border: 1px solid #cfd6de;
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 11px;
  font-style: italic;
  font-weight: 700;
  height: 18px;
  justify-content: center;
  line-height: 1;
  padding: 0 0 1px;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
  width: 18px;
}

.surveys-dashboard-info__btn:hover,
.surveys-dashboard-info__btn:focus-visible,
.surveys-dashboard-info.is-open .surveys-dashboard-info__btn {
  background: linear-gradient(180deg, #eff8ff 0%, #d1e9ff 100%);
  border-color: #84caff;
  box-shadow: 0 0 0 3px rgba(46, 144, 250, 0.18);
  color: #175cd3;
  outline: none;
}

.surveys-dashboard-info__panel {
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 12px;
  bottom: calc(100% + 12px);
  box-shadow:
    0 1px 2px rgba(16, 24, 40, 0.04),
    0 18px 40px rgba(16, 24, 40, 0.16);
  color: #475467;
  display: grid;
  gap: 6px;
  font-size: 12px;
  font-weight: 500;
  left: 50%;
  line-height: 1.45;
  max-width: min(320px, calc(100vw - 48px));
  min-width: 240px;
  padding: 12px 14px;
  position: absolute;
  top: auto;
  transform: translateX(-50%);
  white-space: normal;
  width: max-content;
  z-index: 80;
}

.surveys-dashboard-info__panel::before {
  background: #ffffff;
  border-bottom: 1px solid #e4e7ec;
  border-right: 1px solid #e4e7ec;
  bottom: -6px;
  content: "";
  height: 10px;
  left: 50%;
  margin-left: -5px;
  position: absolute;
  transform: rotate(45deg);
  width: 10px;
}

.surveys-dashboard-info__panel-title {
  color: #101828;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.01em;
  margin: 0;
}

.surveys-dashboard-info__panel-body {
  color: #475467;
  font-size: 12px;
  font-weight: 500;
  margin: 0;
}

.surveys-dashboard-info__panel-formula {
  background: #f8fafc;
  border: 1px solid #eaecf0;
  border-radius: 8px;
  color: #344054;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  font-weight: 600;
  margin: 2px 0 0;
  padding: 8px 10px;
}

.surveys-dashboard-info__panel[hidden] {
  display: none !important;
}

.surveys-dashboard__question-list {
  display: grid;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.surveys-dashboard__question-list li {
  align-items: start;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.surveys-dashboard__question-list span {
  color: #344054;
  font-size: 13px;
  line-height: 1.35;
}

.surveys-dashboard__question-list strong {
  color: #027a48;
  font-size: 13px;
  white-space: nowrap;
}

.surveys-dashboard__question-list small {
  color: #667085;
  font-weight: 600;
}

.surveys-dashboard__source-mix {
  border-top: 1px solid #e4e7ec;
  margin-top: 16px;
  padding-top: 14px;
}

.surveys-dashboard__source-mix h4 {
  margin-bottom: 10px;
}

@media (max-width: 960px) {
  .surveys-dashboard__metrics,
  .surveys-dashboard__metrics--2,
  .surveys-dashboard__metrics--3,
  .surveys-dashboard__metrics--4 {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }
}

.surveys-dashboard__metrics article,
.surveys-dashboard__card {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
}

.surveys-dashboard__metrics article {
  display: grid;
  gap: 4px;
  min-height: 104px;
  overflow: visible;
  padding: 14px;
  position: relative;
}

.surveys-dashboard__metrics article:has(.surveys-dashboard-info.is-open) {
  z-index: 30;
}

.surveys-dashboard__metrics > article > span,
.surveys-dashboard__card > h4 {
  color: #344054;
  font-size: 12px;
  font-weight: 900;
  margin: 0;
}

.surveys-dashboard__metrics strong {
  color: #101828;
  font-size: 30px;
  line-height: 1;
}

.surveys-dashboard__metrics small,
.surveys-dashboard__empty {
  color: #667085;
  font-size: 12px;
}

.surveys-dashboard__grid {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(260px, 0.9fr) minmax(320px, 1.1fr);
}

.surveys-dashboard__card {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.surveys-dashboard__bars {
  display: grid;
  gap: 10px;
}

.surveys-dashboard__bar-row {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: 120px 1fr 34px;
}

.surveys-dashboard__bar-row span,
.surveys-dashboard__recent span {
  color: #475467;
  font-size: 12px;
  font-weight: 800;
}

.surveys-dashboard__bar-row div {
  background: #eef2f6;
  border-radius: 999px;
  height: 9px;
  overflow: hidden;
}

.surveys-dashboard__bar-row i {
  background: linear-gradient(90deg, #34c38f, #2ec5ff);
  border-radius: inherit;
  display: block;
  height: 100%;
}

.surveys-dashboard__bar-row b {
  color: #101828;
  font-size: 12px;
  text-align: right;
}

.surveys-dashboard__recent {
  display: grid;
  gap: 8px;
}

.surveys-dashboard__recent div {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #eef2f6;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(120px, 0.8fr) minmax(160px, 1fr) auto;
  padding: 9px 10px;
}

.surveys-dashboard__recent strong {
  color: #101828;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.surveys-dashboard__recent b {
  background: #ecfdf3;
  border-radius: 999px;
  color: #027a48;
  font-size: 12px;
  padding: 4px 8px;
}

.surveys-card-list {
  display: grid;
  gap: 16px;
}

.surveys-record-card {
  background: #ffffff;
  border: 1px solid #98a2b3;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 18px rgba(15, 23, 42, 0.06);
  display: grid;
  gap: 8px;
  overflow: visible;
  padding: 14px 16px;
  position: relative;
}

.surveys-record-card::before {
  content: none;
}

.surveys-record-card--target {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 2px rgba(46, 197, 255, 0.18), 0 12px 26px rgba(15, 23, 42, 0.08);
}

.surveys-record-card__top,
.surveys-record-card__meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.surveys-record-card__top {
  justify-content: space-between;
}

.surveys-record-card__top-left,
.surveys-record-card__top-right {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  min-width: 0;
}

.surveys-record-card__top-right {
  margin-left: auto;
}

body.surveys-development-modal-open {
  overflow: hidden;
}

.surveys-development-modal[hidden] {
  display: none;
}

.surveys-development-modal {
  align-items: center;
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 24px;
  position: fixed;
  z-index: 1300;
}

.surveys-development-modal__backdrop {
  background: rgba(15, 23, 42, 0.58);
  border: 0;
  cursor: default;
  inset: 0;
  padding: 0;
  position: absolute;
}

.surveys-development-modal__dialog {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 12px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.28);
  max-height: min(860px, calc(100vh - 48px));
  max-width: 820px;
  overflow: auto;
  position: relative;
  width: 100%;
}

.surveys-development-modal__header {
  align-items: flex-start;
  background: #e8f7ff;
  border-bottom: 1px solid #7dd3fc;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 16px 18px;
  position: sticky;
  top: 0;
  z-index: 1;
}

.surveys-development-modal__header h2,
.surveys-development-modal__header p {
  margin: 0;
}

.surveys-development-modal__header h2 {
  color: #101828;
  font-size: 18px;
}

.surveys-development-modal__header p {
  color: #475467;
  font-size: 12px;
  margin-top: 4px;
}

.surveys-development-form {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 18px;
}

.surveys-development-form label {
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  min-width: 0;
}

.surveys-development-form input,
.surveys-development-form select,
.surveys-development-form textarea {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  color: #101828;
  font: inherit;
  font-weight: 500;
  min-height: 38px;
  padding: 8px 10px;
  width: 100%;
}

.surveys-development-form textarea {
  min-height: 68px;
  resize: vertical;
}

.surveys-development-form__wide {
  grid-column: 1 / -1;
}

.surveys-development-form__privacy {
  background: #fffaeb;
  border: 1px solid #fedf89;
  border-radius: 8px;
  color: #854a0e;
  font-size: 12px;
  margin: -4px 0 0;
  padding: 9px 11px;
}

.surveys-development-form__actions {
  align-items: center;
  border-top: 1px solid #eaecf0;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding-top: 14px;
}

@media (max-width: 700px) {
  .surveys-development-modal {
    align-items: flex-end;
    padding: 12px;
  }

  .surveys-development-form {
    grid-template-columns: 1fr;
  }

  .surveys-development-form__wide {
    grid-column: 1;
  }
}

.surveys-record-card h4 {
  color: var(--app-heading);
  font-size: 15px;
  line-height: 1.25;
  margin: 0;
  overflow-wrap: anywhere;
}

.surveys-record-card__meta {
  color: var(--app-muted);
  font-size: 12px;
  gap: 6px 10px;
}

.surveys-record-card__meta:empty {
  display: none;
}

.surveys-record-card__meta span {
  align-items: center;
  background: #ffffff;
  border: 1px solid #edf2f7;
  border-radius: 999px;
  display: inline-flex;
  min-height: 23px;
  padding: 3px 8px;
}

.surveys-record-card__inline-meta {
  color: #667085;
  font-size: 12px;
  font-weight: 700;
}

.surveys-record-card__summary,
.surveys-record-card__comments {
  color: #344054;
  font-size: 13px;
  margin: 0;
  overflow-wrap: anywhere;
}

.surveys-record-card__summary {
  align-items: baseline;
  background: #f8fafc;
  border: 1px solid #eef2f6;
  border-radius: 7px;
  display: flex;
  gap: 8px;
  padding: 7px 9px;
}

.surveys-record-card__qa {
  align-items: stretch;
  background: #f8fafc;
  border: 1px solid #eef2f6;
  border-radius: 7px;
  display: grid;
  gap: 1px;
  grid-template-columns: minmax(0, 1fr) minmax(120px, 180px);
  overflow: hidden;
}

.surveys-record-card__qa div {
  background: #fff;
  display: grid;
  gap: 3px;
  padding: 8px 10px;
}

.surveys-record-card__qa span {
  color: #0876a3;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.surveys-record-card__qa p {
  color: #344054;
  font-size: 13px;
  margin: 0;
  overflow-wrap: anywhere;
}

.surveys-record-card__summary span {
  color: #0876a3;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.surveys-record-card__summary p {
  margin: 0;
}

.surveys-record-card__comments {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 10px;
  white-space: pre-wrap;
}

.surveys-record-card--qa,
.surveys-record-card--engagement {
  gap: 10px;
  padding: 14px 16px;
}

.surveys-record-card--qa h4,
.surveys-record-card--engagement h4 {
  border-bottom: 1px solid #e4e7ec;
  font-size: 14px;
  font-weight: 800;
  margin: 0 0 2px;
  padding-bottom: 10px;
}

.surveys-record-card__qa--response,
.surveys-record-card__qa--engagement {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.surveys-record-card__qa--response .surveys-record-card__qa-answer,
.surveys-record-card__qa--engagement .surveys-record-card__qa-answer {
  background: #f2f4f7;
}

.surveys-record-card__qa--response .surveys-record-card__qa-answer.is-scored,
.surveys-record-card__qa--engagement .surveys-record-card__qa-answer.is-scored {
  background: color-mix(in srgb, var(--survey-answer-accent, #64748b) 16%, #ffffff);
  border: 1px solid color-mix(in srgb, var(--survey-answer-accent, #64748b) 28%, #ffffff);
}

.surveys-record-card__answer-value {
  color: #344054;
  font-size: 15px;
  font-weight: 850;
  line-height: 1.2;
}

.surveys-record-card__qa-answer.is-scored .surveys-record-card__answer-value {
  color: color-mix(in srgb, var(--survey-answer-accent, #64748b) 78%, #101828);
}

.surveys-record-card__qa-answer.is-scored > span {
  color: color-mix(in srgb, var(--survey-answer-accent, #64748b) 70%, #344054);
}

.surveys-record-card__comment-block {
  background: #f0f9ff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  display: grid;
  gap: 6px;
  padding: 10px 12px;
}

.surveys-record-card__comment-label {
  color: #0876a3;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.surveys-record-card__comment-block .surveys-record-card__comments {
  background: transparent;
  border: 0;
  border-radius: 0;
  color: #475467;
  font-size: 13px;
  line-height: 1.45;
  padding: 0;
  white-space: pre-wrap;
}

.surveys-record-card__footer-meta {
  align-items: center;
  border-top: 1px solid #d0d5dd;
  color: #667085;
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  gap: 0;
  line-height: 1.2;
  margin-top: 4px;
  padding-top: 10px;
}

.surveys-record-card__footer-meta > span {
  align-items: center;
  display: inline-flex;
  line-height: 1.2;
  min-height: 18px;
}

.surveys-record-card__footer-meta > span:not(:last-child)::after {
  align-items: center;
  color: #667085;
  content: "|";
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 20px;
  font-weight: 900;
  height: 18px;
  justify-content: center;
  line-height: 1;
  margin: 0 10px;
  width: 10px;
}

.surveys-record-card__meta-label {
  color: #98a2b3;
  font-weight: 700;
  line-height: inherit;
  margin-right: 4px;
}

.surveys-record-card__footer {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  margin-top: 0;
  padding-top: 0;
}

.surveys-record-card__action {
  margin-left: auto;
  min-width: 76px;
  text-align: center;
}

.surveys-record-card__action--start {
  background: var(--app-action-primary);
  border-color: var(--app-action-primary-border);
  box-shadow: 0 6px 16px rgba(46, 197, 255, 0.2);
  color: #fff;
}

.surveys-record-card__action--start:hover {
  background: var(--app-action-primary-hover);
  color: #fff;
}

.surveys-pill {
  align-items: center;
  background: #eef2f6;
  border-radius: 999px;
  color: #475467;
  display: inline-flex;
  font-size: 11px;
  font-weight: 850;
  min-height: 22px;
  padding: 0 8px;
}

.surveys-pill--survey-employee-pulse {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #c2410c;
}

.surveys-pill--survey-engagement {
  background: #fffaeb;
  border: 1px solid #fedf89;
  color: #b54708;
}

.surveys-pill--survey-feedback {
  background: #eef6ff;
  border: 1px solid #c8dcff;
  color: #175cd3;
}

.surveys-pill--survey-performance,
.surveys-pill--survey-performance-feedback {
  background: #f4f0ff;
  border: 1px solid #d8ccff;
  color: #5925dc;
}

.surveys-pill--score {
  background: #ecfdf5;
  color: #087350;
}

.surveys-pill--status {
  background: #e8fbff;
  color: #0b7894;
}

.surveys-answer-list {
  display: grid;
  gap: 8px;
  margin: 0;
}

.surveys-answer-list div {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 9px;
}

.surveys-answer-list dt {
  color: #344054;
  font-size: 12px;
  font-weight: 850;
}

.surveys-answer-list dd {
  color: #475467;
  font-size: 13px;
  margin: 4px 0 0;
}

.inbox-message-empty {
  color: #667085;
  display: grid;
  min-height: 180px;
  place-items: center;
  text-align: center;
}

.inbox-message-empty h3 {
  color: #16324f;
  margin-bottom: 6px;
}

.cycle-edit-actions {
  /* Top-align title with Cancel/Save so Unsaved Changes growing under Save
     never recenters (and drops) the page title. */
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  justify-content: space-between;
  margin: 0 0 18px;
}

/* Keep top page action bars clear of the shared container accent line. */
.settings-page-shell > .cycle-edit-actions:not(.cycle-edit-actions--bottom):first-child,
.settings-page-shell > form > .cycle-edit-actions:not(.cycle-edit-actions--bottom):first-of-type {
  padding-top: 10px;
}

.cycle-edit-actions > .settings-group-title,
.cycle-edit-actions > .cycle-edit-actions__title,
.cycle-edit-actions > .app-page-title {
  align-items: center;
  color: var(--app-page-title-color, #101828);
  display: inline-flex;
  flex: 1 1 auto;
  font-size: var(--app-page-title-size, 22px) !important;
  font-weight: var(--app-page-title-weight, 700);
  gap: 8px;
  letter-spacing: -0.02em;
  line-height: var(--app-page-title-line-height, 1.2);
  margin: 0;
  /* Match control height so the title optically centers with Cancel/Save
     without using row-level align-items:center (which shifts the title when
     Unsaved Changes appears under Save). */
  min-height: var(--app-control-height, 38px);
  min-width: min(100%, 12rem);
  overflow-wrap: anywhere;
}

.cycle-edit-actions__buttons {
  /* Top-align so Cancel stays level with Save when Unsaved Changes
     grows the save stack downward. */
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-left: auto;
}

.cycle-edit-actions__buttons > .button-small,
.cycle-edit-actions__buttons > .button-primary,
.cycle-edit-actions__buttons > .app-save-action-stack > .button-small,
.cycle-edit-actions__buttons > .app-save-action-stack > .button-primary,
.cycle-edit-actions__buttons > .cycle-edit-preview-button,
.cycle-edit-actions__buttons > .pr-edit-preview-button,
.cycle-edit-actions--bottom:is(.cycle-edit-actions--final, .comp-config-actions--bottom, .succession-config-actions--bottom) > .button-small,
.cycle-edit-actions--bottom:is(.cycle-edit-actions--final, .comp-config-actions--bottom, .succession-config-actions--bottom) > .button-primary,
.cycle-edit-actions--bottom:is(.cycle-edit-actions--final, .comp-config-actions--bottom, .succession-config-actions--bottom) > .cycle-edit-preview-button,
.cycle-edit-actions--bottom:is(.cycle-edit-actions--final, .comp-config-actions--bottom, .succession-config-actions--bottom) > .pr-edit-preview-button {
  align-items: center !important;
  border-radius: 6px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  font-size: 12px !important;
  gap: 5px !important;
  justify-content: center !important;
  line-height: 1.05 !important;
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 12px !important;
  white-space: nowrap !important;
}

.cycle-edit-preview-button {
  background: var(--app-action-secondary) !important;
  border-color: var(--app-border-soft) !important;
  box-shadow: none !important;
  color: #344054 !important;
  font-weight: 800 !important;
}

.cycle-edit-preview-button:hover,
.cycle-edit-preview-button:focus-visible {
  background: var(--app-action-secondary-hover) !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.09) !important;
  color: var(--keshero-teal) !important;
  transform: translateY(-1px);
}

html[data-keshero-theme="dark"] .cycle-edit-preview-button {
  background-color: #162234 !important;
  border-color: #334155 !important;
  color: #dbeafe !important;
}

html[data-keshero-theme="dark"] .cycle-edit-preview-button:hover,
html[data-keshero-theme="dark"] .cycle-edit-preview-button:focus-visible {
  background-color: #1f3148 !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.22), 0 10px 22px rgba(0, 0, 0, 0.32) !important;
  color: #e0f2fe !important;
}

.cycle-editor-tabs {
  grid-column: 1 / -1;
  margin: -4px 0 20px;
  min-width: 0;
}

.cycle-editor-participant-panel {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 0 0 12px 12px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  overflow: hidden;
}

.cycle-editor-participant-frame {
  background: #ffffff;
  border: 0;
  box-sizing: border-box;
  display: block;
  max-width: none !important;
  min-height: 720px;
  width: 100% !important;
}

.cycle-participant-embed-body {
  background: #ffffff;
  margin: 0;
  min-width: 0;
  padding: 0;
}

.cycle-participant-panel--embedded {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  max-width: none !important;
  padding: 16px !important;
  width: 100% !important;
}
.cycle-editor-participant-panel::before,
.cycle-participant-panel--embedded::before,
.cycle-participant-embed-body .panel::before {
  background: none !important;
  content: none !important;
  display: none !important;
  height: 0 !important;
}

html[data-keshero-theme="dark"] .cycle-editor-participant-panel,
html[data-keshero-theme="dark"] .cycle-editor-participant-frame,
html[data-keshero-theme="dark"] .cycle-participant-embed-body {
  background: var(--app-surface);
  border-color: var(--app-border);
}

.cycle-edit-actions--bottom {
  margin: 24px 0 0;
}

.cycle-edit-actions--final {
  margin-bottom: 24px;
}

.cycle-validation-status {
  background: #fff1f3;
  border: 1px solid #fecdca;
  border-radius: 8px;
  color: #b42318;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  margin: -6px 0 16px;
  padding: 9px 12px;
}

.cycle-validation-status[hidden] {
  display: none;
}

.cycle-section-navigator {
  align-items: center;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid #dbe7f3;
  border-radius: 10px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  display: flex;
  gap: 6px;
  grid-column: 1 / -1;
  margin: -6px 0 16px;
  overflow-x: auto;
  padding: 7px;
  position: sticky;
  scrollbar-width: thin;
  top: 136px;
  width: 100%;
  z-index: 120;
}

.cycle-section-navigator:empty { display: none; }

.cycle-section-navigator__link {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 8px;
  color: #475467;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 750;
  gap: 6px;
  line-height: 1.2;
  padding: 7px 9px;
  text-decoration: none;
  white-space: nowrap;
}

.cycle-section-navigator__link:hover,
.cycle-section-navigator__link:focus-visible,
.cycle-section-navigator__link.is-active {
  background: #eff8ff;
  border-color: #b9e6fe;
  color: #075985;
  outline: none;
}

.cycle-section-navigator__step {
  align-items: center;
  background: #e0f2fe;
  border-radius: 999px;
  color: #075985;
  display: inline-flex;
  font-size: 10px;
  font-weight: 900;
  height: 20px;
  justify-content: center;
  width: 20px;
}

.cycle-section-navigator__state {
  background: #12b76a;
  border-radius: 999px;
  height: 7px;
  width: 7px;
}

.cycle-section-navigator__link[data-state="issue"] .cycle-section-navigator__state { background: #f04438; }
.cycle-section-navigator__link[data-state="optional"] .cycle-section-navigator__state { background: #98a2b3; }
.cycle-section-navigator__link[data-changed="1"] .cycle-section-navigator__state {
  background: #f59e0b;
  box-shadow: 0 0 0 2px #fedf89;
}

.cycle-unsaved-indicator {
  color: #b42318;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
}

.cycle-unsaved-indicator[hidden] { display: none; }

/* Save stays on the Cancel baseline; Unsaved Changes is absolutely under Save.
   Never change stack layout metrics when dirty — parents that need clearance
   reserve padding-bottom always (see .cycle-edit-actions, skills/pm footers). */
.app-save-action-stack {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  justify-content: center;
  position: relative;
}

.app-save-action-stack > .app-unsaved-indicator {
  left: 50%;
  pointer-events: none;
  position: absolute;
  top: calc(100% + 4px);
  transform: translateX(-50%);
  white-space: nowrap;
  z-index: 2;
}

.pm-goal-edit-card > .pm-goal-save-row,
.pm-assignment-edit-card > .pm-assignment-save-row {
  /* Room under absolute Unsaved Changes inside edit cards */
  padding-bottom: 20px;
}

.pm-cycle-edit-save-button:disabled {
  background: #d0d5dd !important;
  border-color: #c4cbd4 !important;
  box-shadow: none !important;
  color: #667085 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

.cycle-edit-card {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-sizing: border-box;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  max-width: 100%;
  min-width: 0;
  padding: 18px;
  width: 100%;
}

.cycle-edit-card__title {
  color: #0f172a;
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 8px;
}

.cycle-edit-card__hint {
  color: #667085;
  font-size: 13px;
  line-height: 1.45;
  margin: 0 0 14px;
  max-width: 880px;
}

.cycle-edit-card--guided {
  background: #fbfdff;
  border: 1px solid #dbe7f3;
  border-color: #d8e4ef;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.05);
  padding: 16px;
  scroll-margin-top: 202px;
}

.cycle-guided-section-header {
  align-items: center;
  background: linear-gradient(135deg, #f0f9ff 0%, #f8fbff 68%, #f5f3ff 100%);
  border: 1px solid #d6e7f7;
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  padding: 13px 14px;
}

.cycle-guided-section-header__step {
  align-items: center;
  background: var(--keshero-dark-blue, #075985);
  border: 3px solid #dff4ff;
  border-radius: 999px;
  box-sizing: border-box;
  box-shadow: 0 0 0 1px #7dd3fc;
  color: #fff;
  display: inline-flex;
  flex: 0 0 30px;
  font-size: 13px;
  font-weight: 900;
  height: 30px;
  justify-content: center;
  line-height: 1;
  width: 30px;
}

.cycle-guided-section-header__copy {
  display: grid;
  flex: 1 1 auto;
  gap: 3px;
  min-width: 0;
}

.cycle-section-status {
  align-items: center;
  background: #ecfdf3;
  border: 1px solid #abefc6;
  border-radius: 999px;
  box-shadow: 0 1px 2px rgba(6, 118, 71, 0.12);
  color: #067647;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  line-height: 1;
  padding: 7px 11px;
  white-space: nowrap;
}

.cycle-section-status[data-state="complete"]::before {
  content: "✓";
  font-size: 11px;
  font-weight: 900;
}

.cycle-section-status[data-state="issue"] {
  background: #fff1f3;
  border-color: #fecdca;
  color: #b42318;
}

.cycle-section-status[data-state="optional"] {
  background: #f2f4f7;
  border-color: #d0d5dd;
  color: #475467;
}

.cycle-section-locked {
  align-items: center;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  color: #4338ca;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  line-height: 1;
  padding: 7px 11px;
  white-space: nowrap;
}

.cycle-section-locked::before {
  content: "🔒";
  font-size: 10px;
}

.cycle-section-changed {
  align-items: center;
  background: #fff4d6;
  border: 1px solid #f59e0b;
  border-radius: var(--app-field-radius, 6px);
  box-shadow: 0 1px 2px rgba(146, 64, 14, 0.14);
  box-sizing: border-box;
  color: #92400e;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 850;
  gap: 6px;
  line-height: 1;
  min-height: 28px;
  padding: 0 10px;
  white-space: nowrap;
}

.settings-section-reset {
  flex: 0 0 auto;
  margin: 0;
}

/* Height/shape pairing with .cycle-section-changed is enforced near the
   compact button standard so it beats the global 38px control height. */

/* Settings / dense panel section titles: change count beside the heading. */
.settings-section-title-row,
.job-arch-settings-panel__head,
.field-management-section-heading {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
}

.settings-section-title-row > h3,
.settings-section-title-row > h4,
.job-arch-settings-panel__head > h4,
.field-management-section-title {
  flex: 0 1 auto;
  margin: 0;
}

.settings-section-title-row > p,
.job-arch-settings-panel__head > p,
.field-management-section-impact {
  flex: 1 1 100%;
}

/* Shared left-side row reorder grip (matches user-access drag handle dots).
   Larger hit target so pointer-based DnD is easier to grab and hold. */
.app-row-drag-handle {
  align-items: center;
  appearance: none;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: #98a2b3;
  cursor: grab;
  display: inline-flex;
  flex: 0 0 auto;
  height: 36px;
  justify-content: center;
  margin: 0;
  min-height: 36px;
  min-width: 32px;
  padding: 0;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  width: 32px;
}

.pm-task-status-table .app-row-drag-handle,
.pm-table .app-row-drag-handle {
  height: 36px;
  min-height: 36px;
  min-width: 32px;
  width: 32px;
}

.app-row-drag-handle:hover,
.app-row-drag-handle:focus-visible {
  background: rgba(16, 24, 40, 0.06);
  border-color: #d0d5dd;
  color: #667085;
}

.app-row-drag-handle:focus-visible {
  outline: 2px solid #1d9bf0;
  outline-offset: 1px;
}

.app-row-drag-handle:active,
.is-row-dragging .app-row-drag-handle {
  background: rgba(16, 24, 40, 0.08);
  border-color: #98a2b3;
  color: #475467;
  cursor: grabbing;
}

body.is-app-row-reordering {
  cursor: grabbing !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

body.is-app-row-reordering * {
  cursor: grabbing !important;
}

.app-row-drag-handle__grip {
  display: block;
  height: 14px;
  pointer-events: none;
  position: relative;
  width: 8px;
}

.app-row-drag-handle__grip::before {
  background: currentColor;
  border-radius: 50%;
  box-shadow:
    5px 0 0 currentColor,
    0 5px 0 currentColor,
    5px 5px 0 currentColor,
    0 10px 0 currentColor,
    5px 10px 0 currentColor;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  top: 1px;
  width: 2px;
}

.settings-line-row-reorder,
.job-arch-field-order {
  align-items: center;
  display: inline-flex;
  gap: 4px;
}

[data-app-row-sortable-item].is-row-dragging,
[data-job-arch-order-row].is-row-dragging,
[data-field-row].is-row-dragging,
[data-task-status-row].is-row-dragging,
[data-timeline-color-rule-row].is-row-dragging {
  opacity: 0.45;
}

[data-app-row-sortable-item].is-row-drag-over,
[data-job-arch-order-row].is-row-drag-over,
[data-field-row].is-row-drag-over,
[data-task-status-row].is-row-drag-over,
[data-timeline-color-rule-row].is-row-drag-over {
  box-shadow: inset 0 2px 0 #84adff;
}

.field-management-reorder-cell {
  width: 1%;
  white-space: nowrap;
}

/* Changed fields: curved inset left bar + Was: (no gray wash). Amber =
   modified/attention — distinct from primary blue focus/links. */
.is-changed {
  border-radius: 8px;
  box-shadow: inset 3px 0 0 #f59e0b;
  padding-left: 8px;
}

/* Generated change wrappers are inline spans. Give them a two-row layout so
   the amber change bar frames both the control and its previous-value line. */
.app-change-field.is-changed {
  display: inline-grid;
  gap: 2px;
  max-width: 100%;
  vertical-align: top;
}

.app-change-field.is-changed > .app-change-was {
  margin-top: 0;
}

/* Settings field cards (org-chart orientation, span-range numbers, etc.):
   keep Was: as a normal line under the control, never as an absolute overlay. */
.settings-span-range-card.is-changed > .app-change-was,
.settings-org-chart-field.is-changed > .app-change-was {
  position: static;
  right: auto;
  top: auto;
  white-space: normal;
}

.app-change-was {
  color: #78716c;
  display: block;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.01em;
  line-height: 1.35;
  margin-top: 2px;
  min-height: 15px;
  text-align: left;
}

.app-change-was--expandable {
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: rgba(120, 113, 108, 0.45);
  text-underline-offset: 2px;
}

.app-change-was--expandable:hover,
.app-change-was--expandable:focus-visible {
  color: #57534e;
  text-decoration-color: #57534e;
}

.app-change-was--expandable:focus-visible {
  outline: 2px solid #f59e0b;
  outline-offset: 2px;
}

.app-change-was-modal[hidden] {
  display: none;
}

.app-change-was-modal {
  inset: 0;
  position: fixed;
  z-index: 2100;
}

.app-change-was-modal__backdrop {
  background: rgba(15, 23, 42, 0.42);
  inset: 0;
  position: absolute;
}

.app-change-was-modal__dialog {
  background: #fff;
  border: 1px solid var(--app-border-soft, #eaecf0);
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.24);
  display: grid;
  gap: 0;
  left: 50%;
  max-height: min(70vh, 520px);
  overflow: hidden;
  padding: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(480px, calc(100vw - 32px));
}

.app-change-was-modal__head {
  align-items: flex-start;
  background: var(--app-popup-header-bg, #f0f9ff);
  border-bottom: 1px solid var(--app-popup-header-border, #e0f2fe);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 18px 20px;
}

.app-change-was-modal__title-wrap {
  min-width: 0;
}

.app-change-was-modal__head h3 {
  color: var(--app-heading, #101828);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.25;
  margin: 0;
}

.app-change-was-modal__subtitle {
  color: var(--app-muted, #667085);
  font-size: 12px;
  line-height: 1.45;
  margin: 4px 0 0;
}

.app-change-was-modal__close.app-modal-close {
  flex: 0 0 auto;
}

.app-change-was-modal__body {
  color: var(--app-text, #344054);
  font-family: inherit;
  font-size: 14px;
  line-height: 1.55;
  margin: 0;
  max-height: min(52vh, 420px);
  overflow: auto;
  padding: 18px 20px 20px;
  white-space: pre-wrap;
  word-break: break-word;
}

.cycle-guided-section-header .cycle-edit-card__title {
  color: #101828;
  font-size: 15px;
  line-height: 1.25;
  margin: 0;
}

.cycle-guided-section-header__copy p {
  color: #526277;
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
}

.cycle-guided-section-toggle.app-disclosure-chevron {
  --app-disclosure-chevron-color: #475467;
  --app-disclosure-chevron-size: 7px;
  --app-disclosure-chevron-thickness: 2px;
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: 6px;
  cursor: pointer;
  flex: 0 0 auto;
  height: 28px;
  margin: 0;
  padding: 0;
  width: 28px;
  -webkit-appearance: none;
}

.cycle-guided-section-toggle.app-disclosure-chevron:hover {
  --app-disclosure-chevron-color: #005eaa;
  background: rgba(255, 255, 255, 0.72);
}

.cycle-guided-section-toggle.app-disclosure-chevron:focus-visible {
  outline: 2px solid #1d9bf0;
  outline-offset: 2px;
}

.cycle-edit-card--guided.is-collapsed .cycle-guided-section-header,
.cycle-edit-card--guided.is-collapsed .pr-edit-layout-card__head {
  margin-bottom: 0;
}

.cycle-edit-card--guided.is-collapsed > :not(.cycle-guided-section-header):not([data-review-link-header]):not(.pr-edit-layout-card__head):not(input[type="hidden"]) {
  display: none !important;
}

/* Performance Rating / Progress cycle create/edit: use full page content width (body gutters only). */
.pm-cycle-edit-form {
  max-width: none;
  width: 100%;
}

.pm-cycle-edit-layout {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin: 0;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.pm-cycle-edit-layout > .cycle-edit-card ~ .cycle-edit-card {
  margin-top: 0;
}

.admin-cycle-grid-setup-stack {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pm-cycle-edit-table-wrap {
  border: 1px solid var(--app-border-soft);
  border-radius: var(--app-radius-control);
  box-sizing: border-box;
  margin-top: 4px;
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
}

.cycle-edit-grid {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.cycle-edit-grid > .cycle-edit-field {
  min-width: 0;
}

.cycle-edit-grid--wide {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.cycle-edit-grid--spaced {
  margin-top: 12px;
}

.cycle-edit-field {
  align-content: start;
  align-self: start;
  color: #344054;
  display: grid;
  font-size: 13px;
  font-weight: 700;
  gap: 6px;
}

.cycle-edit-field input,
.cycle-edit-field select,
.cycle-edit-field textarea {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  min-height: 38px;
  padding: 8px 10px;
  width: 100%;
}

.cycle-edit-field textarea {
  min-height: 96px;
  resize: vertical;
}

.cycle-edit-field input:focus,
.cycle-edit-field select:focus,
.cycle-edit-field textarea:focus {
  border-color: var(--app-action-primary);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  outline: none;
}

.pm-required-label {
  align-items: center;
  display: inline-flex;
  gap: 2px;
  white-space: nowrap;
}

.cycle-axis-lines {
  display: grid;
  gap: 8px;
  margin-top: 6px;
}

.cycle-axis-line-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.cycle-axis-label-input {
  flex: 1 1 220px;
  max-width: 100%;
  min-width: 0;
}

.cycle-edit-field-hint {
  color: #667085;
  display: block;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
  margin-top: 4px;
}

.cycle-axis-lines-serialized {
  height: 1px;
  left: -9999px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  top: auto;
  width: 1px;
}

.admin-cycle-grid-lock-notice {
  align-items: center;
  background: #fffaeb;
  border: 1px solid #fec84b;
  border-radius: 8px;
  color: #7a2e0e;
  display: flex;
  flex-wrap: wrap;
  font-size: 13px;
  gap: 10px 16px;
  justify-content: space-between;
  line-height: 1.45;
  margin-top: 0;
  padding: 10px 12px;
}

.admin-cycle-grid-lock-notice__copy { flex: 1 1 620px; }

.box-grid-cell {
  text-align: center;
  vertical-align: middle;
}

.pm-cycle-edit-table-wrap th.cell {
  text-align: center;
}

.box-grid-cell input,
.box-grid-cell select {
  text-align: center;
}

.box-target-cell {
  align-items: center;
  display: inline-flex;
  gap: 8px;
  justify-content: center;
  width: 100%;
}

.box-target-cell--combined {
  align-items: center;
  display: flex;
  flex-flow: row wrap;
  gap: 8px 12px;
  justify-content: flex-start;
  min-width: 0;
  padding: 2px 0;
}

.box-target-cell__name-row {
  align-items: center;
  display: flex;
  flex: 1 1 220px;
  gap: 8px;
  min-width: 0;
}

.box-lock-state,
.box-usage-state {
  align-items: center;
  background: #ecfdf3;
  border: 1px solid #abefc6;
  border-radius: 999px;
  color: #067647;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 5px;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  padding: 5px 7px;
  white-space: nowrap;
}

.box-lock-state::before,
.box-usage-state::before {
  background: #12b76a;
  border-radius: 999px;
  content: "";
  height: 6px;
  width: 6px;
}

.box-lock-state.is-not-in-use,
.box-usage-state.is-not-in-use {
  background: #f2f4f7;
  border-color: #d0d5dd;
  color: #475467;
}

.box-lock-state.is-not-in-use::before,
.box-usage-state.is-not-in-use::before {
  background: #98a2b3;
}

.box-target-cell__pct-row {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
  justify-content: flex-start;
  width: auto;
}

.box-target-cell__pct-label {
  color: #667085;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 750;
}

.box-target-cell__pct-control {
  width: 7.25rem;
}

.box-target-cell__suffix {
  color: var(--muted-text, #667085);
  font-size: 12px;
  font-weight: 700;
}

.box-grid-cell--combined {
  background: #ffffff;
  padding: 12px;
  text-align: left;
  vertical-align: top;
}

.box-grid-cell--combined .admin-cycle-create-label-input {
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
  width: auto;
}

.box-grid-cell--combined .admin-cycle-create-target-input {
  font-variant-numeric: tabular-nums;
  min-height: 32px;
  text-align: right;
  width: 4.75rem;
}

.admin-cycle-create-matrix-table--boxes {
  max-width: 100%;
  min-width: 720px;
  table-layout: fixed;
  width: 100%;
}

.admin-cycle-create-matrix-table--boxes th,
.admin-cycle-create-matrix-table--boxes td {
  border: 1px solid var(--app-border-soft);
}

.admin-cycle-create-matrix-table--boxes tr > :first-child {
  max-width: 120px;
  min-width: 120px;
  overflow-wrap: anywhere;
  white-space: normal;
  width: 8%;
  word-break: break-word;
}

.admin-cycle-create-matrix-table--boxes tr:first-child th,
.admin-cycle-create-matrix-table--boxes tbody th:first-child {
  background: var(--app-surface-muted);
  font-weight: 800;
}

.pm-cycle-edit-form .admin-cycle-create-matrix-table--boxes tr > th.cell:first-child {
  padding: 10px 12px;
  text-align: center !important;
  vertical-align: middle !important;
}

.box-enabled-check {
  accent-color: #0284c7;
  height: 14px;
  margin: 0;
  width: 14px;
}

.box-grid-cell.is-disabled {
  background: #f2f4f7;
  color: #98a2b3;
  opacity: 0.62;
}

.box-grid-cell.is-disabled input,
.box-grid-cell.is-disabled select {
  background: #f9fafb;
  border-color: #d0d5dd;
  color: #98a2b3;
  cursor: not-allowed;
}

.box-grid-cell.is-disabled .box-enabled-check {
  cursor: pointer;
  opacity: 1;
}

.box-grid-cell.is-locked .box-enabled-check {
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  width: 1px;
}

.pm-cycle-edit-form table thead th {
  text-align: center !important;
}

.pm-cycle-edit-form table thead th:first-child,
.pm-cycle-edit-form table tbody th:first-child {
  text-align: left !important;
}

.pm-cycle-edit-save-button {
  background: #2ec5ff !important;
  border: 1px solid #0ea5e9 !important;
  box-shadow: 0 8px 18px rgba(14, 165, 233, 0.18);
  color: #ffffff !important;
}

.pm-cycle-edit-save-button:hover,
.pm-cycle-edit-save-button:focus-visible {
  background: #0ea5e9 !important;
  border-color: #0284c7 !important;
  color: #ffffff !important;
}

.pm-cycle-edit-page-title {
  white-space: nowrap;
}

.pm-cycle-create-draft-hint {
  margin: 0 0 14px;
}

.pm-cycle-feedback-hint {
  margin-top: 8px;
}

.pm-task-status-table th,
.pm-task-status-table td {
  text-align: center;
  vertical-align: middle;
}

.pm-task-status-table td:first-child,
.pm-task-status-table td:nth-child(2),
.pm-task-status-table th:first-child,
.pm-task-status-table th:nth-child(2) {
  text-align: left;
}

#pmTaskStatusArchiveTable td:nth-child(2),
#pmTaskStatusArchiveTable th:nth-child(2) {
  text-align: center;
}

.pm-task-status-name-input {
  width: 100%;
}

.pm-task-status-checkbox {
  --app-checkbox-size: 18px;
  accent-color: var(--app-checkbox-checked-bg, #12b76a);
  height: 18px;
  min-height: 18px;
  min-width: 18px;
  width: 18px;
}

.pm-task-status-checkbox:checked {
  background-size: 16px 16px;
}

.pm-task-status-kind-cell {
  text-align: center;
  vertical-align: middle;
}

.pm-task-status-kind-cell input[type="radio"] {
  --app-checkbox-size: 18px;
  --app-checkbox-radius: 4px;
  --app-checkbox-checked-bg: #3a7bff;
  --app-checkbox-checked-border: #3a7bff;
  --app-checkbox-mark: #ffffff;
  border-radius: 4px;
}

.pm-task-status-kind-cell .app-change-field.is-changed {
  display: inline-grid;
  gap: 2px;
  justify-items: center;
  max-width: 100%;
}

.pm-task-status-kind-cell .app-change-was {
  justify-self: center;
  text-align: center;
  white-space: normal;
}

.pm-task-status-board-cell {
  min-width: 11rem;
  vertical-align: middle;
}

.pm-task-status-board-select {
  max-width: 100%;
  min-width: 10.5rem;
}

.pm-task-status-board-warning {
  background: #fffbeb;
  border: 1px solid #f5d78a;
  border-radius: 8px;
  color: #78350f;
  font-size: 12px;
  line-height: 1.45;
  margin: 8px 0 0;
  max-width: 18rem;
  padding: 8px 10px;
}

.pm-task-status-row--archived {
  opacity: 0.72;
}

.pm-task-status-row--archived .pm-task-status-name-input {
  color: #667085;
}

.pm-task-status-color {
  background: transparent;
  border: 0;
  cursor: pointer;
  height: 28px;
  padding: 0;
  width: 40px;
}

.pm-task-status-move {
  display: inline-flex;
  gap: 6px;
}

.pm-task-status-move button {
  min-width: 30px;
  padding: 4px 8px;
}

.pm-task-status-preview {
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  padding: 4px 10px;
  white-space: nowrap;
}

.cycle-edit-card > .pm-cycle-edit-table-wrap + .pm-task-status-add-row,
.cycle-edit-card > .pm-table-scroll + .pm-task-status-add-row,
.cycle-edit-card > .pm-cycle-edit-table-wrap + .button-add-small,
.cycle-edit-card > .pm-table-scroll + .button-add-small {
  margin-top: 10px;
  width: fit-content;
}
.pm-task-status-add-row > .button-add-small {
  max-width: max-content;
  width: auto;
}

@media (max-width: 640px) {
  .cycle-edit-actions {
    flex-wrap: wrap;
  }

  .cycle-section-status {
    margin-left: auto;
  }

  .cycle-guided-section-header {
    align-items: flex-start;
    flex-wrap: wrap;
  }
}

@media (max-width: 760px) {
  .cycle-section-navigator {
    position: sticky;
    top: 8px;
  }
}

@media (max-width: 980px) {
  .surveys-filter-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inbox-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inbox-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .inbox-message-body {
    max-height: none;
    position: static;
  }

  .inbox-toolbar__filters {
    justify-content: flex-start;
  }
}

.feedback-survey-fieldset {
  border: 0;
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 0;
}

.pm-form .feedback-survey-actions {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: 12px;
  justify-content: flex-end;
}

.pm-form .feedback-survey-anonymous {
  align-items: center;
  display: inline-flex;
  flex-direction: row;
  gap: 8px;
  margin-right: auto;
  width: auto;
  white-space: nowrap;
}

.pm-form .feedback-survey-anonymous input[type="checkbox"] {
  flex: 0 0 auto;
  height: 12px;
  margin: 0;
  padding: 0;
  width: 12px;
}

.pm-form .feedback-survey-anonymous span {
  display: inline;
}

@media (max-width: 640px) {
  .surveys-module-tabs,
  .surveys-module-type-tabs,
  .surveys-module-type-tabs--count-1,
  .surveys-module-type-tabs--count-2,
  .surveys-module-type-tabs--count-3,
  .surveys-module-type-tabs--count-4,
  .surveys-filter-bar {
    grid-template-columns: minmax(0, 1fr);
  }

  .surveys-module-tab,
  .surveys-module-tab--primary,
  .surveys-module-tab--secondary {
    grid-column: span 1;
  }

  .inbox-summary-strip {
    grid-template-columns: minmax(0, 1fr);
  }

  .inbox-toolbar {
    align-items: stretch;
    flex-direction: column;
    overflow-x: hidden;
  }

  .inbox-toolbar__actions,
  .inbox-toolbar__pager {
    box-sizing: border-box;
    flex: 0 0 auto;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    width: 100%;
  }

  .inbox-toolbar__pager {
    justify-content: flex-start;
    margin-left: 0;
  }

  .inbox-card {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .inbox-card__check {
    padding-top: 0;
  }
}

.spotlight-page {
  display: grid;
  gap: 22px;
  grid-template-columns: minmax(300px, 400px) minmax(0, 1fr);
}

.spotlight-compose,
.spotlight-card {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  padding: 18px;
}

.spotlight-compose h3,
.spotlight-stream h3 {
  color: #0f172a;
  margin-top: 0;
}

.spotlight-form,
.spotlight-search,
.spotlight-comment-form {
  display: grid;
  gap: 12px;
}

.spotlight-form label,
.spotlight-form .spotlight-field,
.spotlight-form .spotlight-field__label,
.spotlight-form__field {
  color: var(--app-label-color, #344054);
  display: grid;
  font-size: var(--app-label-font-size, 12px);
  font-weight: var(--app-label-font-weight, 800);
  gap: var(--app-label-gap, 6px);
  letter-spacing: 0.01em;
  min-width: 0;
}

.spotlight-field {
  color: var(--app-label-color, #344054);
  display: grid;
  font-size: var(--app-label-font-size, 12px);
  font-weight: var(--app-label-font-weight, 800);
  gap: var(--app-label-gap, 6px);
  letter-spacing: 0.01em;
  min-width: 0;
}

.spotlight-form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
.spotlight-form select,
.spotlight-form textarea,
.spotlight-search input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
.spotlight-search select,
.spotlight-comment-form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
.spotlight-comment-edit-form textarea {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  box-sizing: border-box;
  font: inherit;
  padding: 9px 10px;
  width: 100%;
}

.spotlight-form input:focus,
.spotlight-form select:focus,
.spotlight-form textarea:focus,
.spotlight-search input:focus,
.spotlight-search select:focus,
.spotlight-comment-form input:focus,
.spotlight-comment-edit-form textarea:focus {
  border-color: var(--keshero-blue);
  box-shadow: 0 0 0 3px rgba(58, 123, 255, 0.16);
  outline: none;
}

.spotlight-form select.is-invalid,
.spotlight-form input.is-invalid {
  border-color: var(--app-action-danger);
}

.spotlight-form textarea {
  resize: vertical;
}

.spotlight-recipient-picker,
.spotlight-tag-picker {
  margin-top: -4px;
}

.spotlight-recipient-label {
  position: relative;
}

.spotlight-recipient-combobox {
  display: grid;
  position: relative;
}

.spotlight-recipient-control {
  align-items: stretch;
  display: block;
}

.spotlight-recipient-control input {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  box-sizing: border-box;
  font: inherit;
  min-height: 38px;
  padding: 9px 10px;
  width: 100%;
}

.spotlight-recipient-menu {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 8px;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16);
  display: grid;
  left: 0;
  max-height: 240px;
  overflow: auto;
  padding: 6px;
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 70;
}

.spotlight-recipient-menu[hidden] {
  display: none !important;
}

.spotlight-recipient-menu button[hidden] {
  display: none !important;
}

.spotlight-recipient-menu button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: #101828;
  cursor: pointer;
  display: flex;
  font: inherit;
  font-weight: 700;
  justify-content: space-between;
  min-height: 34px;
  padding: 8px 10px;
  text-align: left;
}

.spotlight-recipient-menu button span {
  color: #667085;
  font-size: 12px;
  font-weight: 600;
  margin-left: 10px;
}

.spotlight-recipient-menu button:hover,
.spotlight-recipient-menu button:focus-visible {
  background: #eef4ff;
  color: var(--keshero-teal);
  outline: none;
}

/* Performance Progress recipient pickers: match Spotlight combobox behavior */
.pm-recipient-picker,
.pm-person-picker {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.pm-recipient-picker__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.pm-recipient-chip {
  align-items: center;
  background: #eef4ff;
  border: 1px solid #c7d7fe;
  border-radius: 999px;
  color: #16324f;
  display: inline-flex;
  gap: 8px;
  padding: 6px 10px;
}
.pm-recipient-chip__remove {
  background: transparent;
  border: 0;
  color: #344054;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  padding: 0;
}
.pm-form label.is-changed:has(.pm-recipient-picker),
.pm-form label.is-changed:has(.pm-person-picker) {
  align-content: start;
  gap: 6px;
}
.pm-form label.is-changed:has(.pm-recipient-picker) > .app-change-was,
.pm-form label.is-changed:has(.pm-person-picker) > .app-change-was {
  margin-top: 0;
}
.pm-recipient-combobox {
  display: grid;
  min-width: 0;
  position: relative;
  width: 100%;
}

.spotlight-compose .pm-person-picker {
  position: relative;
  z-index: 12010;
}

.spotlight-compose .pm-person-picker:focus-within {
  z-index: 12020;
}

.spotlight-compose .pm-person-picker .pm-recipient-menu {
  z-index: 12021;
}

.pm-recipient-control {
  display: flex;
}
.pm-recipient-picker__input {
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  font: inherit;
  min-height: 38px;
  padding: 8px 10px;
  width: 100%;
}
.pm-recipient-picker__input:focus {
  border-color: var(--keshero-blue);
  box-shadow: 0 0 0 4px rgba(46, 197, 255, 0.22);
  outline: none;
}
.pm-recipient-menu {
  background: var(--app-popup-surface-custom, #fff);
  border: 1px solid var(--app-popup-border-custom, #d0d5dd);
  border-radius: var(--app-dropdown-popup-radius, 12px);
  box-shadow: 0 18px 44px rgba(16, 24, 40, 0.16);
  box-sizing: border-box;
  left: 0;
  margin-top: 6px;
  max-height: 280px;
  max-width: min(420px, calc(100vw - 32px));
  min-width: min(280px, 100%);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 6px;
  position: absolute;
  right: auto;
  top: 100%;
  width: max-content;
  z-index: 50;
}
.pm-recipient-menu[hidden] { display: none; }
.pm-recipient-menu button[hidden] { display: none; }
.pm-recipient-menu button,
.pm-recipient-menu [data-person-picker-option],
.pm-recipient-menu [data-recipient-option] {
  align-items: flex-start !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: calc(var(--ks-field-radius, 8px) - 2px);
  box-sizing: border-box;
  color: var(--app-text, #101828);
  cursor: pointer;
  display: flex !important;
  flex-direction: column;
  font: inherit;
  font-size: var(--app-control-font-size, 13px);
  font-weight: 600 !important;
  gap: 2px;
  justify-content: flex-start !important;
  line-height: 1.35;
  min-height: 36px;
  overflow-wrap: anywhere;
  padding: 8px 10px;
  text-align: left !important;
  white-space: normal;
  width: 100%;
  word-break: break-word;
}
.pm-recipient-menu__name {
  color: inherit;
  display: block;
  font-weight: 700 !important;
  text-align: left;
  width: 100%;
}
.pm-recipient-menu button span:not(.pm-recipient-menu__name),
.pm-recipient-menu__meta {
  color: var(--app-field-placeholder, #667085);
  display: block;
  font-size: 12px;
  font-weight: 500 !important;
  margin-top: 0;
  overflow-wrap: anywhere;
  text-align: left;
  width: 100%;
  word-break: break-word;
}
.pm-recipient-menu button:hover,
.pm-recipient-menu button:focus-visible,
.pm-recipient-menu [data-person-picker-option]:hover,
.pm-recipient-menu [data-person-picker-option]:focus-visible,
.pm-recipient-menu [data-recipient-option]:hover,
.pm-recipient-menu [data-recipient-option]:focus-visible {
  background: var(--ks-field-dropdown-hover, #f0f9ff) !important;
  color: var(--app-heading, #0f172a);
  outline: none;
}

.spotlight-tag-picker {
  display: grid;
  gap: 8px;
  position: relative;
  z-index: 12000;
}

.spotlight-tag-picker__dropdown {
  display: grid;
  gap: 6px;
  position: relative;
  width: 100%;
  z-index: 12000;
}

.spotlight-tag-picker__toggle {
  align-items: center;
  cursor: pointer;
  display: flex;
  font: inherit;
  font-weight: 700;
  justify-content: space-between;
  min-height: 36px;
  padding: 8px 34px 8px 10px;
  position: relative;
  text-align: left;
  width: 100%;
}

.spotlight-tag-picker__toggle::after {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #667085;
  content: "";
  margin-top: -2px;
  position: absolute;
  right: 12px;
  top: 50%;
}

.spotlight-tag-picker__toggle:focus-visible {
  border-color: var(--keshero-blue);
  box-shadow: 0 0 0 4px rgba(46, 197, 255, 0.22);
  outline: none;
}

.spotlight-tag-picker__menu {
  box-sizing: border-box;
  display: grid;
  gap: 2px;
  margin-top: 6px;
  max-height: 260px;
  overflow: auto;
  padding: 6px;
  position: static;
  width: 100%;
  z-index: 12001;
}

.spotlight-tag-picker__menu[hidden] {
  display: none;
}

.spotlight-tag-picker__option {
  box-sizing: border-box;
  cursor: pointer;
  width: 100%;
}

.spotlight-recipient-bubbles,
.spotlight-tag-bubbles {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 22px;
}

.spotlight-recipient-bubble,
.spotlight-tag-bubble {
  align-items: center;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  color: #1d4ed8;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 5px;
  min-height: 20px;
  padding: 3px 7px 3px 9px;
}

.spotlight-tag-bubble {
  background: var(--app-success-surface);
  border-color: var(--app-success-border);
  color: var(--app-success-fg);
}

.spotlight-recipient-bubble button,
.spotlight-tag-bubble button {
  align-items: center;
  background: #dbeafe;
  border: 0;
  border-radius: 999px;
  color: #1e3a8a;
  cursor: pointer;
  display: inline-flex;
  font-size: 10px;
  font-weight: 900;
  height: 16px;
  justify-content: center;
  line-height: 1;
  opacity: 0;
  padding: 0;
  width: 16px;
}

.spotlight-tag-bubble button {
  background: #d1fadf;
  box-shadow: inset 0 0 0 1px rgba(6, 118, 71, 0.12);
  color: #05603a;
}

.spotlight-recipient-bubble:hover button,
.spotlight-recipient-bubble button:focus-visible,
.spotlight-tag-bubble:hover button,
.spotlight-tag-bubble button:focus-visible {
  background: #ffffff;
  box-shadow: 0 0 0 1px rgba(6, 118, 71, 0.26);
  opacity: 1;
  outline: none;
}

.spotlight-tabs {
  align-items: flex-end;
  border-bottom: 3px solid #b8c4d4;
  display: flex;
  gap: 4px;
  grid-column: 1 / -1;
  padding-bottom: 0;
}

.spotlight-dashboard-scopes a {
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  color: #344054;
  font-size: 13px;
  font-weight: 800;
  padding: 7px 13px;
  text-decoration: none;
}

.spotlight-dashboard-scopes a.is-active {
  background: var(--app-action-primary);
  border-color: var(--app-action-primary-border);
  color: #ffffff;
}

.spotlight-tabs a {
  background: transparent;
  border: 1px solid transparent;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  color: #344054;
  font-size: 13px;
  font-weight: 800;
  padding: 10px 14px;
  text-decoration: none;
}

.spotlight-tabs a:hover {
  background: #f8fafc;
}

.spotlight-page .spotlight-tabs a.is-active {
  background: var(--keshero-blue);
  border-color: var(--keshero-blue);
  color: #ffffff;
}

.spotlight-dashboard {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  display: grid;
  gap: 16px;
  grid-column: 1 / -1;
  padding: 18px;
}

.spotlight-dashboard-header {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.spotlight-dashboard-filters {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.spotlight-dashboard-filters label {
  box-sizing: border-box;
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 5px;
  min-width: 0;
}

.spotlight-dashboard-filters input,
.spotlight-dashboard-filters select {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  font: inherit;
  min-height: 38px;
  min-width: 0;
  padding: 8px 10px;
  width: 100%;
}

.spotlight-dashboard-header h3,
.spotlight-dashboard-panel h4 {
  margin: 0;
}

.spotlight-dashboard-scopes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.spotlight-dashboard-scopes--dashboard {
  justify-content: flex-end;
  margin-left: auto;
}

.spotlight-dashboard-scopes--dashboard a {
  background: #ffffff !important;
  border-color: #d0d5dd !important;
  color: #101828 !important;
}

.spotlight-dashboard-scopes--dashboard a.is-active {
  background: var(--app-action-primary) !important;
  border-color: var(--app-action-primary-border) !important;
  color: #ffffff !important;
}

.spotlight-dashboard-scopes--dashboard a:not(.is-active):hover,
.spotlight-dashboard-scopes--dashboard a:not(.is-active):focus-visible {
  background: #f8fafc !important;
  color: #101828 !important;
}

.spotlight-dashboard-kpis {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.spotlight-dashboard-kpis > div {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 14px;
}

.spotlight-dashboard-kpis span {
  color: #667085;
  display: block;
  font-size: 12px;
  font-weight: 800;
}

.spotlight-dashboard-kpis b {
  color: #101828;
  display: block;
  font-size: 24px;
  margin-top: 5px;
}

.spotlight-dashboard-kpi--stacked {
  display: grid;
  gap: 5px;
  padding-bottom: 10px !important;
  padding-top: 10px !important;
}

.spotlight-dashboard-kpi-row {
  align-items: center;
  background: transparent;
  border: 0;
  border-top: 1px solid #e4e7ec;
  border-radius: 0;
  display: grid;
  gap: 4px 8px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  min-height: 26px;
  padding: 6px 0 0;
}

.spotlight-dashboard-kpi-row em {
  color: #344054;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.1;
}

.spotlight-dashboard-kpi-row strong {
  color: #101828;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.spotlight-dashboard-kpi-row small {
  color: #667085;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.spotlight-dashboard-panels {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.65fr);
}

.spotlight-dashboard-panels--recognition-received {
  align-items: start;
}

.spotlight-dashboard-panels--recognition-received > .spotlight-dashboard-panel--recognition-list:only-child {
  grid-column: 1 / -1;
}

.spotlight-dashboard-panel {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 14px;
}

.spotlight-dashboard-panel--wide {
  grid-column: 1 / -1;
}

.spotlight-dashboard-bars {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.spotlight-dashboard-bars--compact {
  gap: 9px;
}

.spotlight-dashboard-bar-row {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(72px, 0.34fr) minmax(120px, 1fr) auto;
}

.spotlight-dashboard-bar-row span {
  color: #475467;
  font-size: 12px;
  font-weight: 800;
}

.spotlight-dashboard-bar-row b {
  color: #101828;
  font-size: 13px;
  min-width: 28px;
  text-align: right;
}

.spotlight-dashboard-bar-track {
  background: #eef2f6;
  border-radius: 999px;
  height: 10px;
  overflow: hidden;
}

.spotlight-dashboard-bar {
  background: linear-gradient(90deg, var(--keshero-teal) 0%, var(--keshero-cyan-glow) 55%, var(--keshero-blue) 100%);
  border-radius: 999px;
  height: 100%;
  min-width: 3px;
}

.spotlight-dashboard-linechart {
  margin: 8px 0 0;
}

.spotlight-dashboard-linechart__plot {
  background:
    linear-gradient(180deg, #fbfdff 0%, #ffffff 76%),
    linear-gradient(90deg, rgba(46, 197, 255, 0.04), rgba(52, 195, 143, 0.04));
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  height: clamp(280px, var(--spotlight-trend-height, 300px), 560px);
  overflow: visible;
  position: relative;
}

.spotlight-dashboard-linechart__caption {
  color: #667085;
  font-size: 13px;
  line-height: 1.45;
  margin: 0 0 8px;
}

.spotlight-dashboard-linechart__legend {
  align-items: center;
  color: #667085;
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  font-weight: 800;
  gap: 12px;
  margin: 0 0 12px;
}

.spotlight-dashboard-linechart__legend span {
  align-items: center;
  display: inline-flex;
  gap: 6px;
}

.spotlight-dashboard-linechart__legend i {
  border-radius: 999px;
  display: inline-block;
  height: 3px;
  width: 24px;
}

.spotlight-dashboard-linechart__legend-current {
  background: linear-gradient(90deg, #2ec5ff, #5a4bff);
}

.spotlight-dashboard-linechart__legend-prior {
  background: repeating-linear-gradient(90deg, #98a2b3 0 5px, transparent 5px 9px);
}

.spotlight-dashboard-linechart__svg {
  display: block;
  height: 100%;
  overflow: visible;
  width: 100%;
}

.spotlight-dashboard-linechart__grid {
  stroke: #eef2f6;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.spotlight-dashboard-linechart__axis {
  stroke: #dde5ef;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.spotlight-dashboard-linechart__axis--y {
  stroke: #cfd8e3;
}

.spotlight-dashboard-linechart__area {
  fill: url(#spotlightTrendFill);
}

.spotlight-dashboard-linechart__line {
  filter: drop-shadow(0 3px 5px rgba(15, 23, 42, 0.12));
}

.spotlight-dashboard-linechart__line--prior {
  filter: none;
  opacity: 0.9;
}

.spotlight-dashboard-linechart__points,
.spotlight-dashboard-linechart__y-axis {
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.spotlight-dashboard-linechart__y-tick {
  color: #667085;
  font-size: 11px;
  font-weight: 800;
  left: 3px;
  line-height: 1;
  position: absolute;
  transform: translateY(-50%);
}

.spotlight-dashboard-linechart__point {
  align-items: center;
  display: inline-flex;
  height: 18px;
  justify-content: center;
  pointer-events: auto;
  position: absolute;
  transform: translate(-50%, -50%);
  width: 18px;
  z-index: 2;
}

.spotlight-dashboard-linechart__dot {
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(21, 112, 239, 0.18);
  fill: rgba(26, 166, 214, 0.82);
  background: rgba(26, 166, 214, 0.86);
  border: 2px solid rgba(255, 255, 255, 0.92);
  display: block;
  height: 12px;
  transition: transform 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
  width: 12px;
}

.spotlight-dashboard-linechart__point:hover .spotlight-dashboard-linechart__dot,
.spotlight-dashboard-linechart__point:focus-visible .spotlight-dashboard-linechart__dot {
  background: #1570ef;
  box-shadow: 0 4px 14px rgba(21, 112, 239, 0.32);
  transform: scale(1.28);
}

.spotlight-dashboard-linechart__point:focus-visible {
  outline: 2px solid rgba(21, 112, 239, 0.36);
  outline-offset: 2px;
}

.spotlight-dashboard-linechart__tooltip {
  background: rgba(16, 24, 40, 0.94);
  border-radius: 8px;
  bottom: calc(100% + 8px);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.22);
  color: #fff;
  display: grid;
  font-size: 12px;
  gap: 3px;
  left: 50%;
  min-width: 150px;
  opacity: 0;
  padding: 8px 10px;
  pointer-events: none;
  position: absolute;
  transform: translate(-50%, 4px);
  transition: opacity 0.14s ease, transform 0.14s ease;
  white-space: nowrap;
}

.spotlight-dashboard-linechart__point:hover .spotlight-dashboard-linechart__tooltip,
.spotlight-dashboard-linechart__point:focus-visible .spotlight-dashboard-linechart__tooltip {
  opacity: 1;
  transform: translate(-50%, 0);
}

.spotlight-dashboard-linechart__labels {
  box-sizing: border-box;
  height: 38px;
  margin-top: 10px;
  position: relative;
}

.spotlight-dashboard-linechart__label {
  color: #475467;
  display: flex;
  flex-direction: column;
  font-size: 10px;
  font-weight: 800;
  gap: 2px;
  min-width: 54px;
  position: absolute;
  text-align: center;
  transform: translateX(-50%);
}

.spotlight-dashboard-linechart__label-mo {
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.spotlight-dashboard-linechart__label-ct {
  color: #101828;
  font-size: 11px;
  font-weight: 800;
}

.spotlight-dashboard-table__grand-total td {
  background: #f8fafc;
  border-bottom: 2px solid #cbd5e1;
  font-weight: 800;
}

@media (max-width: 960px) {
  .spotlight-dashboard-linechart__labels {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .spotlight-dashboard-linechart__labels {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.spotlight-dashboard-table {
  border-collapse: collapse;
  margin-top: 10px;
  width: 100%;
}

.spotlight-dashboard-table th,
.spotlight-dashboard-table td {
  border-bottom: 1px solid #e5e7eb;
  padding: 9px 8px;
  text-align: left;
}

.spotlight-dashboard-table th {
  color: #475467;
  font-size: 12px;
  text-transform: none;
}

.spotlight-dashboard-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.spotlight-dashboard-tags span {
  background: var(--app-success-surface);
  border: 1px solid var(--app-success-border);
  border-radius: 999px;
  color: var(--app-success-fg);
  font-size: 12px;
  font-weight: 800;
  padding: 6px 9px;
}

.spotlight-panel-heading {
  align-items: start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 12px;
}

.spotlight-panel-heading span {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
  text-align: right;
}

.spotlight-avatar {
  align-items: center;
  background: var(--avatar-bg, #e0e7ff);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 999px;
  color: var(--avatar-fg, #1e1b4b);
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 900;
  height: 38px;
  justify-content: center;
  overflow: hidden;
  width: 38px;
}

.spotlight-avatar--sm {
  height: 28px;
  width: 28px;
}

.spotlight-avatar--lg {
  font-size: 16px;
  height: 58px;
  width: 58px;
}

.spotlight-avatar--xl {
  font-size: 24px;
  height: 88px;
  width: 88px;
}

.spotlight-avatar img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.spotlight-awards-panel {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.spotlight-award-winners {
  display: grid;
  gap: 10px;
}

.spotlight-award-card,
.spotlight-leader-row,
.spotlight-mini-person,
.spotlight-feed-card {
  align-items: center;
  display: flex;
  gap: 10px;
}

.spotlight-leader-row {
  background:
    linear-gradient(90deg, rgba(46, 197, 255, 0.08), rgba(138, 43, 226, 0.04)),
    #fff;
  border: 1px solid #e4e7ec;
  border-radius: 12px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
  padding: 10px;
}

.spotlight-leader-row > div {
  min-width: 0;
}

.spotlight-leader-row strong {
  background: #f0fcff;
  border: 1px solid #b8ecff;
  border-radius: 999px;
  color: #0b6f8c;
  font-size: 12px;
  margin-left: auto;
  padding: 5px 8px;
}

.spotlight-leader-rank {
  align-items: center;
  background: linear-gradient(180deg, #175cd3, #5a4bff);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 900;
  height: 28px;
  justify-content: center;
  width: 28px;
}

.spotlight-award-card {
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 12px;
}

.spotlight-award-card b,
.spotlight-leader-row b,
.spotlight-mini-person span {
  color: #101828;
  display: block;
  font-size: 13px;
  font-weight: 900;
}

.spotlight-award-card span,
.spotlight-leader-row small {
  color: #667085;
  display: block;
  font-size: 12px;
  font-weight: 700;
  margin-top: 2px;
}

.spotlight-award-score {
  background: #eef4ff;
  border: 1px solid #c7d7fe;
  border-radius: 8px;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 900;
  margin-top: 10px;
  padding: 8px 10px;
}

.spotlight-dashboard-bars--tags .spotlight-dashboard-bar-row {
  grid-template-columns: minmax(98px, 0.4fr) minmax(120px, 1fr) minmax(30px, auto) minmax(42px, auto);
}

.spotlight-dashboard-bar-row em,
.spotlight-value-row em {
  color: #667085;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  text-align: right;
}

.spotlight-dashboard-bar-row em.is-up {
  color: #027a48;
}

.spotlight-dashboard-bar-row em.is-down {
  color: #b42318;
}

.spotlight-leaderboard,
.spotlight-department-leaders,
.spotlight-value-leaders,
.spotlight-analytics-feed {
  display: grid;
  gap: 10px;
}

.spotlight-leader-row {
  border-bottom: 1px solid #f1f5f9;
  padding: 0 0 10px;
}

.spotlight-leader-row > div {
  flex: 1 1 auto;
  min-width: 0;
}

.spotlight-leader-row strong {
  color: #101828;
  font-size: 13px;
  font-weight: 900;
}

.spotlight-leader-rank {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #475467;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 900;
  height: 26px;
  justify-content: center;
  width: 26px;
}

.spotlight-top-recognized-panel {
  overflow: visible;
}

.spotlight-leaderboard--podium {
  gap: 12px;
}

.spotlight-leader-card {
  align-items: start;
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 12px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
  display: grid;
  gap: 10px;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
  padding: 12px;
  position: relative;
}

.spotlight-leader-card--first {
  align-items: center;
  background: linear-gradient(135deg, rgba(253, 176, 34, 0.12), rgba(46, 197, 255, 0.08)), #fff;
  gap: 12px;
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 0;
  padding: 14px;
}

.spotlight-leader-card--first::before {
  background: linear-gradient(90deg, #2ec5ff, #5a4bff, #8a2be2);
  content: "";
  height: 5px;
  inset: 0 0 auto;
  position: absolute;
}

.spotlight-leaderboard__runner-up-row {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.spotlight-leaderboard__remaining-row {
  display: grid;
  gap: 10px;
  grid-auto-flow: row;
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.spotlight-leaderboard__remaining-row > .spotlight-leader-card--compact:nth-child(-n + 3) {
  grid-column: span 4;
}

.spotlight-leaderboard__remaining-row > .spotlight-leader-card--compact:nth-child(n + 4) {
  grid-column: span 3;
  gap: 8px;
  padding: 9px 8px;
}

.spotlight-leader-card--compact {
  align-items: center;
  border-radius: 12px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
  gap: 10px;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  padding: 10px;
}

.spotlight-leader-card--compact .spotlight-leader-card__body {
  gap: 2px;
}

.spotlight-leader-card--compact .spotlight-leader-card__body b {
  font-size: 13px;
  white-space: normal;
}

.spotlight-leader-card--compact .spotlight-avatar {
  height: 32px;
  width: 32px;
}

.spotlight-leader-card--compact strong {
  font-size: 12px;
  padding: 5px 8px;
}

.spotlight-leader-card__hover {
  background: rgba(16, 24, 40, 0.96);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  bottom: calc(100% + 10px);
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.24);
  color: #fff;
  display: grid;
  gap: 8px;
  left: 50%;
  min-width: 360px;
  opacity: 0;
  padding: 11px 12px;
  pointer-events: none;
  position: absolute;
  transform: translate(-50%, 6px);
  transition: opacity 0.14s ease, transform 0.14s ease;
  z-index: 20;
}

.spotlight-leader-card__hover::after {
  background: rgba(16, 24, 40, 0.96);
  bottom: -5px;
  content: "";
  height: 10px;
  left: 50%;
  position: absolute;
  transform: translateX(-50%) rotate(45deg);
  width: 10px;
}

.spotlight-leader-card__hover b {
  color: #fff;
  font-size: 13px;
  line-height: 1.25;
  white-space: normal;
}

.spotlight-leader-card__hover small {
  color: #d0d5dd;
  font-size: 12px;
  font-weight: 800;
}

.spotlight-leader-card__hover-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.spotlight-leader-card__hover-section {
  align-content: start;
  display: grid;
  gap: 6px;
}

.spotlight-leader-card__hover-section:only-child {
  grid-column: 1 / -1;
}

.spotlight-leader-card__hover-section i {
  color: #98a2b3;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.spotlight-leader-card__hover-section span {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.spotlight-leader-card__hover em {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  padding: 3px 7px;
}

.spotlight-leader-card--compact:hover .spotlight-leader-card__hover,
.spotlight-leader-card--compact:focus-within .spotlight-leader-card__hover,
.spotlight-leader-card--compact:focus-visible .spotlight-leader-card__hover {
  opacity: 1;
  transform: translate(-50%, 0);
}

.spotlight-leader-card__body {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.spotlight-leader-card__body b {
  color: #101828;
  font-size: 15px;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.spotlight-leader-card--first .spotlight-leader-card__body b {
  font-size: 18px;
}

.spotlight-leader-card__body small {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.spotlight-leader-card__meta {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
  width: 100%;
}

.spotlight-leader-card strong,
.spotlight-leader-card__meta strong {
  background: #f0fcff;
  border: 1px solid #b8ecff;
  border-radius: 999px;
  color: #0b6f8c;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 900;
  padding: 6px 10px;
  white-space: nowrap;
}

.spotlight-leader-card__meta,
.spotlight-leader-card--first .spotlight-leader-card__meta {
  grid-column: 1 / -1;
}

.spotlight-leader-card--first strong,
.spotlight-leader-card--first .spotlight-leader-card__meta strong {
  font-size: 13px;
  padding: 6px 10px;
}

.spotlight-leader-card .spotlight-leader-rank {
  background: linear-gradient(180deg, #175cd3, #5a4bff);
  border: 0;
  color: #fff;
  position: static;
}

.spotlight-leader-card--first .spotlight-leader-rank {
  background: linear-gradient(180deg, #fdb022, #dc6803);
  box-shadow: 0 8px 18px rgba(220, 104, 3, 0.25);
  height: 32px;
  width: 38px;
}

.spotlight-leader-card--runner-up .spotlight-leader-rank,
.spotlight-leader-card--compact .spotlight-leader-rank {
  height: 28px;
  width: 36px;
}

.spotlight-leader-attributes,
.spotlight-leader-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.spotlight-leader-attributes span {
  background: #eef4ff;
  border: 1px solid #c7d7fe;
  border-radius: 999px;
  color: #1d4ed8;
  font-size: 10px;
  font-weight: 900;
  padding: 4px 7px;
}

.spotlight-leader-fields {
  margin-top: 2px;
}

.spotlight-leader-fields span {
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  color: #344054;
  display: grid;
  font-size: 11px;
  font-weight: 800;
  gap: 1px;
  min-width: 96px;
  padding: 6px 8px;
}

.spotlight-leader-fields em {
  color: #667085;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.spotlight-tag-insights {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.spotlight-tag-insight {
  background: linear-gradient(180deg, #ffffff, #f8fbff);
  border: 1px solid #e4e7ec;
  border-radius: 14px;
  display: grid;
  gap: 9px;
  padding: 12px;
}

.spotlight-tag-insight b {
  color: #101828;
  display: block;
  font-size: 14px;
  font-weight: 900;
}

.spotlight-tag-insight span {
  color: #667085;
  display: block;
  font-size: 12px;
  font-weight: 800;
  margin-top: 2px;
}

.spotlight-tag-insight__bar {
  background: #eef2f6;
  border-radius: 999px;
  height: 9px;
  overflow: hidden;
}

.spotlight-tag-insight__bar span {
  background: linear-gradient(90deg, #2ec5ff, #5a4bff);
  border-radius: inherit;
  height: 100%;
  margin: 0;
}

.spotlight-tag-insight em {
  color: #667085;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}

.spotlight-tag-insight em.is-up {
  color: #027a48;
}

.spotlight-tag-insight em.is-down {
  color: #b42318;
}

@media (max-width: 760px) {
  .spotlight-leader-card--first,
  .spotlight-leaderboard__runner-up-row,
  .spotlight-leaderboard__remaining-row {
    grid-template-columns: 1fr;
  }

  .spotlight-leaderboard__remaining-row > .spotlight-leader-card--compact {
    grid-column: 1 / -1;
  }

  .spotlight-leader-card__hover {
    left: 0;
    min-width: min(360px, calc(100vw - 32px));
    transform: translate(0, 6px);
  }

  .spotlight-leader-card__hover::after {
    left: 24px;
  }

  .spotlight-leader-card__hover-grid {
    grid-template-columns: 1fr;
  }

  .spotlight-leader-card--compact:hover .spotlight-leader-card__hover,
  .spotlight-leader-card--compact:focus-within .spotlight-leader-card__hover,
  .spotlight-leader-card--compact:focus-visible .spotlight-leader-card__hover {
    transform: translate(0, 0);
  }

  .spotlight-leader-card--first {
    justify-items: start;
  }
}

.spotlight-heatmap {
  display: grid;
  gap: 5px;
  grid-auto-flow: column;
  grid-template-rows: repeat(7, 14px);
  overflow-x: auto;
  padding: 2px 0 4px;
}

.spotlight-heatmap-cell {
  background: #eef2f6;
  border-radius: 3px;
  height: 14px;
  width: 14px;
}

.spotlight-heatmap-cell[data-level="1"] {
  background: #ccebdd;
}

.spotlight-heatmap-cell[data-level="2"] {
  background: #8fd6b6;
}

.spotlight-heatmap-cell[data-level="3"] {
  background: #45b989;
}

.spotlight-heatmap-cell[data-level="4"] {
  background: #157f5a;
}

.spotlight-department-leaders article {
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 10px;
}

.spotlight-department-leaders h5 {
  color: #344054;
  font-size: 12px;
  font-weight: 900;
  margin: 0;
}

.spotlight-mini-person b {
  margin-left: auto;
}

.spotlight-value-row {
  align-items: center;
  border-bottom: 1px solid #f1f5f9;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(100px, 0.8fr) minmax(0, 1fr) auto;
  padding-bottom: 9px;
}

.spotlight-value-row span {
  background: #ecfdf3;
  border: 1px solid #abefc6;
  border-radius: 999px;
  color: #027a48;
  font-size: 12px;
  font-weight: 900;
  padding: 4px 8px;
}

.spotlight-value-row b {
  color: #101828;
  font-size: 13px;
}

.spotlight-feed-card {
  align-items: flex-start;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 12px;
}

.spotlight-feed-card > div {
  flex: 1 1 auto;
  min-width: 0;
}

.spotlight-feed-card h5 {
  color: #101828;
  font-size: 14px;
  margin: 3px 0 4px;
}

.spotlight-feed-card p {
  color: #344054;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
}

.spotlight-feed-card__top,
.spotlight-feed-card__meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
}

.spotlight-feed-card__top b {
  color: #101828;
  font-size: 13px;
  font-weight: 900;
}

.spotlight-feed-card__top span,
.spotlight-feed-card__meta span {
  color: #667085;
  font-size: 12px;
  font-weight: 700;
}

.spotlight-feed-card__meta {
  margin-top: 8px;
}

.spotlight-mention-wrap {
  display: block;
  position: relative;
}

.spotlight-mention-editor {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  box-sizing: border-box;
  color: #101828;
  display: block;
  font: inherit;
  font-weight: 400;
  line-height: 1.45;
  min-height: 118px;
  overflow: auto;
  padding: 9px 10px;
  white-space: pre-wrap;
  width: 100%;
}

.spotlight-mention-editor:empty::before {
  color: #98a2b3;
  content: attr(data-placeholder);
  pointer-events: none;
}

.spotlight-mention-editor:focus {
  border-color: var(--keshero-blue);
  box-shadow: 0 0 0 3px rgba(58, 123, 255, 0.16);
  outline: none;
}

.spotlight-mention-editor.is-invalid {
  border-color: var(--app-action-danger);
}

.spotlight-picked-mention {
  color: #1d4ed8;
  font-weight: 700;
}

.spotlight-mention-menu {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(16, 24, 40, 0.16);
  left: 8px;
  max-height: 220px;
  min-width: min(320px, calc(100% - 16px));
  overflow: auto;
  padding: 6px;
  position: absolute;
  top: calc(100% - 8px);
  z-index: 20;
}

.spotlight-mention-menu[hidden] {
  display: none;
}

.spotlight-mention-menu button {
  background: #fff;
  border: 0;
  border-radius: 6px;
  color: #344054;
  cursor: pointer;
  display: block;
  font: inherit;
  font-weight: 700;
  padding: 8px 10px;
  text-align: left;
  width: 100%;
}

.spotlight-mention-menu button:hover,
.spotlight-mention-menu button:focus {
  background: #f2f4f7;
  outline: none;
}

.spotlight-inline-fields {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
}

@media (max-width: 720px) {
  .spotlight-inline-fields {
    grid-template-columns: minmax(0, 1fr);
  }
}

.spotlight-stream-header {
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr;
  margin-bottom: 14px;
  padding: 0;
}

.spotlight-search {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.spotlight-search > * {
  min-width: 0;
}

.spotlight-search > input[type="search"]:first-child {
  grid-column: span 2;
  width: 100%;
}

.spotlight-search label {
  box-sizing: border-box;
  display: grid;
  gap: 5px;
  min-width: 0;
}

.spotlight-search label > select,
.spotlight-search label > .app-rounded-select,
.spotlight-search label > input {
  min-width: 0;
  width: 100%;
}

.spotlight-search-date {
  display: grid;
  gap: 3px;
}

.spotlight-search-date span {
  color: var(--app-table-header-text);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  line-height: 1.2;
}

.spotlight-stream {
  min-width: 0;
}

.spotlight-stream-list {
  max-height: min(42rem, calc(100vh - 250px));
  min-height: 220px;
  overflow-y: auto;
  padding-right: 6px;
  scrollbar-gutter: stable;
}

.spotlight-card {
  margin-bottom: 14px;
  overflow: visible;
  position: relative;
}

.spotlight-stream .spotlight-card {
  padding: 0;
}

.spotlight-card::before {
  display: none;
}

.spotlight-stream-link {
  align-items: center;
  color: inherit;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 18px 20px 18px 22px;
  text-decoration: none;
}

.spotlight-stream-link:hover,
.spotlight-stream-link:focus {
  background: #fffbeb;
  outline: none;
}

.spotlight-open-indicator {
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  color: #344054;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  padding: 5px 10px;
}

.spotlight-card-header {
  align-items: flex-start;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.spotlight-detail-page {
  display: block;
}

.spotlight-detail-nav {
  margin-bottom: 12px;
}

.spotlight-detail-card {
  padding: 20px 22px 22px;
}

.spotlight-card-actions {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.spotlight-recognition-delete-form {
  margin: 0;
}

.spotlight-subject {
  color: #101828;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.25;
}

.spotlight-meta,
.spotlight-comment span {
  color: #667085;
  font-size: 12px;
}

.spotlight-body {
  color: #344054;
  line-height: 1.45;
  margin: 14px 0;
  white-space: pre-wrap;
}

.spotlight-tags,
.spotlight-mentions,
.spotlight-reactions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.spotlight-tags span,
.spotlight-mentions span {
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 8px;
}

.spotlight-reactions {
  margin-top: 14px;
  position: relative;
}

.spotlight-reaction-list {
  align-items: center;
  display: contents;
}

.spotlight-reaction-button {
  align-items: center;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  font-weight: 800;
  gap: 6px;
  min-height: 32px;
  padding: 5px 10px;
  position: relative;
}

.spotlight-reaction-button[data-reaction-names]:not([data-reaction-names=""]):hover::after,
.spotlight-reaction-button[data-reaction-names]:not([data-reaction-names=""]):focus::after {
  background: #101828;
  border-radius: 8px;
  bottom: calc(100% + 8px);
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.18);
  color: #fff;
  content: attr(data-reaction-names);
  font-size: 12px;
  font-weight: 700;
  left: 50%;
  line-height: 1.35;
  max-width: 220px;
  min-width: max-content;
  padding: 7px 9px;
  pointer-events: none;
  position: absolute;
  text-align: left;
  transform: translateX(-50%);
  white-space: normal;
  z-index: 40;
}

.spotlight-reaction-button[data-reaction-names]:not([data-reaction-names=""]):hover::before,
.spotlight-reaction-button[data-reaction-names]:not([data-reaction-names=""]):focus::before {
  border: 6px solid transparent;
  border-top-color: #101828;
  bottom: calc(100% - 3px);
  content: "";
  left: 50%;
  pointer-events: none;
  position: absolute;
  transform: translateX(-50%);
  z-index: 41;
}

.spotlight-reaction-emoji {
  font-size: 16px;
  line-height: 1;
}

.spotlight-reaction-add {
  align-items: center;
  aspect-ratio: 1;
  background: var(--app-success-surface);
  border: 1px solid var(--app-success-border);
  border-radius: 999px;
  box-sizing: border-box;
  color: var(--app-success-fg);
  cursor: pointer;
  display: inline-grid;
  font-size: 18px;
  font-weight: 700;
  height: 32px;
  justify-content: center;
  line-height: 1;
  max-height: 32px;
  max-width: 32px;
  min-height: 32px;
  min-width: 32px;
  /* Optical center: bold + glyphs sit slightly left; slight lift for visual balance. */
  padding: 0 0 1px 1px;
  place-items: center;
  text-align: center;
  width: 32px;
}

.spotlight-reaction-add:hover,
.spotlight-reaction-add:focus,
.spotlight-reaction-button:hover,
.spotlight-reaction-button:focus {
  background: var(--app-success-surface-hover);
  border-color: var(--app-success-border-strong);
  color: var(--app-success-fg-hover);
  outline: none;
}

.spotlight-reaction-button.is-active {
  background: #fff8e6;
  border-color: #d79a21;
  color: #7a4a00;
}

.spotlight-reaction-menu {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  box-shadow: 0 14px 32px rgba(16, 24, 40, 0.18);
  display: grid;
  gap: 4px;
  grid-template-columns: repeat(4, 34px);
  left: 0;
  padding: 8px;
  position: absolute;
  top: 38px;
  z-index: 120;
}

.spotlight-reaction-menu[hidden] {
  display: none;
}

.spotlight-reaction-menu button {
  align-items: center;
  background: #fff;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  display: inline-flex;
  font-size: 19px;
  height: 34px;
  justify-content: center;
  width: 34px;
}

.spotlight-reaction-menu button:hover,
.spotlight-reaction-menu button:focus {
  background: #f2f4f7;
  outline: none;
}

.spotlight-comments {
  border-top: 1px solid #e4e7ec;
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding-top: 14px;
}

.spotlight-comment {
  background: #f9fafb;
  border-radius: 8px;
  padding: 10px;
}

.spotlight-comment-header {
  align-items: flex-start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.spotlight-comment-actions {
  align-items: center;
  display: flex;
  gap: 6px;
}

.spotlight-comment-delete-form {
  margin: 0;
}

.spotlight-comment-edit-form {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.spotlight-comment-edit-form textarea {
  min-height: 76px;
  resize: vertical;
}

.spotlight-comment-edit-actions {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.spotlight-comment-form {
  grid-template-columns: minmax(0, 1fr) auto;
  margin-top: 12px;
}

@media (max-width: 900px) {
  .spotlight-page,
  .spotlight-stream-header,
  .spotlight-search,
  .spotlight-comment-form {
    grid-template-columns: 1fr;
  }
}

/* Placement grid: container width (grid-table-scroll) controls name column: photo + name vs photo only. */
.grid-name-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.grid-name-cell__text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  flex: 1;
}

.person-avatar--grid {
  width: 28px;
  height: 28px;
  min-width: 28px;
  flex-shrink: 0;
}

.person-avatar--team-task {
  height: 30px;
  min-width: 30px;
  width: 30px;
}

/* Board assignee: larger circular avatar (no topbar ring chrome) */
.person-avatar--board-card {
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  flex: 0 0 auto;
  flex-shrink: 0;
  font-size: 11px;
  height: 32px;
  min-width: 32px;
  overflow: hidden;
  width: 32px;
}

.person-avatar--board-card .person-avatar__img,
.person-avatar--board-card .person-avatar__initials {
  border-radius: 50%;
}

/* Layout wrapper only — size/clip live on .person-avatar--board-card */
.pm-board-card-assignee__avatar {
  align-items: center;
  align-self: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-shrink: 0;
  justify-content: center;
  pointer-events: none;
}

.pm-board-card-assignee__avatar .person-avatar,
.pm-board-card-assignee__avatar .person-avatar__initials {
  color: inherit;
  font-size: inherit;
}

/* KeshBoard selector pills: clear highlight for the active board */
.pm-keshboard-shared-break,
.keshboard-drawer__shared-break {
  flex-basis: 100%;
  height: 0;
}

.keshboard-drawer__board-picker button[data-keshboard-pick-board] {
  box-sizing: border-box;
  display: inline-flex !important;
  gap: 0 !important;
  justify-content: flex-start !important;
  max-width: min(280px, 100%);
  min-width: 0;
  overflow: hidden;
  text-overflow: clip;
  vertical-align: middle;
  white-space: nowrap;
}

.keshboard-drawer__picker-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.keshboard-drawer__picker-count {
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  opacity: 0.82;
}

.keshboard-drawer__picker-count::before {
  content: "\00a0|\00a0";
  font-weight: 800;
}

.keshboard-drawer__board-picker button.is-active .keshboard-drawer__picker-count {
  opacity: 0.95;
}

.pm-keshboard-page-picker__label--shared,
.keshboard-drawer__picker-label--shared,
.pm-manage-filter-option--section {
  color: var(--app-muted);
  font-size: 12px;
  font-weight: 800;
}

.pm-manage-filter-option--section {
  cursor: default;
  padding-top: 8px;
}

.pm-keshboard-page-create summary,
.keshboard-drawer__board-picker summary.keshboard-drawer__create-summary {
  background: #ecfdf3 !important;
  border-color: #abefc6 !important;
  box-sizing: border-box;
  color: #067647 !important;
}

.pm-keshboard-page-create summary:hover,
.keshboard-drawer__board-picker summary.keshboard-drawer__create-summary:hover {
  background: #dcfae6 !important;
  border-color: #75e0a7 !important;
}

/* Assignment filter + full-view (Home team board, Manage Assignments, employee assignment board) */
.pm-assignment-board-toolbar {
  align-items: center;
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  margin: 0 0 12px;
  padding: 12px;
}

.pm-assignment-summary-row > .js-pm-board-full-view {
  flex-shrink: 0;
}

body.pm-board-full-view-active .pm-assignment-summary-row > .js-pm-board-full-view {
  position: fixed;
  right: 20px;
  top: 16px;
  z-index: 9601;
}

.pm-assignment-board-toolbar__field {
  box-sizing: border-box;
  display: grid;
  flex: 1 1 160px;
  gap: 5px;
  min-width: 0;
}

.pm-assignment-board-toolbar__label {
  color: #344054;
  font-size: 12px;
  font-weight: 700;
}

.pm-assignment-board-toolbar__select {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  font: inherit;
  min-height: 38px;
  min-width: 120px;
  padding: 8px 10px;
  width: 100%;
}

body.pm-board-full-view-active,
body.indirect-rollup-full-view-active {
  --pm-board-full-view-pad-top: 56px;
  --pm-board-full-view-pad-right: 150px;
  overflow: hidden;
}

[data-pm-board-full-view-root].is-pm-board-full-view,
[data-indirect-rollup-card].is-indirect-rollup-full-view {
  background: #fff;
  border-radius: 0;
  box-shadow: none;
  box-sizing: border-box;
  inset: 0;
  margin: 0;
  max-height: 100vh;
  max-width: none;
  overflow: auto;
  padding: 16px 20px 24px;
  position: fixed;
  width: 100vw;
  z-index: 9500;
}

body.pm-board-full-view-active [data-pm-board-full-view-root].is-pm-board-full-view,
body.indirect-rollup-full-view-active [data-indirect-rollup-card].is-indirect-rollup-full-view {
  padding: var(--pm-board-full-view-pad-top) var(--pm-board-full-view-pad-right) 24px 20px;
}

[data-indirect-rollup-card].is-indirect-rollup-full-view .home-pm-rollup-table-wrap {
  flex: 1 1 auto;
  max-height: none;
  min-height: 0;
  overflow: auto;
}

body.indirect-rollup-full-view-active [data-indirect-rollup-card].is-indirect-rollup-full-view {
  display: flex;
  flex-direction: column;
  height: 100vh;
  height: 100dvh;
  inset: 0;
  margin: 0;
  max-height: none;
  overflow: hidden;
  padding: 0;
  position: fixed;
  width: 100vw;
  z-index: 9500;
}

[data-indirect-rollup-card].is-indirect-rollup-full-view .home-pm-detail-card__header,
[data-indirect-rollup-card].is-indirect-rollup-full-view .home-pm-rollup-controls {
  flex: 0 0 auto;
}

body.pm-board-full-view-active [data-pm-board-full-view-root].is-pm-board-full-view .pm-timeline-planner {
  margin-top: 0;
}

body.pm-board-full-view-active [data-pm-board-full-view-root].is-pm-board-full-view .pm-timeline-legend {
  margin-top: 0;
}

[data-pm-board-full-view-root].is-pm-board-full-view .pm-task-board-scroll,
[data-pm-board-full-view-root].is-pm-board-full-view .pm-task-board-wrap {
  max-width: none;
  width: 100%;
}

.pm-priority-mark {
  align-items: center;
  color: #475467;
  display: inline-flex;
  font-weight: 700;
  gap: 5px;
  max-width: 100%;
  min-width: 0;
}

.pm-priority-mark > span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-priority-mark__sign {
  align-items: center;
  background: color-mix(in srgb, currentColor 12%, transparent);
  border: 2px solid currentColor;
  border-radius: 999px;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 1000;
  height: 19px;
  justify-content: center;
  line-height: 1;
  -webkit-text-stroke: 0.35px currentColor;
  width: 19px;
}

.pm-priority-mark--critical {
  color: var(--app-action-danger);
}

.pm-priority-mark--high {
  color: #b54708;
}

.pm-priority-mark--medium {
  color: #175cd3;
}

.pm-priority-mark--low {
  color: #027a48;
}

.pm-priority-mark--critical .pm-priority-mark__sign {
  background: #fff1f0;
  border-color: #d92d20;
  color: #d92d20 !important;
  flex-direction: column;
  font-size: 0 !important;
  gap: 0;
  letter-spacing: 0;
  -webkit-text-stroke: 0;
}

.pm-priority-mark--critical .pm-priority-mark__sign::before {
  background: currentColor;
  border-radius: 1px;
  content: "";
  display: block;
  height: 7px;
  width: 2px;
}

.pm-priority-mark--critical .pm-priority-mark__sign::after {
  background: currentColor;
  border-radius: 999px;
  content: "";
  display: block;
  height: 2px;
  margin-top: 1px;
  width: 2px;
}

.pm-priority-mark--high .pm-priority-mark__sign {
  background: #fff7ed;
  border-color: #f79009;
  color: #b54708 !important;
  flex-direction: column;
  font-size: 0 !important;
  gap: 0;
  letter-spacing: 0;
  -webkit-text-stroke: 0;
}

.pm-priority-mark--high .pm-priority-mark__sign::before {
  border-bottom: 7px solid currentColor;
  border-left: 5.5px solid transparent;
  border-right: 5.5px solid transparent;
  content: "";
  display: block;
  height: 0;
  width: 0;
}

.pm-priority-mark--high .pm-priority-mark__sign::after {
  background: currentColor;
  border-radius: 1px;
  content: "";
  display: block;
  height: 5px;
  margin-top: -1px;
  width: 2.5px;
}

.pm-priority-mark--medium .pm-priority-mark__sign {
  background: #eff8ff;
  border-color: #2e90fa;
  color: #175cd3 !important;
  font-size: 0 !important;
  letter-spacing: 0;
  -webkit-text-stroke: 0;
}

.pm-priority-mark--medium .pm-priority-mark__sign::before {
  background: currentColor;
  border-radius: 999px;
  content: "";
  display: block;
  height: 2px;
  width: 11px;
}

.pm-priority-mark--low .pm-priority-mark__sign {
  background: #ecfdf3;
  border-color: #12b76a;
  color: #027a48 !important;
  flex-direction: column;
  font-size: 0 !important;
  gap: 0;
  letter-spacing: 0;
  -webkit-text-stroke: 0;
}

.pm-priority-mark--low .pm-priority-mark__sign::before {
  background: currentColor;
  border-radius: 1px;
  content: "";
  display: block;
  height: 5px;
  margin-bottom: -1px;
  width: 2.5px;
}

.pm-priority-mark--low .pm-priority-mark__sign::after {
  border-left: 5.5px solid transparent;
  border-right: 5.5px solid transparent;
  border-top: 7px solid currentColor;
  content: "";
  display: block;
  height: 0;
  width: 0;
}

.pm-priority-mark--none {
  color: #667085;
  font-weight: 600;
}

.pm-board-card-meta > span:first-child {
  color: #475467;
}

.pm-board-card-meta [data-task-card-priority],
.pm-board-card-meta [data-task-card-priority] .pm-priority-mark {
  opacity: 1;
}

.pm-board-card-meta [data-task-card-priority] .pm-priority-mark {
  border: 1px solid currentColor;
  border-radius: 999px;
  padding: 3px 7px 3px 4px;
}

.pm-board-card-meta [data-task-card-priority] .pm-priority-mark--critical {
  background: #fff1f0;
  border-color: #fda29b;
  color: var(--app-action-danger) !important;
}

.pm-board-card-meta [data-task-card-priority] .pm-priority-mark--high {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #b54708 !important;
}

.pm-board-card-meta [data-task-card-priority] .pm-priority-mark--medium {
  background: #eff8ff;
  border-color: #84caff;
  color: #175cd3 !important;
}

.pm-board-card-meta [data-task-card-priority] .pm-priority-mark--low {
  background: #ecfdf3;
  border-color: #abefc6;
  color: #027a48 !important;
}

.app-rounded-select.is-priority-select .app-rounded-select__label,
.app-rounded-select.is-priority-select .app-rounded-select__option {
  align-items: center;
  display: flex;
  gap: 0;
}

.app-rounded-select__label .pm-priority-mark,
.app-rounded-select__option .pm-priority-mark {
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
  line-height: 1.2;
}

.app-rounded-select__label .pm-priority-mark__sign,
.app-rounded-select__option .pm-priority-mark__sign {
  font-size: 11px;
  height: 18px;
  width: 18px;
}

.app-rounded-select.is-priority-select .app-rounded-select__button {
  color: #344054;
}

.app-rounded-select.is-priority-select .app-rounded-select__label {
  color: inherit;
}

.pm-timeline-legend {
  align-items: flex-start;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 0 0 12px;
  padding: 8px 10px;
}

.pm-timeline-legend__title {
  color: #344054;
  font-size: 12px;
  font-weight: 800;
  line-height: 22px;
  white-space: nowrap;
}

.pm-timeline-legend__items {
  align-items: center;
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  gap: 6px 12px;
  min-width: 220px;
}

.pm-timeline-legend__item {
  align-items: center;
  color: #475467;
  display: inline-flex;
  font-size: 12px;
  font-weight: 650;
  gap: 6px;
  line-height: 1.25;
}

.pm-timeline-legend__swatch {
  border: 1px solid currentColor;
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
  display: inline-block;
  height: 10px;
  width: 18px;
}

.grid-sticky-name {
  position: sticky;
  left: 0;
  z-index: 1;
  background: #fff;
  width: 200px;
  min-width: 180px;
  max-width: 240px;
  box-sizing: border-box;
  overflow: hidden;
  vertical-align: middle;
}

@container placements-grid (max-width: 560px) {
  .grid-placements-table th.grid-sticky-name,
  .grid-placements-table td.grid-sticky-name {
    width: 44px;
    min-width: 44px;
    max-width: 44px;
    padding-left: 6px;
    padding-right: 6px;
  }
  .grid-placements-table .grid-name-cell__text {
    display: none !important;
  }
  .grid-placements-table .grid-name-cell {
    justify-content: center;
  }
}

.grid-placements-table thead th.grid-sticky-name {
  top: 0;
  z-index: 4;
  background: #f6f7f9;
}

thead .grid-sticky-name {
  /* Corner: sticky left (horizontal scroll) + sticky top (vertical scroll) */
  z-index: 6;
  top: 0;
  left: 0;
  background: #f6f7f9;
}

.grid-sticky-name .grid-th-sort {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

/* Heatmap employee lists: always photo + name */
.heatmap-name-item {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 22px;
  min-width: 0;
}
.grid-draggable-person {
  cursor: grab;
  user-select: none;
}
.grid-draggable-person * {
  user-select: none;
  -webkit-user-drag: none;
}
.grid-draggable-person.is-dragging {
  opacity: 0.65;
  cursor: grabbing;
}
.heatmap-name-item__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  flex: 1;
}
.person-avatar--heatmap {
  width: 20px;
  height: 20px;
  min-width: 20px;
  flex-shrink: 0;
}
.heatmap-people-popover-sublist li.heatmap-popover-person {
  display: flex;
  align-items: center;
  gap: 8px;
}
.heatmap-popover-person__name {
  min-width: 0;
}

thead .grid-sticky-name .grid-th-sort {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.25;
  text-align: center;
}

.grid-recognition-count,
.grid-feedback-count {
  background: transparent;
  border: 0;
  color: var(--keshero-teal);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  padding: 4px 7px;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.grid-recognition-count:hover,
.grid-recognition-count:focus-visible,
.grid-feedback-count:hover,
.grid-feedback-count:focus-visible {
  background: #eff6ff;
  border-radius: 6px;
  outline: none;
}

.grid-recognition-modal[hidden] {
  display: none;
}

.grid-recognition-modal {
  align-items: center;
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 28px;
  position: fixed;
  z-index: 10020;
}

.grid-recognition-modal__backdrop {
  background: rgba(15, 23, 42, 0.62);
  inset: 0;
  position: absolute;
}

.grid-recognition-modal__dialog {
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 10px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
  max-height: min(82vh, 760px);
  max-width: min(760px, 92vw);
  overflow: auto;
  padding: 22px;
  position: relative;
  width: 100%;
  z-index: 1;
}

.grid-recognition-modal__dialog h3 {
  margin: 0 42px 16px 0;
}

/* ── Performance Rating methodology chooser + scoring/bonus payout ── */
.cycle-methodology-chooser {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
  margin: 8px 0 4px;
}
.cycle-methodology-choice {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 16px;
  border: 1px solid var(--border-color, #d9dce3);
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.cycle-methodology-choice:hover {
  border-color: var(--accent-color, #3b6cff);
}
.cycle-methodology-choice:has(input:checked) {
  border-color: var(--accent-color, #3b6cff);
  box-shadow: 0 0 0 2px rgba(59, 108, 255, 0.18);
}
.cycle-methodology-choice input {
  margin-top: 3px;
}
.cycle-methodology-choice__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cycle-methodology-choice__title {
  font-weight: 600;
  font-size: 15px;
}
.cycle-methodology-choice__desc {
  font-size: 12.5px;
  color: var(--muted-text, #667085);
  line-height: 1.45;
}
/* ── Stacked Ranking (Performance Scoring & Distribution) sections ── */ .scoring-subhead {
  font-weight: 600;
  font-size: 13px;
  margin: 14px 0 6px;
}
.scoring-inline-alert {
  padding: 10px 14px;
  border-radius: 8px;
  margin-bottom: 12px;
  font-size: 13px;
}
.scoring-inline-alert--warn {
  background: #fff6e6;
  border: 1px solid #f0c675;
  color: #7a5200;
}
.scoring-inline-alert ul {
  margin: 6px 0 0 18px;
}
.scoring-fields-table-wrap, .scoring-results-wrap {
  overflow-x: auto;
}
.scoring-fields-table, .scoring-results-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.scoring-fields-table-wrap,
.scoring-results-wrap {
  border: 1px solid var(--app-table-border, #dbe5ef);
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  overflow-x: auto;
}
.scoring-fields-table th, .scoring-fields-table td, .scoring-results-table th, .scoring-results-table td {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--app-table-border, #e6e8ee);
}
.scoring-fields-table th,
.scoring-results-table th {
  background: var(--app-table-header-bg, #f8fafc);
  color: var(--app-table-header-text, #344054);
  font-size: 12px;
  font-weight: 800;
}
/* Score fields use one centered table-header treatment, including Field Name. */
#scoringFieldsTable thead th {
  text-align: center;
}
.scoring-fields-table input {
  width: 100%;
  box-sizing: border-box;
}
.scoring-fields-table input[type="number"] {
  width: 90px;
}
/* A change-history wrapper must retain the table cell's full text-field width. */
.scoring-fields-table td > .app-change-field.is-changed:has(> input[type="text"]) {
  display: grid;
  min-width: 0;
  padding-left: 0;
  position: relative;
  width: auto;
  box-shadow: none;
}
.scoring-fields-table td > .app-change-field.is-changed:has(> input[type="text"]) > input[type="text"] {
  width: 100%;
}
.scoring-fields-table td > .app-change-field.is-changed:has(> input[type="text"])::before {
  background: #f59e0b;
  border-radius: 8px 0 0 8px;
  content: "";
  inset: 0 auto 0 0;
  pointer-events: none;
  position: absolute;
  width: 3px;
  z-index: 1;
}
.scoring-field-add, .scoring-category-add {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
}
.scoring-formula-subhead {
  margin-top: 20px;
  padding-top: 14px;
  border-top: 1px solid var(--app-table-border, #dbe5ef);
}
.scoring-formula-builder {
  padding: 12px;
  border: 1px solid var(--app-table-border, #dbe5ef);
  border-radius: 10px;
  background: #fbfdff;
}
.scoring-category-add .scoring-cat-total {
  margin-left: auto;
  text-align: right;
}
@media (max-width: 560px) {
  .scoring-category-add .scoring-cat-total {
    flex-basis: 100%;
    margin-left: 0;
    text-align: left;
  }
}
.scoring-field-add input[type="number"] {
  width: 90px;
}
.scoring-formula-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.scoring-chip {
  border: 1px solid var(--accent-color, #3b6cff);
  color: var(--accent-color, #3b6cff);
  background: transparent;
  border-radius: 999px;
  padding: 3px 12px;
  font-size: 12.5px;
  cursor: pointer;
}
.scoring-chip:hover {
  background: rgba(59, 108, 255, 0.1);
}
.scoring-operator-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.scoring-op-btn {
  min-width: 34px;
  padding: 4px 10px;
  border: 1px solid var(--border-color, #d9dce3);
  background: var(--subtle-bg, #f7f8fb);
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  color: #1f2933;
}
.scoring-op-btn:hover {
  border-color: var(--accent-color, #3b6cff);
}
.scoring-op-btn--clear {
  color: #b42318;
}
.scoring-formula-input {
  width: 100%;
  box-sizing: border-box;
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: 14px;
  padding: 8px 10px;
}
.scoring-formula-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
}
.scoring-formula-status {
  font-size: 12.5px;
}
.scoring-formula-status--ok {
  color: #087443;
}
.scoring-formula-status--err {
  color: #b42318;
}
.scoring-formula-range {
  font-size: 12.5px;
  color: var(--muted-text, #667085);
  margin-top: 6px;
}
.scoring-radio-list, .scoring-checkbox-grid {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.scoring-checkbox-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.scoring-radio-item, .scoring-checkbox-item {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 13px;
}
.scoring-inline-field {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  max-width: 320px;
  margin-top: 14px;
  box-sizing: border-box;
}
.scoring-sample-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.scoring-sample-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12.5px;
}
.scoring-tiebreaker-list {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1.35fr) minmax(15rem, 0.65fr);
  margin-top: 2px;
  width: 100%;
}
.scoring-tiebreaker-list--all-used { grid-template-columns: minmax(0, 1fr); }
.scoring-cat-total {
  font-size: 12.5px;
  font-weight: 600;
  max-width: min(100%, 42rem);
}
.scoring-cat-total--bad {
  color: #b42318;
}
.scoring-cat-total--ok {
  color: #087443;
}
.scoring-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.scoring-results-row--excluded {
  color: var(--muted-text, #98a2b3);
}
.scoring-excluded-tag {
  color: #b42318;
  font-weight: 600;
  cursor: help;
}
.scoring-cat-color {
  width: 44px;
  height: 28px;
  padding: 0;
  border: none;
  background: none;
}
.scoring-field-labels-row td {
  background: var(--subtle-bg, #f7f8fb);
  padding: 10px 12px;
}
.scoring-value-labels-grid {
  display: grid;
  /* Keep columns wide enough for [badge] [input] [No name] without crushing. */
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr));
  gap: 10px 14px;
}
.scoring-value-label-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  min-width: 0;
  font-size: 12.5px;
  background: #fff;
  border: 1px solid var(--border-color, #e6e8ee);
  border-radius: 8px;
  padding: 6px 10px 6px 6px;
}
.scoring-value-label-num {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 26px;
  padding: 0 6px;
  border-radius: 6px;
  font-weight: 700;
  color: var(--accent-color, #3b6cff);
  background: rgba(59, 108, 255, 0.1);
}
.scoring-value-label-item input {
  flex: 1 1 auto;
  min-width: 0;
  box-sizing: border-box;
  border: none;
  background: transparent;
  padding: 4px 2px;
  font-size: 12.5px;
}
.scoring-formula-editor {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  width: 100%;
  box-sizing: border-box;
  min-height: 38px;
  padding: 6px 10px;
  border: 1px solid var(--border-color, #d9dce3);
  border-radius: 6px;
  background: #fff;
  cursor: text;
}
.scoring-formula-editor:focus-within {
  border-color: var(--accent-color, #3b6cff);
  box-shadow: 0 0 0 2px rgba(59, 108, 255, 0.15);
}
.scoring-formula-change-state {
  position: relative;
  min-height: 0;
}
.scoring-formula-change-state.is-changed {
  box-shadow: none;
  padding-left: 0;
}
.scoring-formula-change-state.is-changed::before {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  border-radius: 8px 0 0 8px;
  background: #f59e0b;
  content: "";
  pointer-events: none;
}
.scoring-formula-change-tracker {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.scoring-formula-change-state.is-changed > .app-change-was {
  display: block;
  margin-top: 5px;
  padding-left: 8px;
  text-align: left;
}
.scoring-formula-tokens {
  display: contents;
}
.scoring-token {
  display: inline-flex;
  align-items: center;
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: 14px;
  line-height: 1.4;
}
.scoring-token--field {
  background: rgba(59, 108, 255, 0.1);
  color: var(--accent-color, #3b6cff);
  border: 1px solid rgba(59, 108, 255, 0.35);
  border-radius: 999px;
  padding: 1px 10px;
  font-weight: 600;
}
.scoring-token--field:hover {
  background: rgba(59, 108, 255, 0.18);
}
.scoring-token--missing {
  color: #b42318;
  background: rgba(180, 35, 24, 0.08);
  border-color: rgba(180, 35, 24, 0.35);
}
.scoring-token--op {
  color: #1f2933;
  font-weight: 700;
  padding: 0 2px;
}
.scoring-token--num {
  color: #1f2933;
}
.scoring-formula-number {
  flex: 1 1 4ch;
  min-width: 4ch;
  width: 4ch;
  border: none;
  outline: none;
  background: transparent;
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: 14px;
  line-height: 1.4;
  padding: 2px 0;
  caret-color: var(--accent-color, #3b6cff);
}
.scoring-formula-placeholder {
  color: var(--muted-text, #98a2b3);
  font-size: 14px;
  pointer-events: none;
}
.scoring-value-label-item input:focus {
  outline: none;
}
.scoring-value-label-item:focus-within {
  border-color: var(--accent-color, #3b6cff);
  box-shadow: 0 0 0 2px rgba(59, 108, 255, 0.15);
}
.scoring-fields-table .scoring-cat-range {
  width: 72px;
}
.scoring-fields-table .scoring-cat-bonus {
  width: 80px;
}
.scoring-formula-live__warn[hidden] {
  display: none;
}
.bonus-payout-multiplier-add input[type="text"] {
  min-width: 220px;
  flex: 1 1 220px;
}
.bonus-payout-panel.bonus-payout-panel--multipliers {
  background: linear-gradient(180deg, #f8fbff 0, #ffffff 88px);
  border-color: #cfe0f2;
}
.bonus-payout-panel--multipliers .bonus-payout-panel__header {
  border-bottom: 1px solid #e3edf7;
  padding-bottom: 10px;
}
#bonusPayoutMultipliersTable {
  table-layout: fixed;
}
#bonusPayoutMultipliersTable .bonus-payout-multiplier-col--percent {
  width: 128px;
}
#bonusPayoutMultipliersTable .bonus-payout-multiplier-col--action {
  width: 143px;
}
#bonusPayoutMultipliersTable :is(th, td):nth-child(2) {
  text-align: center;
}
#bonusPayoutMultipliersTable :is(th, td):nth-child(3) {
  text-align: right;
}
#bonusPayoutMultipliersTable tbody td:first-child {
  padding-right: 0;
}
#bonusPayoutMultipliersTable tbody td:first-child input[type="text"] {
  box-sizing: border-box;
  width: 100%;
}
.bonus-payout-multiplier-add {
  align-items: center;
  background: #f5f9fe;
  border: 1px dashed #b9cee5;
  border-radius: 10px;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: 10px;
  margin-top: 0;
  padding: 10px;
}
.bonus-payout-multiplier-add input[type="text"] {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}
.bonus-payout-new-percent {
  width: 108px;
}
#bonusPayoutNewMultiplierPercent {
  box-sizing: border-box;
  padding-right: 2px;
  width: 76px;
}
.bonus-payout-multiplier-add .button-add-small {
  min-height: 38px;
  white-space: nowrap;
}
@media (max-width: 760px) {
  .bonus-payout-multiplier-add {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .bonus-payout-multiplier-add input[type="text"] {
    grid-column: 1 / -1;
  }
}
.scoring-allow-negative {
  margin-top: 10px;
}
.bonus-payout-formula-hint {
  margin: 8px 0 0;
  color: #667085;
  font-size: 12.5px;
  line-height: 1.4;
}
.bonus-payout-preview-controls {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  display: grid;
  gap: 6px 10px;
  grid-template-columns: auto minmax(220px, 360px) minmax(260px, 1fr);
  margin-top: 10px;
  padding: 10px 12px;
}
.bonus-payout-preview-controls[hidden] {
  display: none;
}
.bonus-payout-preview-controls label {
  color: #344054;
  font-size: 12px;
  white-space: nowrap;
}
.bonus-payout-preview-controls select {
  min-height: 36px;
  width: 100%;
}
.bonus-payout-preview-controls span {
  color: #667085;
  font-size: 12px;
  line-height: 1.35;
}
.bonus-payout-budget-upload-label {
  font-weight: 800;
}
@media (max-width: 900px) {
  .bonus-payout-preview-controls {
    grid-template-columns: 1fr;
  }
}
.bonus-payout-formula-gap {
  width: 8px;
  min-width: 8px;
  height: 22px;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  cursor: text;
  border-radius: 3px;
}
.bonus-payout-formula-gap:hover, .bonus-payout-formula-gap:focus-visible {
  background: rgba(59, 108, 255, 0.18);
  outline: none;
}
.bonus-payout-formula-caret {
  width: 2px;
  align-self: stretch;
  min-height: 18px;
  background: var(--accent-color, #3b6cff);
  border-radius: 1px;
  margin: 0 -1px;
  pointer-events: none;
  opacity: 0;
  position: relative;
  z-index: 1;
}
.bonus-payout-formula-token {
  cursor: text;
}
button.bonus-payout-formula-token.scoring-token--field, button.bonus-payout-formula-token.scoring-token--num, button.bonus-payout-formula-token.scoring-token--op {
  font: inherit;
}
/* Show a blinking insertion caret only while the formula editor is focused. */ .scoring-formula-editor:focus-within .bonus-payout-formula-caret {
  animation: bonus-payout-caret-blink 1.1s step-end infinite;
}
0%, 100% {
  opacity: 1;
}
50% {
  opacity: 0;
}
.scoring-formula-editor:not(.is-empty) .scoring-formula-placeholder {
  display: none;
}
.scoring-formula-editor.is-empty:focus-within .scoring-formula-placeholder {
  opacity: 0.45;
}
.scoring-fields-table input {
  width: 100%;
}
.scoring-value-label-item > input[type="text"]:focus {
  outline: none;
}
.scoring-value-label-item:focus-within:not(.is-excluded) {
  border-color: var(--accent-color, #3b6cff);
  box-shadow: 0 0 0 2px rgba(59, 108, 255, 0.15);
}
.scoring-value-label-exclude {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  font-size: 11.5px;
  color: var(--muted-text, #667085);
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}
.scoring-value-label-exclude input {
  margin: 0;
  cursor: pointer;
}
.scoring-value-label-exclude input[type="checkbox"] {
  width: 14px;
  height: 14px;
  min-width: 14px;
  flex: 0 0 14px;
  margin: 0;
  cursor: pointer;
  accent-color: var(--accent-color, #3b6cff);
}
.scoring-value-label-item > input[type="text"] {
  flex: 1 1 auto;
  min-width: 0;
  box-sizing: border-box;
  border: none;
  background: transparent;
  padding: 4px 2px;
  font-size: 12.5px;
}
.scoring-value-label-item.is-excluded {
  background: #f2f4f7;
  border-color: #d0d5dd;
  opacity: 0.72;
}
.scoring-value-label-item.is-excluded .scoring-value-label-num {
  color: #98a2b3;
  background: #e4e7ec;
}
.scoring-value-label-item.is-excluded > input[type="text"] {
  color: #98a2b3;
  cursor: not-allowed;
}
.scoring-tie-mode {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 74rem;
}
.scoring-tie-mode .scoring-rank-option {
  height: 100%;
}
.scoring-tiebreakers {
  margin-top: 14px;
  padding: 14px;
  max-width: 74rem;
  background: #fff;
  border: 1px solid var(--border-color, #e4e7ec);
  border-radius: 12px;
}
.scoring-tiebreaker-group {
  background: #f8fbff;
  border: 1px solid #e4eef7;
  border-radius: 12px;
  min-width: 0;
  padding: 10px;
}
.scoring-tiebreaker-group--used {
  background: #f5faff;
  border-color: #c8ddf1;
}
.scoring-tiebreaker-group--available { background: #fbfcfe; }
.scoring-tiebreaker-group[hidden] { display: none; }
.scoring-tiebreaker-group__heading {
  color: #344054;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  margin: 0 0 8px;
  text-transform: uppercase;
}
.scoring-tiebreaker-group__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 48px;
}
.scoring-tiebreaker-group__empty {
  align-items: center;
  color: #667085;
  display: flex;
  font-size: 12px;
  min-height: 48px;
  padding: 0 8px;
}
.scoring-tiebreakers__intro {
  margin: 0 0 10px;
  max-width: 42rem;
}
.scoring-tiebreakers > .scoring-subhead {
  margin-top: 0;
}
.scoring-tiebreaker-row {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #e4eef7;
  border-radius: 10px;
  box-sizing: border-box;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 48px;
  padding: 7px 12px;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
  width: 100%;
}
.scoring-tiebreaker-row.is-selected,
.scoring-tiebreaker-row:has(.scoring-tiebreaker-check input:checked) {
  background: #fff;
  border-color: #b9d6f5;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}
.scoring-tiebreaker-row:hover {
  border-color: #b9d6f5;
}
.scoring-tiebreaker-check {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 10px;
  margin: 0;
  min-width: 0;
}

.box-target-cell__name-label {
  color: #667085;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 750;
}

.box-target-cell__name-row > .app-change-field.is-changed {
  align-self: stretch;
  flex: 1 1 auto;
  min-width: 0;
}

.box-target-cell__name-row > .app-change-field.is-changed > .admin-cycle-create-label-input {
  min-width: 0;
  width: 100%;
}
.scoring-tiebreaker-check input[type="checkbox"] {
  flex: 0 0 auto;
  margin: 0;
}
.scoring-tiebreaker-check__name {
  color: var(--text-color, #1f2933);
  font-weight: 700;
  line-height: 1.3;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.scoring-tiebreaker-priority {
  align-items: center;
  color: #344054;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 5px;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}
.scoring-tiebreaker-priority__label {
  color: #667085;
  font-size: 11px;
  font-weight: 750;
  line-height: 1;
}
.scoring-tiebreaker-priority__input {
  appearance: textfield;
  -moz-appearance: textfield;
  background: #fff;
  border: 1px solid #b9d6f5;
  border-radius: 7px;
  color: #155f99;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  height: 30px;
  min-height: 30px;
  min-width: 0;
  padding: 0 3px;
  text-align: center;
  width: 36px;
}
.scoring-tiebreaker-priority__input::-webkit-inner-spin-button,
.scoring-tiebreaker-priority__input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.scoring-tiebreaker-priority__controls {
  display: inline-flex;
  gap: 3px;
  height: 30px;
  margin: 0;
}
.scoring-tiebreaker-priority__step {
  align-items: center;
  appearance: none;
  background: #fff;
  border: 1px solid #d0ddeb;
  border-radius: 6px;
  color: #155f99;
  cursor: pointer;
  display: inline-flex;
  font-size: 9px;
  justify-content: center;
  line-height: 1;
  margin: 0;
  padding: 0;
  width: 25px;
}
.scoring-tiebreaker-priority__step:hover,
.scoring-tiebreaker-priority__step:focus-visible {
  background: #eaf4ff;
  border-color: #98c4ef;
  box-shadow: 0 0 0 2px rgba(29, 155, 240, 0.12);
  outline: none;
}
.scoring-tiebreaker-priority__step:active { background: #d8efff; }
.scoring-tiebreaker-priority__input:focus {
  border-color: #98c4ef;
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.14);
  outline: none;
}
.scoring-tiebreaker-priority__input:disabled {
  background: var(--subtle-bg, #f7f8fb);
  color: var(--muted-text, #98a2b3);
}
@media (max-width: 760px) {
  .scoring-tiebreaker-list { grid-template-columns: minmax(0, 1fr); }
  .scoring-tie-mode { grid-template-columns: minmax(0, 1fr); }
  .scoring-rank-basis--score { grid-template-columns: minmax(0, 1fr); }
}
.scoring-fields-table .scoring-cat-width-cell {
  color: var(--muted-text, #667085);
  font-variant-numeric: tabular-nums;
  vertical-align: middle;
  white-space: nowrap;
}
.scoring-fields-table .scoring-cat-width {
  align-items: center;
  background: var(--subtle-bg, #f7f8fb);
  border: 1px solid var(--border-color, #e4e7ec);
  border-radius: 8px;
  box-sizing: border-box;
  color: #344054;
  display: inline-flex;
  font-size: 13px;
  font-weight: 650;
  justify-content: center;
  letter-spacing: 0.01em;
  min-height: 34px;
  min-width: 3.75rem;
  padding: 4px 10px;
}
.scoring-radio-item {
  align-items: flex-start;
}
.scoring-checkbox-item {
  align-items: center;
  line-height: 1.3;
}
.scoring-checkbox-item input[type="checkbox"] {
  margin: 0;
  flex-shrink: 0;
}
.scoring-display-options {
  margin: 10px 0 4px;
}
.scoring-rank-basis {
  margin: 4px 0 10px;
}
.scoring-rank-basis--score {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.scoring-rank-basis--score .scoring-rank-option {
  height: 100%;
}
.scoring-rank-option {
  padding: 10px 12px;
  border: 1px solid var(--border-color, #e6e8ee);
  border-radius: 8px;
  background: var(--subtle-bg, #f7f8fb);
  cursor: pointer;
}
.scoring-rank-option:has(input:checked) {
  border-color: var(--accent-color, #3b6cff);
  background: rgba(59, 108, 255, 0.06);
}
.scoring-rank-option input[type="radio"] {
  margin-top: 2px;
  flex-shrink: 0;
}
.scoring-rank-option__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.scoring-rank-option__label {
  font-weight: 600;
  line-height: 1.3;
}
.scoring-rank-option__desc {
  color: var(--muted-text, #667085);
  font-size: 12.5px;
  line-height: 1.35;
}
.scoring-rank-option__example {
  color: var(--muted-text, #667085);
  font-size: 12px;
  line-height: 1.35;
  font-style: italic;
}
.scoring-rank-basis-notice {
  margin-top: 0;
  margin-bottom: 4px;
}
.scoring-cap-block {
  margin-top: 14px;
  padding-top: 4px;
}
.scoring-cap-block > .scoring-checkbox-item {
  margin-bottom: 4px;
}
.scoring-cap-limits {
  margin-top: 6px;
}
.scoring-formula-live.is-incomplete .scoring-formula-live__example, .scoring-formula-live.is-incomplete .scoring-formula-live__range {
  color: var(--muted-text, #98a2b3);
}
.scoring-formula-live__warn {
  margin-top: 2px;
  font-size: 12.5px;
  line-height: 1.4;
  color: #9a6700;
}
.scoring-comparison-example__sort-marker {
  font-size: 11px;
  color: var(--muted-text, #667085);
  min-width: 0.75em;
}
.scoring-comparison-fixed {
  margin-bottom: 4px;
}
.scoring-comparison-dynamic {
  margin-top: 14px;
  min-width: 0;
  max-width: 100%;
}
.scoring-comparison-picker {
  background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
  border: 1px solid #dbe7f3;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px 14px;
}
.scoring-comparison-picker:has(> .scoring-comparison-change-state.is-changed) {
  border-color: #fcd34d;
  box-shadow: inset 3px 0 0 #f59e0b, 0 1px 2px rgba(16, 24, 40, 0.04);
}
.scoring-comparison-change-state {
  display: contents;
}
.scoring-comparison-change-tracker {
  block-size: 1px;
  border: 0;
  clip-path: inset(50%);
  inline-size: 1px;
  margin: -1px;
  opacity: 0;
  overflow: hidden;
  padding: 0;
  pointer-events: none;
  position: absolute;
  white-space: nowrap;
}
.scoring-comparison-change-state.is-changed > .app-change-was {
  align-self: flex-start;
  background: #fff8e6;
  border: 1px solid #fcd34d;
  border-radius: 5px;
  margin: -2px 0 0;
  padding: 2px 6px;
}
.scoring-comparison-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-height: 0;
}
.scoring-comparison-chips:empty {
  display: none;
}
.scoring-comparison-chip {
  align-items: center;
  background: var(--ks-field-chip-bg, #eff6ff);
  border: 1px solid #b9d6f5;
  border-radius: 999px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  color: var(--ks-field-chip-text, #1849a9);
  display: inline-flex;
  gap: 6px;
  max-width: 100%;
  min-height: 32px;
  padding: 4px 6px 4px 12px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  position: relative;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.scoring-comparison-chip > input[type="checkbox"],
.scoring-comparison-chip > input[type="checkbox"][hidden] {
  border: 0 !important;
  clip: rect(0, 0, 0, 0);
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  overflow: hidden;
  padding: 0 !important;
  pointer-events: none;
  position: absolute;
  width: 0 !important;
}
.scoring-comparison-chip--unavailable {
  background: var(--subtle-bg, #f7f8fb);
  border-color: var(--border-color, #d0d5dd);
  box-shadow: none;
  color: #667085;
}
.scoring-comparison-chip__label {
  color: inherit;
  font-weight: 700;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.scoring-comparison-chip__hint {
  flex-shrink: 0;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(180, 84, 8, 0.1);
  color: #b54708;
  text-transform: uppercase;
}
.scoring-comparison-chip__remove {
  align-items: center;
  background: rgba(24, 73, 169, 0.08);
  border: 0;
  border-radius: 999px;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  flex-shrink: 0;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  height: 22px;
  justify-content: center;
  line-height: 1;
  margin-left: 1px;
  min-height: 22px;
  min-width: 22px;
  opacity: 0.85;
  padding: 0;
  width: 22px;
  transition: background 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}
.scoring-comparison-chip__remove:hover, .scoring-comparison-chip__remove:focus-visible {
  background: rgba(24, 73, 169, 0.16);
  color: #1d4ed8;
  opacity: 1;
  outline: none;
}
.scoring-comparison-add {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-width: 360px;
}
.scoring-comparison-add__label {
  font-size: 12px;
  font-weight: 800;
  color: #344054;
}
.scoring-comparison-add select {
  min-height: 38px;
  width: 100%;
}
/* Mirror Gender Groupings swatch-only color control (.settings-grouping-color-control / .app-color-preview-swatch). */ .scoring-fields-table .scoring-cat-color-control {
  align-items: center;
  display: inline-flex;
  gap: 10px;
  min-width: 0;
  width: auto;
}
.scoring-fields-table .scoring-cat-color {
  -webkit-appearance: none;
  appearance: none;
  background: #ffffff;
  border: 1px solid var(--app-border, #d0d5dd);
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
  cursor: pointer;
  flex: 0 0 38px;
  height: 38px;
  overflow: hidden;
  padding: 0;
  width: 38px;
}
.scoring-fields-table .scoring-cat-color::-webkit-color-swatch-wrapper {
  border: none;
  padding: 0;
}

.scoring-fields-table .scoring-cat-color::-webkit-color-swatch {
  border: none;
  border-radius: 5px;
  box-shadow: none;
  outline: none;
  transform: scale(1.12);
}

.scoring-fields-table .scoring-cat-color::-moz-color-swatch {
  border: none;
  border-radius: 5px;
  box-shadow: none;
}
.scoring-fields-table .scoring-cat-color:hover {
  border-color: #98a2b3;
}
.scoring-fields-table .scoring-cat-color:focus-visible {
  border-color: #1570ef;
  box-shadow: 0 0 0 4px rgba(21, 112, 239, 0.18);
  outline: none;
}
.cycle-edit-grid + .scoring-checkbox-item {
  margin-top: 16px;
}
.scoring-results-header {
  margin-bottom: 8px;
}
.scoring-results-header__title {
  margin-bottom: 0;
}
.scoring-fields-table .scoring-cat-width[data-empty="1"] {
  color: var(--muted-text, #98a2b3);
  font-weight: 600;
}
.scoring-formula-live {
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: 6px;
  background: var(--subtle-bg, #f7f8fb);
  border: 1px solid var(--border-color, #e4e7ec);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.scoring-formula-live__status {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.01em;
}
.scoring-formula-live__status::before {
  content: "";
  flex: 0 0 auto;
  width: 0.55em;
  height: 0.55em;
  border-radius: 50%;
  background: currentColor;
}
.scoring-formula-live__example, .scoring-formula-live__range, .scoring-formula-range {
  font-size: 12.5px;
  color: var(--muted-text, #667085);
  line-height: 1.4;
}
.scoring-formula-live__example {
  color: #344054;
  font-family: ui-monospace, Menlo, Consolas, monospace;
}
.scoring-formula-live.is-ready {
  background: rgba(8, 116, 67, 0.06);
  border-color: rgba(8, 116, 67, 0.35);
}
.scoring-formula-live.is-ready .scoring-formula-live__status {
  color: #087443;
}
.scoring-formula-live.is-ready .scoring-formula-live__example {
  color: #1f2933;
}
.scoring-formula-live.is-ready .scoring-formula-live__range {
  color: #475467;
}
.scoring-formula-live.is-incomplete {
  background: rgba(180, 35, 24, 0.06);
  border-color: rgba(180, 35, 24, 0.45);
}
.scoring-formula-live.is-incomplete .scoring-formula-live__status {
  color: #b42318;
}
.scoring-formula-live.is-incomplete .scoring-formula-live__example {
  color: #912018;
  font-weight: 600;
}
.scoring-formula-live.is-incomplete .scoring-formula-live__range {
  color: #b42318;
}
.scoring-distribution-population {
  margin: 14px 0;
}
.scoring-distribution-population > .cycle-edit-field {
  max-width: 28rem;
  margin-bottom: 0;
}
.scoring-distribution-population.is-disabled {
  opacity: 0.58;
}
.scoring-distribution-population.is-disabled select:disabled {
  background: var(--ks-field-disabled-bg, #f2f4f7);
  border-color: #e4e7ec;
  color: var(--ks-field-disabled-text, #98a2b3);
  cursor: not-allowed;
}
.scoring-distribution-population__example {
  margin: 6px 0 0;
  font-style: italic;
  line-height: 1.4;
}
.scoring-comparison-dynamic__intro {
  margin: 0 0 8px;
}
.scoring-comparison-chip--unavailable .scoring-comparison-chip__label {
  color: #667085;
}
.scoring-comparison-chip--unavailable .scoring-comparison-chip__hint {
  background: rgba(152, 162, 179, 0.18);
  color: #667085;
}
.scoring-comparison-chip[data-no-values="1"] .scoring-comparison-chip__hint {
  background: rgba(152, 162, 179, 0.22);
  color: #475467;
}
.scoring-comparison-chip--unavailable .scoring-comparison-chip__remove {
  color: #667085;
}
.scoring-comparison-chip--unavailable .scoring-comparison-chip__remove:hover, .scoring-comparison-chip--unavailable .scoring-comparison-chip__remove:focus-visible {
  background: rgba(102, 112, 133, 0.12);
  color: #344054;
}
.scoring-comparison-example-hint {
  margin: 10px 0 0;
}
.scoring-comparison-example {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--subtle-bg, #f7f8fb);
  border: 1px solid var(--border-color, #e4e7ec);
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.scoring-comparison-example[hidden], .scoring-comparison-example-hint[hidden] {
  display: none;
}
.scoring-comparison-example__title {
  font-size: 13px;
  font-weight: 700;
  color: #1f2933;
  line-height: 1.35;
}
.scoring-comparison-example__caption {
  margin: 2px 0 8px;
  font-size: 12px;
  color: var(--muted-text, #667085);
  line-height: 1.35;
}
.scoring-comparison-example__table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
  line-height: 1.35;
}
.scoring-comparison-example__table th, .scoring-comparison-example__table td {
  padding: 5px 8px;
  text-align: left;
  border-bottom: 1px solid var(--border-color, #e4e7ec);
  vertical-align: top;
  white-space: nowrap;
}
.scoring-comparison-example__table th {
  font-weight: 650;
  color: #475467;
  font-size: 11.5px;
  letter-spacing: 0.01em;
}
.scoring-comparison-example__table tbody tr:last-child td {
  border-bottom: 0;
}
.scoring-comparison-example__table td:first-child, .scoring-comparison-example__table th:first-child {
  width: 3.25em;
  font-variant-numeric: tabular-nums;
}
.scoring-comparison-example__table td:nth-child(3), .scoring-comparison-example__table th:nth-child(3) {
  width: 4.5em;
  font-variant-numeric: tabular-nums;
}
.scoring-results-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 4px 0 12px;
}
.scoring-inline-field .cycle-edit-field-hint {
  margin-top: 0;
  font-weight: 500;
}
#scoringRoundingExample {
  font-size: 13px;
}
.scoring-fields-table .scoring-cat-range.is-invalid {
  background: rgba(180, 35, 24, 0.06);
  border-color: var(--app-action-danger, #b42318);
  box-shadow: none;
}
.scoring-fields-table .scoring-cat-range.is-invalid:focus {
  border-color: var(--app-action-danger, #b42318);
  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.14);
  outline: none;
}
/* Let tokens participate in the editor flex row so the caret stays after the last token. */ .scoring-formula-tokens {
  display: contents;
}
/* Overlay placeholder so it does not push the caret to the right of the example text. */ .scoring-formula-placeholder {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  max-width: calc(100% - 20px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted-text, #98a2b3);
  font-size: 14px;
  line-height: 1.4;
  pointer-events: none;
  z-index: 0;
}
.scoring-formula-editor.is-empty .scoring-formula-number {
  position: relative;
  z-index: 1;
  color: transparent;
}
.scoring-formula-editor.is-empty .scoring-formula-number:focus {
  color: inherit;
}
.scoring-option-cards,
.scoring-comparison-fixed {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 4px;
}
.scoring-approach-options {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 4px 0 16px;
}
@media (max-width: 900px) {
  .scoring-option-cards,
  .scoring-comparison-fixed,
  .scoring-approach-options,
  .scoring-forced-assignment-options__choices {
    grid-template-columns: 1fr;
  }
}
.scoring-option-card, .scoring-comparison-fixed-item {
  align-items: flex-start;
  background: var(--subtle-bg, #f7f8fb);
  border: 1px solid var(--border-color, #e4e7ec);
  border-radius: 10px;
  cursor: pointer;
  min-height: 100%;
  padding: 12px 12px 12px 10px;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.scoring-option-card:hover, .scoring-comparison-fixed-item:hover {
  background: #fff;
  border-color: rgba(59, 108, 255, 0.35);
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}
.scoring-option-card input[type="checkbox"], .scoring-comparison-fixed-item input[type="checkbox"] {
  margin-top: 2px;
}
.scoring-option-card .scoring-checkbox-item__label, .scoring-comparison-fixed-item .scoring-checkbox-item__label {
  color: var(--text-color, #1f2933);
  font-weight: 600;
}
.scoring-option-card.scoring-checkbox-item--size-blocked, .scoring-comparison-fixed-item.scoring-checkbox-item--size-blocked {
  background: var(--subtle-bg, #f7f8fb);
  border-color: var(--border-color, #e4e7ec);
  box-shadow: none;
  cursor: default;
}
.scoring-option-card.scoring-checkbox-item--size-blocked:hover, .scoring-comparison-fixed-item.scoring-checkbox-item--size-blocked:hover {
  background: var(--subtle-bg, #f7f8fb);
  border-color: var(--border-color, #e4e7ec);
  box-shadow: none;
}
.scoring-checkbox-item__label {
  line-height: 1.3;
}
.scoring-checkbox-item__desc {
  color: var(--muted-text, #667085);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.35;
}
.scoring-checkbox-item__hint {
  color: var(--muted-text, #667085);
  font-size: 11.5px;
  font-weight: 500;
  line-height: 1.25;
}
.scoring-checkbox-item--size-blocked {
  align-items: flex-start;
  color: #98a2b3;
}
.scoring-checkbox-item--size-blocked input[type="checkbox"] {
  margin-top: 2px;
}
.scoring-checkbox-item--size-blocked .scoring-checkbox-item__label {
  color: #98a2b3;
}
.scoring-checkbox-item--size-blocked .scoring-checkbox-item__desc {
  color: #98a2b3;
}
.scoring-checkbox-item--size-blocked .scoring-checkbox-item__hint {
  color: #b54708;
}
.scoring-comparison-fixed-item {
  align-items: flex-start;
  background: var(--subtle-bg, #f7f8fb);
  border: 1px solid var(--border-color, #e4e7ec);
  border-radius: 10px;
  cursor: pointer;
  min-height: 100%;
  padding: 12px 12px 12px 10px;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.scoring-comparison-fixed-item:hover {
  background: #fff;
  border-color: rgba(59, 108, 255, 0.35);
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}
.scoring-comparison-fixed-item input[type="checkbox"] {
  margin-top: 2px;
}
.scoring-comparison-fixed-item .scoring-checkbox-item__label {
  color: var(--text-color, #1f2933);
  font-weight: 600;
}
.scoring-comparison-fixed-item.scoring-checkbox-item--size-blocked {
  background: var(--subtle-bg, #f7f8fb);
  border-color: var(--border-color, #e4e7ec);
  box-shadow: none;
  cursor: default;
}
.scoring-comparison-fixed-item.scoring-checkbox-item--size-blocked:hover {
  background: var(--subtle-bg, #f7f8fb);
  border-color: var(--border-color, #e4e7ec);
  box-shadow: none;
}
.scoring-inline-alert--info {
  background: #eff8ff; border: 1px solid #b2ddff; color: #026aa2;
}
.scoring-results-notice-extra {
  margin-top: 6px;
}
.scoring-comparison-example__toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
}
.scoring-comparison-example__filter {
  display: block;
  flex: 1 1 auto;
  max-width: 240px;
}
.scoring-comparison-example__filter input[type="search"] {
  width: 100%;
  min-height: 30px;
  box-sizing: border-box;
  padding: 4px 8px;
  border: 1px solid var(--border-color, #d0d5dd);
  border-radius: 6px;
  background: #fff;
  font-size: 12.5px;
  color: #1f2933;
}
.scoring-comparison-example__filter input[type="search"]:focus {
  outline: 2px solid rgba(37, 99, 235, 0.35);
  outline-offset: 1px;
}
.scoring-comparison-example__scroll {
  overflow-x: auto;
  width: 100%;
  -webkit-overflow-scrolling: touch;
}
.scoring-comparison-example__table tbody tr[hidden] {
  display: none;
}
.scoring-comparison-example__th--num, .scoring-comparison-example__td--num {
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.scoring-comparison-example__sort {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 650;
  letter-spacing: inherit;
  cursor: pointer;
  text-align: inherit;
}
.scoring-comparison-example__sort:hover, .scoring-comparison-example__sort:focus-visible {
  color: #1f2933;
}
.scoring-comparison-example__sort:focus-visible {
  outline: 2px solid rgba(37, 99, 235, 0.35);
  outline-offset: 2px;
  border-radius: 3px;
}
.scoring-comparison-example__empty {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--muted-text, #667085);
}
.scoring-comparison-example__empty[hidden] {
  display: none;
}
.scoring-comparison-example__th--num .scoring-comparison-example__sort {
  width: 100%;
  justify-content: flex-end;
}
.scoring-inline-field__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1.3;
}
.scoring-inline-field input {
  flex: 0 0 auto;
  width: 96px;
  max-width: 96px;
  min-height: 34px;
  padding: 6px 10px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.scoring-inline-field__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.scoring-inline-field__label {
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1.3;
  font-weight: 650;
  color: #344054;
}
.scoring-min-size-card {
  align-items: center;
  background: linear-gradient(135deg, #f0f9ff 0%, #f8fbff 72%, #eef6ff 100%);
  border: 1px solid #d6e7f7;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  display: flex;
  gap: 20px;
  justify-content: space-between;
  margin-top: 16px;
  max-width: 100%;
  padding: 14px 16px;
}
.scoring-min-size-card__copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.scoring-min-size-card__title {
  color: #101828;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1.3;
}
.scoring-min-size-card__copy p {
  color: #526277;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.45;
  margin: 0;
  max-width: 52rem;
}
.scoring-min-size-card__control {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 6px;
  min-width: 108px;
}
.scoring-min-size-card__control-label {
  color: #475467;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
}
.scoring-min-size-card__control input {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 8px;
  box-shadow: inset 0 1px 2px rgba(16, 24, 40, 0.04);
  color: #101828;
  font: inherit;
  font-size: 16px;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  min-height: 42px;
  padding: 8px 10px;
  text-align: center;
  width: 108px;
}
.scoring-min-size-card__control input:focus {
  border-color: var(--app-action-primary, #2ec5ff);
  box-shadow: 0 0 0 4px var(--app-focus-ring, rgba(29, 155, 240, 0.12));
  outline: none;
}
@media (max-width: 720px) {
  .scoring-min-size-card {
    align-items: stretch;
    flex-direction: column;
  }
  .scoring-min-size-card__control input {
    width: 100%;
  }
}
.scoring-distribution-mode {
  margin: 4px 0 14px;
}
.cycle-edit-field.is-disabled {
  opacity: 0.55;
}
.cycle-edit-field.is-disabled input:disabled {
  background: var(--ks-field-disabled-bg, #f2f4f7);
  border-color: #e4e7ec;
  color: var(--ks-field-disabled-text, #98a2b3);
  cursor: not-allowed;
}
.scoring-tiebreaker-priority[hidden] {
  display: none;
}
.scoring-checkbox-item__body {
  display: flex; flex-direction: column; gap: 4px; min-width: 0;
}

/* Checkbox change history belongs beneath the choice it describes. Keeping it
   out of the checkbox's inline row avoids splitting the control from its label. */
.scoring-cap-block > .scoring-checkbox-item.is-changed,
.scoring-comparison-fixed > .scoring-option-card.is-changed {
  align-items: start;
  column-gap: 7px;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  row-gap: 4px;
}

.scoring-cap-block > .scoring-checkbox-item.is-changed > input[type="checkbox"],
.scoring-comparison-fixed > .scoring-option-card.is-changed > input[type="checkbox"] {
  grid-column: 1;
  grid-row: 1;
  margin-top: 2px;
}

.scoring-cap-block > .scoring-checkbox-item.is-changed > :not(input):not(.app-change-was),
.scoring-comparison-fixed > .scoring-option-card.is-changed > :not(input):not(.app-change-was) {
  grid-column: 2;
  grid-row: 1;
}

.scoring-cap-block > .scoring-checkbox-item.is-changed > .app-change-was,
.scoring-comparison-fixed > .scoring-option-card.is-changed > .app-change-was {
  align-items: center;
  background: #fff8e6;
  border: 1px solid #fcd34d;
  border-radius: 999px;
  color: #92400e;
  display: inline-flex;
  font-size: 10.5px;
  grid-column: 2;
  grid-row: 2;
  justify-self: start;
  line-height: 1.25;
  margin: 0;
  min-height: 0;
  padding: 2px 6px;
}

.scoring-option-card__body {
  display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
.scoring-approach-options .scoring-option-card,
.scoring-forced-assignment-options .scoring-option-card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
}
.scoring-option-card__choice {
  align-items: center;
  display: flex;
  gap: 8px;
  min-width: 0;
}
.scoring-approach-options .scoring-option-card input[type="radio"],
.scoring-forced-assignment-options .scoring-option-card input[type="radio"] {
  appearance: none;
  background: var(--app-checkbox-bg, #ffffff);
  border: 1.5px solid var(--app-checkbox-border, #d0d5dd);
  border-radius: 50%;
  box-sizing: border-box;
  cursor: pointer;
  flex-shrink: 0;
  height: 18px;
  margin: 0;
  width: 18px;
  -webkit-appearance: none;
}
.scoring-approach-options .scoring-option-card input[type="radio"]:checked,
.scoring-forced-assignment-options .scoring-option-card input[type="radio"]:checked {
  background-color: var(--app-checkbox-checked-bg, #12b76a);
  background-image: var(--app-checkbox-mark-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--app-checkbox-mark-size, 11px) var(--app-checkbox-mark-size, 11px);
  border-color: var(--app-checkbox-checked-border, #039855);
}
.scoring-approach-options .scoring-option-card input[type="radio"]:focus-visible,
.scoring-forced-assignment-options .scoring-option-card input[type="radio"]:focus-visible {
  box-shadow: 0 0 0 3px var(--app-focus-ring, rgba(46, 197, 255, 0.32));
  outline: none;
}
.scoring-approach-options .scoring-option-card__body,
.scoring-forced-assignment-options .scoring-option-card__body {
  padding-left: 26px;
}
.scoring-approach-options .scoring-option-card.is-changed > .app-change-was {
  align-self: flex-start;
  background: #fff8e6;
  border: 1px solid #fcd34d;
  border-radius: 999px;
  color: #92400e;
  font-size: 10.5px;
  line-height: 1.25;
  margin: 4px 0 0 26px;
  min-height: 0;
  padding: 2px 6px;
}
.scoring-forced-assignment-options .scoring-option-card.is-changed > .app-change-was {
  align-self: flex-start;
  background: #fff8e6;
  border: 1px solid #fcd34d;
  border-radius: 999px;
  color: #92400e;
  font-size: 10.5px;
  line-height: 1.25;
  margin: 4px 0 0 26px;
  min-height: 0;
  padding: 2px 6px;
}
.scoring-option-card__eyebrow {
  color: #000;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
}
.scoring-option-card:has(input:checked) {
  background: #fff; border-color: var(--accent-color, #3b6cff); box-shadow: 0 0 0 2px rgba(59, 108, 255, 0.16);
}
/* Keep a changed approach's amber history cue alongside its blue selected state. */
.scoring-approach-options .scoring-option-card.is-changed:has(input:checked) {
  box-shadow: inset 3px 0 0 #f59e0b, 0 0 0 2px rgba(59, 108, 255, 0.16);
}
.scoring-forced-assignment-options .scoring-option-card.is-changed:has(input:checked) {
  box-shadow: inset 3px 0 0 #f59e0b, 0 0 0 2px rgba(59, 108, 255, 0.16);
}
.pm-cycle-edit-form #scoringCategoriesTable thead th {
  text-align: left !important;
}
.pm-cycle-edit-form #scoringFieldsTable thead th {
  text-align: center !important;
}
.bonus-payout-snapshot-form {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr) auto;
  margin: 0;
  width: 100%;
}
.bonus-payout-review-wrap {
  height: 320px; overflow: auto; max-width: 100%;
}
.bonus-payout-review-table thead th {
  background: var(--app-table-header-bg, #f8fafc);
  background-clip: padding-box;
  box-shadow: 0 1px 0 var(--app-table-border, #dbe5ef);
  position: sticky;
  top: 0;
  z-index: 2;
}
.bonus-payout-review-sort {
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: inherit;
  gap: 4px;
  margin: 0;
  padding: 0;
  text-align: inherit;
}
.bonus-payout-review-sort:hover {
  color: #1f2933;
}
.bonus-payout-review-sort:focus-visible {
  border-radius: 3px;
  outline: 2px solid rgba(37, 99, 235, 0.35);
  outline-offset: 2px;
}
.bonus-payout-review-sort__ind {
  color: #667085;
  font-size: 0.95em;
  font-weight: 800;
  line-height: 1;
}
.bonus-payout-snapshot-status-pill--missing {
  background: #fef3f2; color: #b42318; border-radius: 999px; font-size: 11px; font-weight: 700; padding: 2px 8px;
}
.bonus-payout-snapshot-status-pill--ok {
  background: #ecfdf3; color: #067647; border-radius: 999px; font-size: 11px; font-weight: 700; padding: 2px 8px;
}
.bonus-payout-budget-form {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr) auto;
  margin: 0;
  width: 100%;
}
.bonus-payout-budget-form--file-fields {
  grid-template-columns: minmax(0, 1fr) auto;
}
.bonus-payout-budget-file-field {
  grid-column: 1 / -1;
}
.bonus-payout-breakout-fields {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.bonus-payout-breakout-fields__header {
  align-items: end;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}
.bonus-payout-breakout-fields__header > div {
  display: grid;
  gap: 2px;
}
.bonus-payout-breakout-fields__header strong {
  color: #101828;
  font-size: 12px;
  font-weight: 800;
}
.bonus-payout-breakout-fields__header span {
  color: #667085;
  font-size: 11px;
}
.bonus-payout-breakout-fields__table-wrap {
  max-height: 235px;
  overflow: auto;
}
.bonus-payout-breakout-fields__table {
  min-width: 430px;
  width: 100%;
}
.bonus-payout-breakout-fields__table th:first-child,
.bonus-payout-breakout-fields__table td:first-child {
  text-align: center;
  width: 44px;
}
.bonus-payout-breakout-fields__table th:last-child,
.bonus-payout-breakout-fields__table td:last-child {
  text-align: center;
  width: 92px;
}
.bonus-payout-breakout-fields__table select {
  width: 100%;
}
.bonus-payout-budget-methods {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(260px, 0.42fr) auto minmax(520px, 1fr);
  width: 100%;
}
.bonus-payout-budget-method {
  background: #f8fbff;
  border: 1px solid #dbe7f3;
  border-radius: 10px;
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px;
}
.bonus-payout-budget-method--manual {
  align-content: start;
}
.bonus-payout-budget-method__header {
  display: grid;
  gap: 3px;
}
.bonus-payout-budget-method__header strong {
  color: #101828;
  font-size: 13px;
  font-weight: 800;
}
.bonus-payout-budget-method__header span,
.bonus-payout-budget-help {
  color: #667085;
  font-size: 11px;
  line-height: 1.4;
}
.bonus-payout-budget-help {
  display: block;
  margin-top: 5px;
}
.bonus-payout-budget-rollup-tag {
  background: #eaf4ff;
  border: 1px solid #b8d7f5;
  border-radius: 999px;
  color: #075985;
  display: inline-flex;
  font-size: 10px;
  font-weight: 800;
  margin-left: 6px;
  padding: 2px 7px;
  vertical-align: middle;
}
.bonus-payout-budget-rollup-tag[hidden] {
  display: none;
}
.bonus-payout-budget-or {
  align-items: center;
  color: #667085;
  display: flex;
  font-size: 11px;
  font-weight: 800;
  justify-content: center;
  position: relative;
  text-transform: uppercase;
}
.bonus-payout-budget-or span {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 999px;
  padding: 6px;
}
.bonus-payout-enable-row {
  grid-template-columns: minmax(0, 1fr);
  margin: 0 0 4px;
  max-width: none;
}
.bonus-payout-enable-row .scoring-option-card {
  align-items: stretch;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.bonus-payout-enable-row .scoring-option-card__body {
  padding-left: 26px;
}
#bonusPayoutSnapshotFileLabel {
  font-weight: 800;
}
.bonus-payout-file-picker {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: 0;
  width: 100%;
}
.bonus-payout-file-picker > input[type="file"] {
  flex: 1 1 260px;
  min-width: 0;
  width: auto;
}
.bonus-payout-snapshot-actions {
  align-items: center;
  align-self: end;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-bottom: 9px;
}
.bonus-payout-body {
  display: grid;
  gap: 16px;
  width: 100%;
}
.bonus-payout-body[hidden],
#bonusPayoutSection[data-bonus-payout-enabled="0"] .bonus-payout-body {
  display: none !important;
}
.bonus-payout-panel {
  background: #fff;
  border: 1px solid #dbe7f3;
  border-radius: 12px;
  box-sizing: border-box;
  display: grid;
  gap: 12px;
  padding: 14px;
  width: 100%;
}
.bonus-payout-panel__header {
  display: grid;
  gap: 4px;
  width: 100%;
}
.bonus-payout-panel__header strong {
  color: #101828;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
}
.bonus-payout-panel__header span,
.bonus-payout-panel .cycle-edit-card__hint {
  color: #526277;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
  max-width: none;
  width: 100%;
}
.bonus-payout-empty {
  background: #f8fbff;
  border: 1px dashed #d6e7f7;
  border-radius: 10px;
  color: #667085;
  margin: 0;
  padding: 14px;
}
.bonus-payout-snapshot-status {
  background: #f8fbff;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  color: #475467;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
  padding: 10px 12px;
  width: 100%;
}
.bonus-payout-file-current {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  display: flex;
  flex: 0 1 auto;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: 0;
  padding: 8px 10px;
}
.bonus-payout-file-current__name {
  color: #344054;
  font-weight: 700;
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bonus-payout-file-current__actions {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  gap: 6px;
}
.bonus-payout-file-replacement-label {
  color: #475467;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
@media (max-width: 760px) {
  .bonus-payout-file-picker {
    align-items: stretch;
    flex-wrap: wrap;
  }
  .bonus-payout-file-picker > input[type="file"] {
    flex-basis: 100%;
  }
}
.bonus-payout-review-toolbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
}
.bonus-payout-review-toolbar__summary {
  color: #475467;
  font-size: 13px;
}
.bonus-payout-review-toolbar__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bonus-payout-review-search input[type="search"] {
  min-width: 220px;
}
.bonus-payout-estimate-settings {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.bonus-payout-estimate-settings > .cycle-edit-field {
  align-self: start;
}
.bonus-payout-estimate-settings__check,
.bonus-payout-estimate-settings__wide {
  grid-column: 1 / -1;
}
.bonus-payout-estimate-settings__check {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  padding: 10px 12px;
}
.bonus-payout-estimate-settings__check[hidden] {
  display: none;
}
.bonus-payout-panel__title-with-help {
  align-items: center;
  display: inline-flex;
  gap: 6px;
}
.bonus-payout-proration-guide {
  background: #f4f8ff;
  border: 1px solid #cfe0f5;
  border-radius: 10px;
  color: #344054;
  display: grid;
  gap: 5px;
  padding: 11px 12px;
}
.bonus-payout-proration-guide > strong {
  color: #123a63;
  font-size: 12px;
}
.bonus-payout-proration-guide > span {
  font-size: 11px;
  line-height: 1.4;
}
.bonus-payout-panel--eligibility {
  background: linear-gradient(180deg, #f7f9ff 0, #fff 112px);
  border-color: #cdd8f7;
}
.bonus-payout-eligibility-priority {
  align-items: center;
  background: #eef3ff;
  border: 1px solid #cbd7f6;
  border-radius: 9px;
  color: #344054;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-bottom: 12px;
  padding: 9px 12px;
}
.bonus-payout-eligibility-priority strong {
  color: #274690;
  font-size: 12px;
}
.bonus-payout-eligibility-priority span {
  font-size: 12px;
}
.bonus-payout-eligibility-fields {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(260px, 1.35fr) repeat(2, minmax(210px, 1fr));
}
.bonus-payout-eligibility-fields .cycle-edit-field small {
  color: #667085;
  font-size: 11px;
  line-height: 1.35;
}
.bonus-payout-eligibility-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}
.bonus-payout-eligibility-preview__item {
  background: #f2f4f7;
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  color: #475467;
  font-size: 11px;
  padding: 5px 9px;
}
.bonus-payout-eligibility-preview__item.is-yes { background: #ecfdf3; border-color: #abefc6; color: #067647; }
.bonus-payout-eligibility-preview__item.is-no { background: #fef3f2; border-color: #fecdca; color: #b42318; }
.bonus-payout-eligibility-preview__item.is-unrecognized { background: #fffaeb; border-color: #fedf89; color: #b54708; }
.bonus-payout-eligibility-preview__item.is-automatic { background: #f4f3ff; border-color: #d9d6fe; color: #5925dc; }
.bonus-payout-eligibility-edit-toggle {
  margin-top: 0;
}
.bonus-payout-eligibility-cell {
  min-width: 240px;
}
.bonus-payout-eligibility-cell select {
  display: inline-block;
  min-width: 76px;
  width: auto;
}
.bonus-payout-eligibility-cell small {
  color: #667085;
  display: block;
  font-size: 10px;
  margin-top: 4px;
}
.bonus-payout-eligibility-reset {
  margin-left: 5px;
  white-space: nowrap;
}
.bonus-payout-eligibility-reset[hidden] {
  display: none !important;
}
.bonus-payout-eligibility-locked {
  background: #f4f3ff;
  border: 1px solid #d9d6fe;
  border-radius: 999px;
  color: #5925dc;
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 4px 8px;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .bonus-payout-eligibility-fields { grid-template-columns: 1fr; }
}
.bonus-payout-currency-picker {
  align-content: start;
  display: grid;
  grid-template-rows: auto 38px auto;
  margin-bottom: 4px;
  min-width: 0;
  position: relative;
}
.bonus-payout-currency-picker > label {
  color: #344054;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
}
.bonus-payout-currency-picker__control {
  align-self: start;
  height: 38px;
  position: relative;
}
.bonus-payout-currency-picker__control > input {
  box-sizing: border-box;
  height: 38px;
  padding-right: 38px;
  width: 100%;
}
.bonus-payout-currency-picker__toggle {
  align-items: center;
  background: transparent;
  border: 0;
  border-left: 1px solid #e4e7ec;
  border-radius: 0 8px 8px 0;
  bottom: 1px;
  color: #667085;
  cursor: pointer;
  display: inline-flex;
  font-size: 18px;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: 1px;
  top: 1px;
  width: 34px;
}
.bonus-payout-currency-picker__toggle:hover,
.bonus-payout-currency-picker__toggle:focus-visible {
  background: #f2f4f7;
  color: #344054;
  outline: none;
}
.bonus-payout-currency-picker__toggle .app-rounded-select__chevron {
  left: 50% !important;
  right: auto !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
}
.bonus-payout-currency-picker__toggle[aria-expanded="true"] .app-rounded-select__chevron {
  transform: translate(-50%, -50%) rotate(180deg) !important;
}
.bonus-payout-currency-picker__list {
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.16);
  left: 0;
  margin-top: 5px;
  max-height: 280px;
  overflow: auto;
  padding: 5px;
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 80;
}
.bonus-payout-currency-picker__list[hidden] {
  display: none;
}
.bonus-payout-currency-picker__option {
  align-items: center;
  background: #fff;
  border: 0;
  border-radius: 7px;
  color: #344054;
  cursor: pointer;
  display: flex;
  font: inherit;
  gap: 10px;
  justify-content: space-between;
  min-height: 36px;
  padding: 8px 9px;
  text-align: left;
  width: 100%;
}
.bonus-payout-currency-picker__option:hover,
.bonus-payout-currency-picker__option.is-active {
  background: #eff6ff;
  color: #175cd3;
}
.bonus-payout-currency-picker__country {
  font-size: 12px;
  font-weight: 650;
  min-width: 0;
}
.bonus-payout-currency-picker__code {
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  color: #4338ca;
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  padding: 3px 7px;
}
.bonus-payout-currency-picker__empty {
  color: #667085;
  font-size: 12px;
  padding: 10px;
  text-align: center;
}
.bonus-payout-currency-picker__hint {
  color: #7a8799;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.3;
  margin-top: -3px;
}
.bonus-payout-fx-toggle {
  margin-top: 14px;
  width: 100%;
}
#bonusPayoutEstimateSettings {
  padding-bottom: 20px;
}
.bonus-payout-fx-toggle__note {
  color: #31506f;
  font-size: 11px;
  line-height: 1.45;
}
.bonus-payout-fx-toggle__note strong {
  color: #0b4f7a;
}
.bonus-payout-fx {
  background: #f8fbff;
  border: 1px solid #d8e6f5;
  border-radius: 12px;
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding: 14px;
}
.bonus-payout-fx[hidden] {
  display: none;
}
.bonus-payout-fx__header {
  align-items: flex-start;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}
.bonus-payout-fx__header > div {
  display: grid;
  gap: 3px;
}
.bonus-payout-fx__header strong {
  color: #101828;
  font-size: 14px;
  font-weight: 800;
}
.bonus-payout-fx__header span,
.bonus-payout-fx__empty {
  color: #526277;
  font-size: 12px;
  line-height: 1.45;
}
.bonus-payout-fx__source {
  background: #eaf4ff;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  color: #175cd3 !important;
  flex: 0 0 auto;
  font-weight: 700;
  padding: 5px 9px;
}
.bonus-payout-fx__controls {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(210px, 1.2fr) minmax(150px, 0.7fr) minmax(170px, 0.8fr) auto auto;
}
.bonus-payout-fx__controls button {
  min-height: 38px;
  white-space: nowrap;
}
.bonus-payout-fx__rates {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.bonus-payout-fx-rate {
  align-items: center;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  min-width: 0;
  padding: 9px 10px;
}
.bonus-payout-fx-rate.is-ready {
  background: #ecfdf3;
  border-color: #abefc6;
  box-shadow: none;
}
.bonus-payout-fx-rate.is-missing {
  background: #fffaf5;
  border-color: #fedf89;
  box-shadow: inset 3px 0 0 #f79009;
}
.bonus-payout-fx-rate strong {
  color: #344054;
  font-size: 12px;
}
.bonus-payout-fx-rate span {
  color: #667085;
  flex: 1 1 auto;
  font-size: 11px;
}
.bonus-payout-fx-rate__remove {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 50%;
  color: #667085;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 24px;
  font-size: 18px;
  height: 24px;
  justify-content: center;
  padding: 0;
  width: 24px;
}
.bonus-payout-fx-rate__remove:hover {
  background: #fee4e2;
  color: #b42318;
}
.bonus-payout-formula-result-line {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}
.bonus-payout-formula-result-line + .bonus-payout-formula-result-line {
  border-top: 1px solid #d0d5dd;
  margin-top: 7px;
  padding-top: 7px;
}
.bonus-payout-formula-result-line span {
  color: #526277;
  font-size: 12px;
}
.bonus-payout-formula-result-line--rate {
  background: #f5f8ff;
  border-radius: 7px;
  padding: 7px 9px;
}
.bonus-payout-formula-result-line--rate strong {
  color: #475467;
  font-size: 12px;
}
.bonus-payout-formula-result-line--primary strong {
  color: #175cd3;
}
.estimated-payout-impact__currency-breakdown {
  margin: 16px 0;
}
.estimated-payout-impact__section-heading {
  background: #f0f9ff;
  border: 1px solid #b9e6fe;
  border-radius: 10px 10px 0 0;
  padding: 11px 13px;
}
.estimated-payout-impact__section-heading > div {
  display: grid;
  gap: 3px;
}
.estimated-payout-impact__section-heading span {
  color: #475467;
  font-size: 12px;
}
.estimated-payout-impact__currency-breakdown .estimated-payout-impact__table-wrap {
  margin-top: 0;
}
.estimated-payout-impact__currency-breakdown tfoot th {
  background: #f8fafc;
  border-top: 2px solid #98a2b3;
}
@media (max-width: 900px) {
  .bonus-payout-fx__controls {
    grid-template-columns: 1fr 1fr;
  }
  .bonus-payout-fx__header {
    display: grid;
  }
  .bonus-payout-fx__source {
    justify-self: start;
  }
}
@media (max-width: 560px) {
  .bonus-payout-fx__controls {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 980px) {
  .bonus-payout-snapshot-form,
  .bonus-payout-budget-form {
    grid-template-columns: 1fr;
  }
  .bonus-payout-budget-form--file-fields {
    grid-template-columns: 1fr;
  }
  .bonus-payout-budget-methods {
    grid-template-columns: 1fr;
  }
  .bonus-payout-budget-or {
    min-height: 18px;
  }
}
.scoring-approach-distribution {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  width: 100%;
}
.scoring-approach-distribution__header {
  display: grid;
  gap: 4px;
  width: 100%;
}
.scoring-approach-distribution__header strong {
  color: #101828;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
}
.scoring-approach-distribution__header span {
  color: #526277;
  font-size: 13px;
  line-height: 1.45;
}
.scoring-approach-distribution .cycle-edit-card__hint {
  margin: 0;
  max-width: none;
  width: 100%;
}
.scoring-forced-assignment-options {
  background: #fff;
  border: 1px solid #dbe7f3;
  border-radius: 12px;
  box-sizing: border-box;
  display: grid;
  gap: 12px;
  padding: 14px;
  width: 100%;
}
.scoring-forced-assignment-options__heading {
  display: grid;
  gap: 4px;
}
.scoring-forced-assignment-options__title {
  color: #101828;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
  margin: 0;
}
.scoring-forced-assignment-options__heading p {
  color: #526277;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
  max-width: none;
}
.scoring-forced-assignment-options__choices {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}
.scoring-forced-assignment-options .scoring-distribution-mode {
  margin: 0;
}
.scoring-distribution-population__title {
  font-size: 13px; font-weight: 700;
}
.scoring-cat-range.is-invalid {
  border-color: #b42318;
}


.grid-feedback-modal__dialog {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-height: min(82vh, 680px);
  max-width: min(720px, 94vw);
  overflow: hidden;
  padding: 0;
}
.grid-feedback-modal__dialog > .grid-recognition-modal__header {
  align-items: flex-start;
  flex: 0 0 auto;
}
.grid-feedback-modal__heading {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.grid-feedback-modal__heading h3 {
  margin: 0;
}
.grid-feedback-modal__period {
  color: #475467;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  margin: 0;
}
.grid-feedback-modal__period[hidden] {
  display: none !important;
}
.grid-feedback-modal__dialog > .grid-recognition-modal__body {
  display: grid;
  flex: 1 1 auto;
  gap: 14px;
  min-height: 0;
  overflow: auto;
  padding: 16px 18px 18px;
  -webkit-overflow-scrolling: touch;
}
.grid-feedback-section-title {
  color: #344054;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  margin: 4px 0 0;
  text-transform: uppercase;
}
.grid-feedback-summary-card {
  gap: 10px;
  padding: 12px 14px;
}
.grid-feedback-total {
  color: #101828;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.3;
}
.grid-feedback-total__meta {
  color: #667085;
  font-size: 13px;
  font-weight: 600;
  margin-top: 2px;
}
.grid-feedback-bars {
  display: grid;
  gap: 8px;
}
.grid-feedback-bar-row {
  display: grid;
  gap: 4px;
}
.grid-feedback-bar-label {
  color: #475467;
  font-size: 12px;
  font-weight: 700;
}
.grid-feedback-bar-track {
  background: #e4e7ec;
  border-radius: 999px;
  height: 10px;
  overflow: hidden;
}
.grid-feedback-bar-track span {
  background: linear-gradient(90deg, var(--keshero-teal), var(--keshero-green));
  display: block;
  height: 100%;
}
.grid-feedback-comment-list {
  display: grid;
  gap: 12px;
}
.grid-feedback-comment-card {
  background: #fff;
  gap: 0;
  overflow: hidden;
  padding: 0;
}
.grid-feedback-comment-card__head {
  align-items: center;
  background: color-mix(in srgb, #0891b2 12%, #ffffff);
  border-bottom: 1px solid color-mix(in srgb, #0891b2 22%, #e2e8f0);
  display: flex;
  gap: 10px;
  padding: 10px 12px;
}
.grid-feedback-comment-card__index {
  align-items: center;
  background: #0891b2;
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 800;
  height: 22px;
  justify-content: center;
  letter-spacing: 0.02em;
  min-width: 22px;
  padding: 0 7px;
}
.grid-feedback-comment-card__title {
  background: transparent;
  border: 0;
  color: #0f172a;
  flex: 1 1 auto;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
  margin: 0;
  min-width: 0;
  padding: 0;
}
.grid-feedback-comment-card__score {
  align-items: center;
  background: #ecfdf3;
  border: 1px solid #abefc6;
  border-radius: 999px;
  color: #067647;
  display: inline-flex;
  flex: 0 1 auto;
  font-size: 11px;
  font-weight: 800;
  gap: 4px;
  line-height: 1.2;
  max-width: min(280px, 48%);
  overflow: hidden;
  padding: 6px 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.grid-feedback-comment-card__score.is-empty {
  background: #f2f4f7;
  border-color: #d0d5dd;
  color: #667085;
}
.grid-feedback-comment-card__meta {
  color: #667085;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  padding: 0 12px;
  padding-top: 10px;
}
.grid-feedback-comment-card__body {
  display: grid;
  gap: 10px;
  padding: 10px 12px 12px;
}
.grid-feedback-comment-block {
  display: grid;
  gap: 4px;
}
.grid-feedback-comment-block + .grid-feedback-comment-block {
  border-top: 1px solid #eef2f6;
  padding-top: 10px;
}
.grid-feedback-comment-block__label {
  color: #667085;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.grid-feedback-comment-block p,
.grid-feedback-answer {
  color: #334155;
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
  white-space: pre-wrap;
}
.grid-feedback-question-card {
  background: #fff;
  gap: 8px;
}
.grid-feedback-question-card > b {
  color: #101828;
  font-size: 13px;
}

.grid-recognition-modal__close {
  align-items: center;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  font-size: 20px;
  font-weight: 700;
  height: 36px;
  justify-content: center;
  line-height: 1;
  position: absolute;
  right: 14px;
  top: 14px;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease, transform 0.15s ease;
  width: 36px;
}

.grid-recognition-modal__close--text {
  border-radius: 6px;
  min-width: 58px;
  padding: 0 12px;
  width: auto;
}

.grid-recognition-modal__dialog--text-close h3 {
  margin-right: 76px;
}

.grid-recognition-modal__close:hover {
  background: #f8fafc;
  border-color: #98a2b3;
  color: #101828;
  transform: translateY(-1px);
}

.grid-recognition-modal__close:focus-visible {
  box-shadow: 0 0 0 4px rgba(23, 92, 211, 0.16), 0 8px 18px rgba(15, 23, 42, 0.14);
  outline: none;
}

.grid-recognition-modal__body {
  display: grid;
  gap: 12px;
}

.grid-recognition-detail-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 14px;
}

.grid-recognition-detail-line {
  display: grid;
  gap: 4px;
  grid-template-columns: 90px minmax(0, 1fr);
}

.grid-recognition-detail-line b,
.grid-recognition-detail-summary b {
  color: #475467;
  font-size: 12px;
  text-transform: uppercase;
}

.grid-recognition-detail-summary p {
  margin: 5px 0 0;
  white-space: pre-wrap;
}

.grid-recognition-modal-open {
  overflow: hidden;
}

/* Heatmap: X-axis title horizontal above matrix; Y-axis title vertical along full data height */
.grid-heatmap-axis-grid {
  display: grid;
  grid-template-columns: minmax(36px, 46px) minmax(0, 1fr);
  grid-template-rows: auto max-content;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.grid-heatmap-axis-corner-slot {
  grid-column: 1;
  grid-row: 1;
  width: 46px;
  min-width: 36px;
  max-width: 46px;
  box-sizing: border-box;
  background: #f6f7f9;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}

.grid-heatmap-x-axis-above {
  grid-column: 2;
  grid-row: 1;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
  padding: 10px 8px;
  letter-spacing: 0.02em;
  background: #f6f7f9;
  border-bottom: 1px solid #ddd;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
}

.grid-heatmap-y-axis-left {
  grid-column: 1;
  grid-row: 2;
  width: 46px;
  min-width: 36px;
  max-width: 46px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 2px;
  background: #f6f7f9;
  border-right: 1px solid #ddd;
}

.grid-heatmap-y-axis-left-inner {
  display: inline-block;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-weight: 700;
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: 0.02em;
  text-align: center;
}

.grid-heatmap-table-shell {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
  max-width: 100%;
  width: 100%;
  max-height: min(36rem, 58vh);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  background: #fff;
}

.performance-review-link-card__body {
  display: grid;
  gap: 14px;
}

.performance-review-link-card__intro,
.performance-review-link-card__recipient-summary {
  align-items: baseline;
  background: #f8fbff;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  color: #475467;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  line-height: 1.45;
  padding: 10px 12px;
}

.performance-review-link-card__intro {
  align-items: center;
  background: linear-gradient(135deg, #eef8ff 0%, #f8fbff 100%);
  gap: 7px;
}

.performance-review-link-card__intro strong,
.performance-review-link-card__recipient-summary strong {
  color: #075985;
}

.performance-review-link-card__intro-label {
  color: #075985;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.performance-review-link-card__intro-note {
  border-left: 1px solid #bfdbfe;
  color: #667085;
  margin-left: 3px;
  padding-left: 10px;
}

.performance-review-link-card__field { max-width: 680px; }

.performance-review-link-card__linked,
.performance-review-link-card__unlinked {
  display: grid;
  gap: 14px;
}
.performance-review-link-card__linked[hidden],
.performance-review-link-card__unlinked[hidden] {
  display: none;
}

.performance-review-link-card__launch {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(250px, .95fr) minmax(360px, 1.5fr);
}

.performance-review-link-card__check {
  align-items: flex-start;
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  display: flex;
  gap: 9px;
  min-height: 72px;
  padding: 11px;
}

.performance-review-link-card__check input { margin-top: 3px; }
.performance-review-link-card__check span { display: grid; gap: 3px; }
.performance-review-link-card__check small,
.performance-review-link-card__field small { color: #667085; font-weight: 500; line-height: 1.35; }
.performance-review-link-card__schedule {
  background: #f8fbff;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  padding: 11px 12px 12px;
}
.performance-review-link-card__schedule-heading {
  display: grid;
  gap: 2px;
}
.performance-review-link-card__schedule-heading strong { color: #075985; }
.performance-review-link-card__schedule-heading small { color: #667085; line-height: 1.35; }
.performance-review-link-card__schedule-fields {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.performance-review-self-format {
  background: #f8fbff;
  border: 1px solid #dbe7f3;
  border-radius: 12px;
  display: grid;
  gap: 12px;
  padding: 14px;
}
.performance-review-self-format[hidden],
.performance-review-self-scale[hidden] { display: none; }
.performance-review-self-format__heading,
.performance-review-self-format__choice span,
.performance-review-self-scale__heading > span {
  display: grid;
  gap: 3px;
}
.performance-review-self-format__heading > span,
.performance-review-self-format__choice small,
.performance-review-self-scale__heading small {
  color: #667085;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
}
.performance-review-self-format__choices {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.performance-review-self-format__choice {
  align-items: flex-start;
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  display: flex;
  gap: 9px;
  padding: 12px;
}
.performance-review-self-format__choice:has(input:checked) {
  background: #f0f7ff;
  border-color: #53b1fd;
  box-shadow: 0 0 0 3px rgba(11, 147, 213, .08);
}
.performance-review-self-format__choice input { margin-top: 3px; }
.performance-review-self-scale {
  border-top: 1px solid #dbe7f3;
  display: grid;
  gap: 10px;
  padding-top: 12px;
}
.performance-review-self-scale__heading {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}
.performance-review-self-scale__list { display: grid; gap: 8px; }
.performance-review-self-scale__row {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: 28px minmax(180px, 1fr) 34px 34px auto;
}
.performance-review-self-scale__row input {
  border: 1px solid #cfd8e3;
  border-radius: 7px;
  box-sizing: border-box;
  min-height: 36px;
  padding: 7px 10px;
  width: 100%;
}
.performance-review-self-scale__order {
  align-items: center;
  background: #eaf4ff;
  border-radius: 999px;
  color: #075985;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  height: 24px;
  justify-content: center;
  width: 24px;
}
.performance-review-self-scale__row > button.performance-review-self-scale__move {
  align-items: center;
  display: inline-flex;
  font-size: 10px;
  height: 32px !important;
  justify-content: center;
  line-height: 1;
  min-height: 32px !important;
  min-width: 32px;
  padding: 0;
  width: 32px;
}
.performance-review-self-scale__move:not(:disabled):hover {
  border-color: #98a2b3;
  color: #075985;
}
.performance-review-link-card__actions { align-items: center; display: flex; flex-wrap: wrap; gap: 10px; }
.performance-review-link-card__sent { color: #667085; font-size: 12px; }
.performance-review-link-card__empty { color: #667085; margin: -4px 0 0; }

@media (max-width: 980px) {
  .performance-review-link-card__launch { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
  .performance-review-link-card__launch { grid-template-columns: 1fr; }
  .performance-review-link-card__schedule-fields { grid-template-columns: 1fr; }
  .performance-review-link-card__intro-note { border-left: 0; margin-left: 0; padding-left: 0; width: 100%; }
  .performance-review-self-format__choices { grid-template-columns: 1fr; }
  .performance-review-self-scale__row { grid-template-columns: 28px minmax(0, 1fr) 34px 34px; }
  .performance-review-self-scale__row [data-self-scale-remove] { grid-column: 2 / -1; }
}

/* Employee Performance Rating self-assessment */
.rating-self-assessment-page { width: min(1180px, calc(100% - 32px)); margin: 24px auto 48px; }
.rating-self-assessment-card { overflow: hidden; border: 1px solid #d9e5f2; border-radius: 18px; background: #fff; box-shadow: 0 18px 42px rgba(44, 64, 94, .09); }
.rating-self-assessment-card__header { display: flex; justify-content: space-between; gap: 28px; padding: 28px 30px; border-bottom: 1px solid #dbe8f6; background: linear-gradient(135deg, #f2f9ff 0%, #f6f2ff 100%); }
.rating-self-assessment-card__header h1 { margin: 5px 0 8px; font-size: clamp(24px, 3vw, 34px); }
.rating-self-assessment-card__header p { max-width: 700px; margin: 0; color: #52647d; line-height: 1.55; }
.rating-self-assessment-eyebrow { color: #086c94; font-size: 13px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.rating-self-assessment-meta { display: grid; align-content: center; gap: 8px; min-width: 190px; }
.rating-self-assessment-meta span { display: grid; gap: 2px; color: #42536b; }
.rating-self-assessment-meta strong { color: #13263f; font-size: 11px; letter-spacing: .05em; text-transform: uppercase; }
.rating-self-assessment-success { display: grid; gap: 3px; margin: 22px 30px 0; padding: 13px 16px; border: 1px solid #9dd8bc; border-radius: 10px; background: #edf9f3; color: #126843; }
.rating-self-assessment-form { display: grid; gap: 22px; padding: 28px 30px 30px; }
.rating-self-assessment-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.rating-self-assessment-form legend { margin-bottom: 13px; color: #14243c; font-size: 18px; font-weight: 800; }
.rating-self-scale-options { display: grid; gap: 10px; }
.rating-self-scale-option { display: grid; grid-template-columns: 26px 36px minmax(0, 1fr) 28px; align-items: center; gap: 12px; min-height: 68px; padding: 10px 16px; border: 1px solid #d6e1ef; border-radius: 12px; background: #fff; cursor: pointer; transition: border-color .15s ease, background .15s ease, transform .15s ease; }
.rating-self-scale-option:hover { border-color: #80b8e9; transform: translateY(-1px); }
.rating-self-scale-option:has(input:checked) { border-color: #438cf0; background: #eff7ff; box-shadow: 0 0 0 2px rgba(67, 140, 240, .12); }
.rating-self-scale-option input { width: 18px; height: 18px; margin: 0; accent-color: #2a7de1; }
.rating-self-scale-option > span:nth-of-type(2) { display: grid; gap: 3px; }
.rating-self-scale-option small { color: #64748b; }
.rating-self-scale-option__order { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: #eaf2fb; color: #315473; font-weight: 800; }
.rating-self-scale-option__check, .rating-self-nbox-option__check { color: transparent; font-size: 20px; font-weight: 900; }
.rating-self-scale-option:has(input:checked) .rating-self-scale-option__check, .rating-self-nbox-option:has(input:checked) .rating-self-nbox-option__check { color: #1673d2; }
.rating-self-nbox-help { margin: -5px 0 14px; color: #5a6a80; }
.rating-self-nbox-scroll { overflow-x: auto; border: 1px solid #d7e3f0; border-radius: 12px; }
.rating-self-nbox-table { width: 100%; min-width: 720px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.rating-self-nbox-table th { padding: 11px 12px; background: #f2f6fb; color: #20344e; text-align: center; }
.rating-self-nbox-table thead th { border-bottom: 1px solid #d7e3f0; }
.rating-self-nbox-table tbody th { width: 120px; border-right: 1px solid #d7e3f0; }
.rating-self-nbox-table td { height: 92px; padding: 7px; border-right: 1px solid #e1e9f3; border-bottom: 1px solid #e1e9f3; vertical-align: middle; }
.rating-self-nbox-table tr:last-child td, .rating-self-nbox-table tr:last-child th { border-bottom: 0; }
.rating-self-nbox-table td:last-child { border-right: 0; }
.rating-self-nbox-table td.is-disabled { background: #f7f9fc; color: #8491a3; text-align: center; }
.rating-self-nbox-option { display: grid; grid-template-columns: 20px minmax(0, 1fr) 20px; align-items: center; gap: 8px; height: 100%; padding: 9px; border: 1px solid transparent; border-radius: 9px; cursor: pointer; }
.rating-self-nbox-option:hover { border-color: #a5caed; background: #f5faff; }
.rating-self-nbox-option:has(input:checked) { border-color: #438cf0; background: #eaf5ff; }
.rating-self-nbox-option input { margin: 0; accent-color: #2a7de1; }
.rating-self-nbox-option > span:nth-of-type(1) { display: grid; gap: 4px; }
.rating-self-nbox-option small { color: #64748b; }
.rating-self-nbox-disabled { font-size: 12px; font-weight: 700; }
.rating-self-assessment-note { display: flex; gap: 6px; padding: 13px 15px; border: 1px solid #bcdcf3; border-radius: 10px; background: #eef8ff; color: #275776; }
.rating-self-assessment-actions { display: flex; justify-content: flex-end; gap: 10px; }
@media (max-width: 720px) {
  .rating-self-assessment-page { width: min(100% - 20px, 1180px); margin-top: 14px; }
  .rating-self-assessment-card__header { display: grid; padding: 22px 20px; }
  .rating-self-assessment-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rating-self-assessment-form { padding: 22px 18px; }
  .rating-self-assessment-success { margin: 18px 18px 0; }
  .rating-self-assessment-note { display: grid; }
}

/* One border line between X-axis title row and category header row */
.grid-heatmap-table-shell .grid-heatmap-table thead tr:first-child th {
  border-top: none;
}

/* Fills available width; columns share space so the matrix scales with the viewport */
.grid-heatmap-table {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 6px;
}

.grid-heatmap-corner {
  width: clamp(2.2rem, 7vw, 4.75rem);
  min-width: 2.1rem;
  max-width: 7.5rem;
  box-sizing: border-box;
}

/* Y-axis category labels (same column as corner); vertical text (inner span avoids rotating borders) */
.grid-heatmap-table tbody th.cell {
  width: clamp(2.2rem, 7vw, 4.75rem);
  min-width: 2.1rem;
  max-width: 7.5rem;
  text-align: center;
  vertical-align: middle;
}

.grid-heatmap-y-label-inner {
  display: inline-block;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-weight: 600;
  font-size: 0.95em;
  line-height: 1.25;
  letter-spacing: 0.02em;
  text-align: center;
}

.grid-heatmap-table thead th.cell {
  width: auto;
  min-width: 0;
  vertical-align: bottom;
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f8fafc;
}

.grid-heatmap-table td.heatmap-cell {
  width: auto;
  min-width: 0;
  vertical-align: top;
  min-height: 7.25rem;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.grid-heatmap-table .cell {
  overflow-wrap: break-word;
  word-break: break-word;
}

.grid-heatmap-table th.cell,
.grid-heatmap-table td.heatmap-cell {
  padding: 7px 8px;
}

.grid-heatmap-table td.heatmap-cell {
  border: 1px solid rgba(148, 163, 184, 0.28);
  background-clip: padding-box;
}

.heatmap-cell-title {
  font-weight: 1000;
  margin-bottom: 6px;
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-align: center;
  line-height: 1.3;
}

.heatmap-cell-metric {
  font-weight: 700;
  margin-bottom: 4px;
  font-size: 16px;
}

.heatmap-cell-target-line {
  color: #444;
  font-size: 16px;
  margin-bottom: 2px;
  line-height: 1.35;
}

.heatmap-cell-names {
  margin-bottom: 4px;
  font-size: 10px;
  line-height: 1.4;
}

.heatmap-cell-visible-names {
  --heatmap-name-row-height: 22px;
  max-height: calc((var(--heatmap-name-row-height) * 3) + 4px);
  overflow: hidden;
}

.heatmap-cell-names--twocol {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 2px 8px;
  align-content: start;
}

.heatmap-cell-names .heatmap-people-ui {
  margin-top: 6px;
  position: relative;
}

.heatmap-people-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 2px 6px 2px 4px;
  border: 1px solid #94a3b8;
  border-radius: 6px;
  background: #fff;
  color: #1e293b;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  vertical-align: middle;
  box-sizing: border-box;
}

.heatmap-people-toggle:hover {
  background: #f1f5f9;
  border-color: #64748b;
}

.heatmap-people-toggle:focus-visible {
  outline: 2px solid #1d4ed8;
  outline-offset: 2px;
}

.heatmap-people-toggle-icons {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  flex-shrink: 0;
}

.heatmap-people-icon-person {
  display: block;
}

.heatmap-people-icon-close {
  display: none;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  color: #0f172a;
}

.heatmap-people-toggle.is-open .heatmap-people-icon-person {
  display: none;
}

.heatmap-people-toggle.is-open .heatmap-people-icon-close {
  display: block;
}

.heatmap-people-count {
  letter-spacing: 0.02em;
}

.heatmap-people-popover {
  margin: 0;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.15);
  box-sizing: border-box;
  max-height: min(60vh, 280px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  min-width: 200px;
  max-width: min(320px, calc(100vw - 16px));
  z-index: 10050;
}

.heatmap-people-popover-inner {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.heatmap-people-popover-group {
  margin: 0;
  padding: 0;
}

.heatmap-people-popover-mgr {
  font-size: 11px;
  font-weight: 700;
  color: #334155;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0 0 4px;
  padding-bottom: 2px;
  border-bottom: 1px solid #e2e8f0;
}

.heatmap-people-popover-sublist {
  margin: 0;
  padding: 0 0 0 4px;
  list-style: none;
  font-size: 12px;
  line-height: 1.45;
  color: #0f172a;
}

.heatmap-people-popover-sublist li {
  padding: 3px 2px;
  border-bottom: 1px solid #f8fafc;
}

.heatmap-people-popover-sublist li:last-child {
  border-bottom: none;
}

/* Admin ? performance buckets: ?Assign each box to a group? matrix (fluid like cycle heatmap) */
.perf-buckets-form {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.perf-buckets-count-control {
  margin-bottom: 14px;
}

.perf-buckets-count-select {
  margin-top: 4px;
}

.perf-buckets-count-hint {
  color: #444;
  font-size: 13px;
  margin-left: 8px;
}

.perf-buckets-section-title {
  font-weight: 700;
  margin-bottom: 8px;
}

.perf-buckets-section-title--spaced {
  margin-top: 14px;
}

.perf-buckets-section-title-note {
  color: #475467;
  font-size: 12px;
  font-weight: 600;
}

.perf-buckets-order-callout {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid #f6d7a8;
  border-radius: 8px;
  background: linear-gradient(90deg, #fff8eb, #fffdf8);
  color: #7a3e07;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.45;
}

.perf-buckets-order-callout strong {
  display: inline;
  color: #92400e;
  font-weight: 800;
}

.cycle-edit-dependency-note {
  background: #eff8ff;
  border: 1px solid #b2ddff;
  border-radius: 8px;
  color: #1849a9;
  font-size: 13px;
  line-height: 1.45;
  margin: 0 0 12px;
  padding: 10px 12px;
}

.cycle-edit-dependency-note--bonus {
  background: #fffaeb;
  border-color: #fec84b;
  color: #7a2e0e;
  margin-top: 12px;
}

.cycle-edit-dependency-note strong {
  font-weight: 800;
}

.cycle-edit-dependency-note a {
  color: #026aa2;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.cycle-edit-dependency-note a:hover,
.cycle-edit-dependency-note a:focus-visible {
  color: #175cd3;
}

html[data-keshero-theme="dark"] .cycle-edit-dependency-note {
  background: rgba(46, 197, 255, 0.14);
  border-color: rgba(46, 197, 255, 0.42);
  color: #d1e9ff;
}

html[data-keshero-theme="dark"] .cycle-edit-dependency-note a {
  color: #7dd3fc;
}

.cycle-edit-dependency-note--bonus a {
  color: #b54708;
}

.cycle-edit-dependency-note--bonus a:hover,
.cycle-edit-dependency-note--bonus a:focus-visible {
  color: #93370d;
}

html[data-keshero-theme="dark"] .cycle-edit-dependency-note--bonus {
  background: rgba(245, 158, 11, 0.16);
  border-color: rgba(251, 191, 36, 0.5);
  color: #fde68a;
}

html[data-keshero-theme="dark"] .cycle-edit-dependency-note--bonus a {
  color: #fbbf24;
}

#performanceScoreGroupsSection,
#bonusPayoutPerformanceLink,
#bonusPayoutEstimateSettings {
  scroll-margin-top: 150px;
}

.perf-buckets-section-help {
  color: #444;
  font-size: 13px;
  margin-bottom: 10px;
}

.perf-buckets-section-help--small {
  font-size: 12px;
  margin-bottom: 8px;
}

.perf-buckets-labels-table {
  width: 100%;
  max-width: 1100px;
  margin-bottom: 18px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  overflow: hidden;
}

.perf-buckets-labels-table th,
.perf-buckets-labels-table td {
  border-bottom: 1px solid #eaecf0;
  padding: 8px 10px;
  text-align: left;
  vertical-align: middle;
}

.perf-buckets-labels-table th {
  background: #f8fafc;
  color: #344054;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
}

.perf-buckets-labels-table tbody tr:last-child td {
  border-bottom: 0;
}

.perf-buckets-labels-table tbody tr:hover td {
  background: #f9fafb;
}

.bucket-row--hidden {
  display: none;
}

.perf-buckets-row-control--hidden {
  visibility: hidden;
}

.perf-buckets-toolbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 6px;
}

.perf-buckets-row-actions {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  justify-content: center;
}

.perf-buckets-row-actions .button-small {
  min-width: 32px;
  padding: 4px 8px;
}

.perf-buckets-labels-table .button-danger-small {
  white-space: nowrap;
}

.perf-buckets-labels-table__num {
  width: 3rem;
  text-align: center;
}

.perf-buckets-labels-table__label {
  width: auto;
  min-width: 140px;
}

.perf-buckets-label-input {
  width: 100%;
  max-width: 280px;
  box-sizing: border-box;
}

.perf-buckets-labels-table__color {
  min-width: 14rem;
  width: 14rem;
}

.perf-buckets-labels-table__bonus {
  min-width: 22rem;
  width: 22rem;
}

.perf-buckets-labels-table__bonus-cell {
  white-space: nowrap;
}

.perf-buckets-bonus-range {
  align-items: flex-end;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
}

.perf-buckets-bonus-range.perf-buckets-multiplier-range {
  flex-wrap: nowrap;
  gap: 6px;
  min-width: 23rem;
}

.perf-buckets-bonus-field {
  align-items: center;
  color: #667085;
  display: inline-grid;
  font-size: 11px;
  font-weight: 700;
  gap: 4px;
  grid-template-columns: auto auto;
  grid-template-rows: auto auto;
}

.perf-buckets-bonus-field > span:first-child {
  grid-column: 1 / -1;
}

.perf-buckets-bonus-field > .app-percent-input {
  width: 7.5rem;
}

.perf-buckets-bonus-input {
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  box-sizing: border-box;
  font: inherit;
  min-height: 34px;
  padding: 6px 8px;
  width: 5.5rem;
}

.perf-buckets-bonus-input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  outline: none;
}

.perf-buckets-bonus-sep {
  align-self: center;
  color: #98a2b3;
  font-size: 12px;
  font-weight: 600;
  padding-bottom: 2px;
}

.perf-buckets-labels-table__color-cell {
  white-space: nowrap;
}

.perf-buckets-color-cell-inner {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
}

.perf-buckets-color-cell-inner .bucket-color-picker {
  appearance: none;
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
  cursor: pointer;
  flex-shrink: 0;
  height: 38px;
  overflow: hidden;
  padding: 0;
  width: 38px;
  -webkit-appearance: none;
}

.perf-buckets-color-cell-inner .bucket-color-picker::-webkit-color-swatch-wrapper {
  border: none;
  padding: 0;
}

.perf-buckets-color-cell-inner .bucket-color-picker::-webkit-color-swatch {
  border: none;
  border-radius: 5px;
  box-shadow: none;
  outline: none;
  transform: scale(1.12);
}

.perf-buckets-color-cell-inner .bucket-color-picker::-moz-color-swatch {
  border: none;
  border-radius: 5px;
  box-shadow: none;
}

.perf-buckets-color-cell-inner .bucket-color-picker:hover {
  border-color: #98a2b3;
}

.perf-buckets-color-cell-inner .bucket-color-picker:focus-visible {
  border-color: #1570ef;
  box-shadow: 0 0 0 4px rgba(21, 112, 239, 0.18);
  outline: none;
}

.perf-buckets-color-cell-inner .bucket-color-in {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  font-family: inherit;
  font-size: 13px;
  height: 38px;
  max-width: 8.5rem;
  min-width: 8.5rem;
  padding: 8px 10px;
  width: 8.5rem;
}

.bucket-hex-display {
  color: #98a2b3;
}

.bucket-hex-display--valid {
  color: #344054;
}

.bucket-matrix-scroll {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-bottom: 16px;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
}

.bucket-matrix-table {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

.bucket-matrix-table th,
.bucket-matrix-table td {
  border-bottom: 1px solid #eaecf0;
  border-right: 1px solid #eaecf0;
  padding: 8px;
  box-sizing: border-box;
  vertical-align: middle;
}

.bucket-matrix-table tr:last-child th,
.bucket-matrix-table tr:last-child td {
  border-bottom: 0;
}

.bucket-matrix-table th:last-child,
.bucket-matrix-table td:last-child {
  border-right: 0;
}

.bucket-matrix-corner {
  width: clamp(2.75rem, 10vw, 6rem);
  min-width: 2.5rem;
  max-width: 10rem;
}

.bucket-matrix-y-label {
  width: clamp(2.75rem, 10vw, 6rem);
  min-width: 2.5rem;
  max-width: 10rem;
  text-align: left;
  font-size: 12px;
  font-weight: 700;
  color: #344054;
  background: #f8fafc;
  word-break: break-word;
}

.bucket-matrix-x-label {
  width: auto;
  min-width: 0;
  font-size: 12px;
  font-weight: 700;
  color: #344054;
  background: #f8fafc;
  word-break: break-word;
  text-align: center;
}

.bucket-matrix-table td.bucket-cell-preview {
  min-width: 0;
  transition: background-color 0.15s;
}

.bucket-matrix-table .bucket-cell-select {
  width: 100%;
  max-width: none;
  min-width: 0;
  font-size: 12px;
  box-sizing: border-box;
  background-color: rgba(255, 255, 255, 0.88);
  border-color: #d0d5dd;
  border-radius: 6px;
  min-height: 32px;
}

.grid-placements-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  font-weight: 700;
  margin-bottom: 12px;
}

.grid-placements-heading__left {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.grid-placements-heading__title {
  color: #102a43;
  font-size: 16px;
  font-weight: 800;
  min-width: 0;
}

.grid-placements-heading__right {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.grid-placements-heading__right--filters {
  align-items: center;
  display: grid;
  flex: 1 1 100%;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  min-width: 0;
  width: 100%;
}

.grid-heading-filter {
  align-self: stretch;
  display: grid;
  gap: 4px;
  grid-template-rows: auto var(--app-control-height);
  min-width: 0;
}

.grid-heading-filter__label {
  color: #475467;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
}

.grid-heading-filter > .grid-population-filter-select,
.grid-heading-filter > .grid-population-filter-search,
.grid-heading-filter > .app-rounded-select {
  min-width: 0;
  width: 100%;
}

.grid-heading-filter .grid-population-filter-select,
.grid-heading-filter .grid-population-filter-search,
.grid-heading-filter .app-rounded-select__button {
  height: var(--app-control-height);
  min-height: var(--app-control-height);
}

.grid-heading-filter--search {
  min-width: 160px;
}

.grid-population-filter-search {
  box-sizing: border-box;
  width: 100%;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
  border: 1px solid #94a3b8;
  border-radius: 6px;
  background: #fff;
  color: #0f172a;
}

.grid-population-filter-search:focus-visible {
  outline: 2px solid var(--keshero-blue, #3b6cff);
  outline-offset: 1px;
}

.grid-heading-filter .app-rounded-select__button {
  min-width: 0;
  padding-left: 10px;
}

.grid-placements-heading__right--filters .grid-credit-button {
  background: var(--app-success-surface);
  border-color: var(--app-success-border);
  align-self: end;
  box-sizing: border-box;
  color: var(--app-success-fg);
  height: var(--app-control-height);
  justify-self: start;
  min-height: var(--app-control-height) !important;
  padding: 0 12px !important;
  width: auto;
}

.grid-placements-heading__right--filters .grid-credit-button:hover,
.grid-placements-heading__right--filters .grid-credit-button:focus-visible {
  background: var(--app-success-surface-hover);
  border-color: var(--app-success-border-strong);
  color: var(--app-success-fg-hover);
}

@media (max-width: 560px) {
  .grid-placements-heading__right--filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid-placements-heading__right--filters .grid-credit-button {
    width: auto !important;
  }
}

.grid-promo-nom-filter-btn {
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  border: 1px solid #94a3b8;
  border-radius: 6px;
  background: #fff;
  color: #0f172a;
  white-space: nowrap;
  box-sizing: border-box;
}

.grid-promo-nom-filter-btn:hover {
  background: #f1f5f9;
}

.grid-promo-nom-filter-btn[aria-pressed="true"] {
  background: #e0e7ef;
  border-color: #64748b;
}

.grid-promo-nom-filter-btn:focus-visible {
  outline: 2px solid var(--keshero-blue);
  outline-offset: 2px;
}

.grid-population-filter-select {
  padding: 4px 28px 4px 8px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  border: 1px solid #94a3b8;
  border-radius: 6px;
  background: #fff;
  color: #0f172a;
  max-width: 100%;
  box-sizing: border-box;
  appearance: none;
  background-image: var(--app-dropdown-arrow-icon);
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 16px 16px;
}

.grid-population-filter-select--attention {
  border-color: var(--app-action-danger);
  background-color: var(--app-action-danger);
  color: #fff;
  background-image: var(--app-dropdown-arrow-icon-inverse);
}

.grid-population-filter-select:hover {
  background-color: #f1f5f9;
}

.grid-population-filter-select.grid-population-filter-select--attention:hover {
  background-color: #921b13;
}

.grid-population-filter-select:focus-visible {
  outline: 2px solid var(--keshero-blue);
  outline-offset: 2px;
}

/* Admin import: message colors (avoid templating inside style=""). */
.admin-import-message {
  font-weight: 700;
  margin-bottom: 10px;
}

.admin-import-message--success {
  color: #0d7d4d;
}

.admin-import-message--error {
  color: var(--app-action-danger);
}

.admin-import-success {
  color: #067647;
  font-weight: 600;
  margin-bottom: 10px;
  max-width: 860px;
}

.admin-import-section {
  margin-bottom: 14px;
  max-width: 860px;
}

.admin-import-section-title {
  font-weight: 700;
  margin-bottom: 6px;
}

.admin-import-copy {
  color: #444;
  font-size: 13px;
}

.admin-import-copy--spaced {
  margin-top: 6px;
}

.admin-import-copy--relaxed {
  line-height: 1.5;
}

.admin-import-muted {
  color: #64748b;
}

.admin-import-notice {
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 13px;
  margin-bottom: 14px;
  max-width: 860px;
  padding: 10px 12px;
}

.admin-import-notice--talent {
  background: #eef2ff;
  border-color: #c7d2fe;
  margin-bottom: 12px;
}

.admin-import-notice--neutral {
  background: #f8fafc;
  border-color: #dbe5ef;
}

.admin-import-notice--warning {
  background: #fff8e6;
  border-color: #e6c200;
  border-radius: 6px;
}

.admin-import-notice--success {
  background: #f0fdf4;
  border-color: #86efac;
}

.admin-import-section-title--wide-gap {
  margin-bottom: 8px;
}

.admin-import-explainer-list {
  color: #444;
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
  padding-left: 1.35rem;
}

.admin-import-explainer-item {
  margin-bottom: 10px;
}

.admin-import-detail-list {
  color: #444;
  font-size: 13px;
  margin: 8px 0 0 18px;
}

.admin-import-field {
  max-width: 860px;
}

.admin-import-field-label,
.admin-import-google-title {
  font-weight: 600;
}

.admin-import-google-title {
  margin-bottom: 6px;
}

.admin-import-google-block {
  border-top: 1px solid #e8e8e8;
  margin-top: 18px;
  max-width: 860px;
  padding-top: 14px;
}

.admin-import-url-input {
  box-sizing: border-box;
  max-width: 640px;
  padding: 6px 8px;
  width: 100%;
}

.admin-import-tab-field {
  margin-top: 10px;
}

.admin-import-tab-input {
  max-width: 280px;
  padding: 6px 8px;
}

.admin-import-google-note {
  color: #555;
  font-size: 13px;
  margin-top: 8px;
}

.admin-import-google-disabled-note {
  color: #666;
  font-size: 13px;
  margin-top: 14px;
  max-width: 860px;
}

.admin-import-actions {
  margin-top: 14px;
}

.admin-import-population-card {
  background: #fcfcfd;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  margin-bottom: 16px;
  max-width: 860px;
  padding: 14px 16px;
}

.admin-import-population-title {
  font-weight: 700;
  margin-bottom: 8px;
}

.admin-import-population-option {
  align-items: flex-start;
  display: flex;
  gap: 8px;
  margin-bottom: 10px;
}

.admin-import-population-option--last {
  margin-bottom: 0;
}

.admin-import-population-option-note,
.admin-import-linked-cycle-note {
  color: #475467;
  font-size: 12px;
}

.admin-import-linked-cycle {
  margin-top: 14px;
}

.admin-import-linked-cycle--hidden {
  display: none;
}

.admin-import-linked-cycle-select {
  margin-top: 6px;
  max-width: 100%;
  min-width: 320px;
}

.admin-import-linked-cycle-note {
  margin-top: 6px;
}

.app-inline-message {
  font-weight: 700;
  margin-bottom: 10px;
}

.app-inline-message--error {
  color: #b42318;
}

.app-inline-message--success {
  color: #067647;
}

.app-inline-message--max-720 {
  max-width: 720px;
}

.app-inline-message--max-860 {
  max-width: 860px;
}

.app-inline-message--max-1100 {
  max-width: 1100px;
}

.admin-form-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 720px;
}

.admin-form-field {
  min-width: 0;
}

.admin-form-field--span-all {
  grid-column: 1 / -1;
}

.admin-form-input {
  box-sizing: border-box;
  width: 100%;
}

.admin-form-input--narrow {
  max-width: 360px;
}

.admin-form-note {
  color: #444;
  font-size: 12px;
  margin-top: 10px;
  max-width: 720px;
}

.admin-form-actions {
  margin-top: 14px;
}

.admin-edit-user-page {
  box-sizing: border-box;
  display: grid;
  gap: 14px;
  margin: 0 auto 40px;
  max-width: 1480px;
  padding: 0 clamp(16px, 3vw, 28px);
  width: 100%;
}

.admin-edit-user-hero,
.admin-edit-user-card,
.admin-edit-user-reset-link {
  background: #ffffff;
  border: 1px solid var(--app-container-border, #dbe5ef);
  border-radius: var(--app-radius-card, 10px);
  box-shadow: var(--app-container-shadow, 0 10px 24px rgba(15, 23, 42, 0.06));
  box-sizing: border-box;
  position: relative;
}

.admin-edit-user-hero::before,
.admin-edit-user-card::before,
.admin-edit-user-reset-link::before {
  background: linear-gradient(90deg, rgba(46, 197, 255, 0.7), rgba(90, 75, 255, 0.54), rgba(138, 43, 226, 0)) top left / 100% 3px no-repeat;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  content: "";
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
}

.admin-edit-user-hero {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  justify-content: space-between;
  padding: 18px 20px;
}

.admin-edit-user-hero > div:first-child {
  flex: 1 1 18rem;
  min-width: 0;
}

.admin-edit-user-kicker {
  color: #087db0;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.02em;
  margin: 0 0 6px;
  text-transform: uppercase;
}

.admin-edit-user-hero h3,
.admin-edit-user-section-head h3 {
  color: #101828;
  font-size: 18px;
  font-weight: 850;
  margin: 0;
}

.admin-edit-user-hero p,
.admin-edit-user-section-head p {
  color: #667085;
  font-size: 13px;
  line-height: 1.45;
  margin: 5px 0 0;
}

.admin-edit-user-identity-card {
  background: #f0f9ff;
  border: 1px solid #b9e6fe;
  border-radius: 8px;
  display: grid;
  gap: 3px;
  min-width: 220px;
  padding: 12px 14px;
}

.admin-edit-user-identity-card span,
.admin-edit-user-identity-card small {
  color: #475467;
  font-size: 12px;
}

.admin-edit-user-identity-card strong {
  color: #101828;
  font-size: 20px;
}

.admin-edit-user-form {
  display: grid;
  gap: 14px;
}

.admin-edit-user-card {
  padding: 16px 18px;
}

.admin-edit-user-access-summary {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-top: 12px;
  padding: 10px 12px;
}

.admin-edit-user-access-summary--muted strong {
  color: #667085;
  font-weight: 650;
}

.admin-edit-user-access-summary--ok {
  background: #ecfdf3;
  border-color: #abefc6;
}

.admin-edit-user-access-summary--ok strong {
  color: #027a48;
}

.admin-edit-user-access-summary__label {
  color: #667085;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.admin-edit-user-access-summary strong {
  color: #101828;
  font-size: 14px;
}

.admin-edit-user-note a {
  color: #087db0;
  font-weight: 700;
  text-decoration: none;
}

.admin-edit-user-note a:hover {
  text-decoration: underline;
}

.admin-edit-user-hero-aside {
  align-items: stretch;
  display: grid;
  flex: 0 1 14rem;
  gap: 10px;
  min-width: min(14rem, 100%);
}

.admin-edit-user-status-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.admin-edit-user-status-pill {
  background: #f2f4f7;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #344054;
  font-size: 12px;
  font-weight: 750;
  padding: 4px 10px;
}

.admin-edit-user-status-pill--active {
  background: #ecfdf3;
  border-color: #abefc6;
  color: #027a48;
}

.admin-edit-user-status-pill--inactive {
  background: #fef3f2;
  border-color: #fecdca;
  color: #b42318;
}

.admin-edit-user-status-pill--admin {
  background: #eff8ff;
  border-color: #b2ddff;
  color: #175cd3;
}

.admin-edit-user-status-pill--muted {
  color: #667085;
}

.admin-edit-user-quick-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.admin-edit-user-quick-actions form {
  margin: 0;
}

.admin-edit-user-quick-actions .admin-edit-user-note {
  margin: 0;
}

.admin-edit-user-access-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.admin-edit-user-access-chip {
  background: #f0f9ff;
  border: 1px solid #b9e6fe;
  border-radius: 999px;
  color: #087db0;
  font-size: 12px;
  font-weight: 700;
  padding: 5px 10px;
}

.admin-edit-user-status-grid,
.admin-edit-user-security-grid {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.admin-edit-user-status-actions,
.admin-edit-user-inline-actions {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-edit-user-date-field {
  display: grid;
  font-size: 12px;
  font-weight: 750;
  gap: 4px;
}

.admin-edit-user-smtp-warn {
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  color: #92400e;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.4;
  margin-bottom: 10px;
  padding: 8px 10px;
}

.admin-edit-user-audit-wrap {
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  max-height: 320px;
  overflow: auto;
}

.admin-edit-user-audit-table {
  margin: 0;
  min-width: 920px;
}

.admin-edit-user-audit-table td {
  vertical-align: middle;
}

.admin-edit-user-audit-action {
  margin: 0;
}

.admin-edit-user-audit-rescind {
  align-items: center;
  appearance: none;
  background: #fff7ed;
  border: 1px solid #fdc6a3;
  border-radius: 6px;
  box-shadow: none;
  box-sizing: border-box;
  color: #c4320a;
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-size: max(11px, calc(var(--app-body-size) - 1px));
  font-weight: 800;
  justify-content: center;
  line-height: 1;
  min-height: var(--app-control-height, 38px);
  padding: 0 12px;
  text-decoration: none;
  white-space: nowrap;
}

.admin-edit-user-audit-rescind:hover,
.admin-edit-user-audit-rescind:focus-visible {
  background: #ffedd5;
  border-color: #fb923c;
  color: #9a3412;
}

.admin-edit-user-audit-empty {
  color: #667085;
  padding: 16px !important;
}

.admin-edit-user-outcome {
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  padding: 3px 8px;
}

.admin-edit-user-outcome--completed {
  background: #ecfdf3;
  color: #027a48;
}

.admin-edit-user-outcome--rescinded {
  background: #fffbeb;
  color: #b54708;
}

.admin-edit-user-outcome--pending {
  background: #eff8ff;
  color: #175cd3;
}

.admin-edit-user-schedule-pending {
  color: #175cd3;
}

.admin-edit-user-danger {
  border-color: #fecdca;
}

.admin-edit-user-section-head {
  align-items: flex-start;
  border-bottom: 1px solid #e4e7ec;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  margin-bottom: 16px;
  padding-bottom: 13px;
}

.admin-edit-user-section-head form {
  margin: 0;
}

.admin-edit-user-security .admin-edit-user-access-summary {
  margin-top: 0;
}

.admin-edit-user-security .admin-edit-user-note {
  margin-top: 10px;
}

.admin-edit-user-security-meta {
  color: #667085;
  font-size: 12px;
  font-weight: 650;
  margin-left: auto;
}

.admin-edit-user-form-grid {
  max-width: none;
}

.admin-edit-user-identity {
  padding: 12px 16px 14px;
}

.admin-edit-user-identity .admin-edit-user-section-head {
  margin-bottom: 10px;
  padding-bottom: 8px;
}

.admin-edit-user-identity .admin-edit-user-section-head p {
  margin-top: 2px;
}

.admin-edit-user-identity .admin-edit-user-form-grid {
  gap: 10px 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-edit-user-identity__manager {
  grid-column: span 2;
}

.admin-edit-user-page .admin-form-field label {
  color: #344054;
  font-size: 12px;
  font-weight: 800;
}

.admin-edit-user-page .admin-form-input,
.admin-edit-user-page select.admin-form-input,
.admin-edit-user-page textarea.admin-form-input {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  color: #101828;
  min-height: var(--app-control-height, 38px);
  padding: 8px 10px;
}

.admin-edit-user-page .admin-form-input:focus,
.admin-edit-user-page select.admin-form-input:focus,
.admin-edit-user-page textarea.admin-form-input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  outline: none;
}

.admin-edit-user-reset-link {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 16px 18px;
}

.admin-edit-user-reset-link-title {
  font-weight: 700;
  margin-bottom: 8px;
}

.admin-edit-user-reset-link-copy {
  color: #667085;
  font-size: 13px;
  margin-bottom: 0;
}

.admin-edit-user-reset-link-actions {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.admin-edit-user-reset-link-note {
  color: #666;
  font-size: 12px;
  margin-left: 8px;
}

.admin-edit-user-readonly-id {
  background: #f8fafc !important;
  color: #475467;
  cursor: not-allowed;
}

.admin-edit-user-note {
  color: #667085;
  font-size: 12px;
  line-height: 1.4;
  margin-top: 5px;
}

.admin-edit-user-note--inline {
  display: inline;
  font-weight: 650;
  margin: 0 0 0 6px;
}

.admin-edit-user-scope-block {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  grid-column: 1 / -1;
  margin-top: 12px;
  padding: 14px;
}

.admin-edit-user-scope-block--hidden {
  display: none;
}

.admin-edit-user-scope-title {
  font-weight: 700;
  margin-bottom: 6px;
}

.admin-edit-user-scope-copy {
  color: #667085;
  font-size: 12px;
  margin-bottom: 8px;
}

.admin-edit-user-scope-row {
  border-top: 1px solid #e4e7ec;
  margin-top: 12px;
  padding-top: 12px;
}

.admin-edit-user-scope-field {
  max-width: 480px;
}

.admin-edit-user-scope-value-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 10px;
  max-width: 900px;
}

.admin-edit-user-scope-textarea {
  max-width: 520px;
}

.admin-edit-user-roster-hint {
  color: #667085;
  font-size: 12px;
  margin-top: 8px;
}

.admin-edit-user-add-filter {
  margin-top: 10px;
}

.admin-edit-user-password-grid {
  align-items: start;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(260px, 1fr) minmax(240px, 360px);
}

.admin-edit-user-password-status {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 0 0 12px;
}

.admin-edit-user-status-pill--attention {
  background: #fff7ed;
  border: 1px solid #fdba74;
  color: #9a3412;
}

.admin-edit-user-must-change {
  align-items: flex-start;
  color: #344054;
  display: flex;
  font-size: 13px;
  font-weight: 650;
  gap: 8px;
  line-height: 1.4;
  margin-top: 10px;
}

.admin-edit-user-must-change em {
  color: #667085;
  font-style: normal;
  font-weight: 500;
}

.admin-edit-user-must-change input[type="checkbox"] {
  --app-checkbox-radius: var(--app-dropdown-option-checkbox-radius, 4px);
  --app-checkbox-checked-bg: var(--app-dropdown-option-checkbox-checked-bg, #3a7bff);
  --app-checkbox-checked-border: var(--app-dropdown-option-checkbox-checked-border, #3a7bff);
  -webkit-appearance: none;
  appearance: none;
  accent-color: var(--app-dropdown-option-checkbox-checked-bg, #3a7bff);
  background-color: var(--app-checkbox-bg, #fff);
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid var(--app-checkbox-border, #98a2b3);
  border-radius: var(--app-checkbox-radius);
  box-sizing: border-box;
  flex: 0 0 auto;
  height: var(--app-checkbox-size, 16px);
  margin-top: 2px;
  min-height: var(--app-checkbox-size, 16px);
  min-width: var(--app-checkbox-size, 16px);
  padding: 0;
  width: var(--app-checkbox-size, 16px);
}

.admin-edit-user-must-change input[type="checkbox"]:checked {
  background-color: var(--app-checkbox-checked-bg) !important;
  background-image: var(--app-checkbox-mark-image) !important;
  background-size: var(--app-checkbox-mark-size, 12px) var(--app-checkbox-mark-size, 12px);
  border-color: var(--app-checkbox-checked-border) !important;
}

.admin-edit-user-password-grid > .account-password-requirements {
  margin: 0;
}

.admin-edit-user-password-grid .password-req-list {
  margin-bottom: 0;
}

.admin-edit-user-reset-section {
  margin-top: 0;
}

.admin-edit-user-reset-title {
  font-size: 1.05em;
  margin: 0 0 8px;
}

.admin-edit-user-reset-copy {
  color: #667085;
  font-size: 13px;
  margin: 5px 0 0;
}

.admin-edit-user-reset-submit {
  font-weight: 700;
}

.admin-edit-user-reset-unavailable {
  color: #b42318;
  font-size: 13px;
  margin: 0;
}

.admin-edit-user-actions {
  align-items: center;
  border-top: 1px solid #e4e7ec;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 2px;
  padding-top: 14px;
}

.admin-edit-user-lifecycle-break {
  background: linear-gradient(180deg, #eef4fa 0%, #f7fafc 100%);
  border: 1px solid #c5d0dc;
  border-radius: 8px;
  box-sizing: border-box;
  display: grid;
  gap: 10px;
  margin: 32px 0 20px;
  padding: 20px 18px 16px;
}

.admin-edit-user-lifecycle-break__label {
  color: #1f4d66;
  font-size: 13px;
  font-weight: 850;
  letter-spacing: 0.01em;
  margin: 0;
}

.admin-edit-user-lifecycle-break__caption {
  color: #475467;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
  max-width: 52rem;
}

@media (max-width: 820px) {
  .admin-edit-user-page {
    padding: 0 16px;
  }

  .admin-edit-user-hero,
  .admin-edit-user-section-head,
  .admin-edit-user-reset-link {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-edit-user-identity-card {
    min-width: 0;
  }

  .admin-edit-user-form-grid,
  .admin-edit-user-identity .admin-edit-user-form-grid,
  .admin-edit-user-password-grid,
  .admin-edit-user-scope-value-grid {
    grid-template-columns: 1fr;
  }

  .admin-edit-user-identity__manager {
    grid-column: auto;
  }

  .admin-edit-user-reset-link-actions {
    align-items: flex-start;
  }

  .admin-edit-user-security-meta {
    margin-left: 0;
  }
}

.admin-new-user-page {
  display: grid;
  gap: 16px;
  margin: 0 0 40px;
  padding: 0 18px;
  width: 100%;
}

.admin-new-user-page .app-back-nav {
  margin-bottom: 2px;
  padding: 0;
}

.admin-new-user-hero,
.admin-new-user-card {
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border: 1px solid var(--app-container-border, #dbe5ef);
  border-radius: var(--app-radius-card, 10px);
  box-shadow: var(--app-container-shadow, 0 10px 24px rgba(15, 23, 42, 0.06));
  box-sizing: border-box;
  position: relative;
}

.admin-new-user-hero::before,
.admin-new-user-card::before {
  background: linear-gradient(90deg, rgba(46, 197, 255, 0.7), rgba(90, 75, 255, 0.54), rgba(138, 43, 226, 0)) top left / 100% 3px no-repeat;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  content: "";
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
}

.admin-new-user-hero {
  align-items: center;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 22px;
}

.admin-new-user-kicker {
  color: #1d9bf0;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0;
  margin: 0 0 6px;
  text-transform: uppercase;
}

.admin-new-user-hero h1,
.admin-new-user-section-head h3 {
  color: #101828;
  font-size: 22px;
  font-weight: 850;
  margin: 0;
}

.admin-new-user-hero p,
.admin-new-user-section-head p {
  color: #667085;
  font-size: 13px;
  line-height: 1.45;
  margin: 6px 0 0;
}

.admin-new-user-hero-badge {
  align-items: center;
  background: #f0f9ff;
  border: 1px solid #b9e6fe;
  border-radius: 12px;
  color: #0284c7;
  display: flex;
  flex: 0 0 auto;
  height: 56px;
  justify-content: center;
  width: 56px;
}

.admin-new-user-hero-badge svg {
  fill: currentColor;
  height: 28px;
  width: 28px;
}

.admin-new-user-alert {
  margin-bottom: 0;
}

.admin-new-user-form {
  display: grid;
  gap: 0;
}

.admin-new-user-card {
  padding: 18px;
}

.admin-new-user-section-head {
  align-items: flex-start;
  border-bottom: 1px solid #e4e7ec;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  margin-bottom: 16px;
  padding-bottom: 13px;
}

.admin-new-user-callout {
  background: #f0f9ff;
  border: 1px solid #b9e6fe;
  border-radius: 8px;
  color: #344054;
  font-size: 13px;
  line-height: 1.5;
  margin: 0 0 16px;
  padding: 12px 14px;
}

.admin-new-user-callout strong {
  color: #101828;
}

.admin-new-user-form-grid {
  max-width: none;
}

.admin-new-user-page .admin-form-field label {
  color: #344054;
  display: block;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 6px;
}

.admin-new-user-page .admin-form-input {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  color: #101828;
  min-height: var(--app-control-height, 38px);
  padding: 8px 10px;
}

.admin-new-user-page .admin-form-input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  outline: none;
}

.admin-new-user-footnote {
  border-top: 1px solid #e4e7ec;
  color: #667085;
  font-size: 12px;
  line-height: 1.45;
  margin: 16px 0 0;
  max-width: none;
  padding-top: 14px;
}

@media (max-width: 720px) {
  .admin-new-user-page {
    padding: 0 12px;
  }

  .admin-new-user-hero,
  .admin-new-user-section-head {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-new-user-hero-badge {
    align-self: flex-start;
  }

  .admin-new-user-form-grid {
    grid-template-columns: 1fr;
  }

  .admin-new-user-page .admin-form-input--narrow {
    max-width: none;
  }
}

.admin-notifications-page {
  display: grid;
  gap: 18px;
  margin: 0 auto 34px;
  max-width: 1280px;
  padding: 0 28px;
}

.admin-notifications-hero,
.admin-notifications-card {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
  padding: 18px;
}

.admin-notifications-hero {
  align-items: flex-start;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.admin-notifications-hero h3,
.admin-notifications-card h3 {
  margin: 0;
}

.admin-notifications-hero p {
  color: #667085;
  margin: 6px 0 0;
  max-width: 760px;
}

.admin-notifications-focus-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-notifications-focus-card {
  background: linear-gradient(135deg, #eff8ff 0%, #ffffff 100%);
  border: 1px solid #b9e6fe;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
  color: inherit;
  cursor: pointer;
  display: grid;
  font: inherit;
  gap: 10px;
  padding: 16px;
  position: relative;
  text-align: left;
  width: 100%;
}

.admin-notifications-focus-card:hover,
.admin-notifications-focus-card:focus-visible,
.admin-notifications-focus-card.is-active {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16), 0 12px 26px rgba(15, 23, 42, 0.07);
  outline: none;
}

.admin-notifications-focus-card.is-active {
  background: linear-gradient(135deg, #8fd2ff 0%, #c9e9ff 100%);
}

.admin-notifications-focus-card h3 {
  color: #101828;
  font-size: 16px;
  margin: 0;
}

.admin-notifications-focus-card p {
  color: #475467;
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.admin-notifications-focus-card--banner {
  background: linear-gradient(135deg, #fffaf0 0%, #fff4f6 100%);
  border-color: #fed7aa;
}

.admin-notifications-focus-card--banner.is-active {
  background: linear-gradient(135deg, #ffc875 0%, #ffb9c4 100%);
  border-color: #ff7a4d;
}

.admin-notifications-card--banner {
  background: linear-gradient(135deg, #ffffff 0%, #fffaf0 100%);
  border-color: #fed7aa;
}

.admin-notifications-alert {
  border-radius: 10px;
  font-weight: 400;
  padding: 10px 12px;
}

.admin-notifications-alert--success {
  background: #ecfdf3;
  border: 1px solid #abefc6;
  color: #067647;
}

.admin-notifications-alert--error {
  background: #fef3f2;
  border: 1px solid #fecdca;
  color: #b42318;
}

.admin-notification-form {
  display: grid;
  gap: 14px;
}

.admin-notification-form-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.admin-notification-form label,
.admin-notification-role-group {
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
}

.admin-notification-form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
.admin-notification-form select,
.admin-notification-form textarea {
  border: 1px solid #cfd8e3;
  border-radius: 8px;
  box-sizing: border-box;
  font: inherit;
  font-weight: 400;
  min-height: 38px;
  padding: 8px 10px;
  width: 100%;
}

.admin-notification-form textarea {
  min-height: 110px;
  resize: vertical;
}

.admin-notification-rich-text {
  display: grid;
  gap: 0;
  width: 100%;
}

.admin-notification-rich-text__source[hidden] {
  display: none !important;
}

.admin-notification-rich-text__toolbar {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #cfd8e3;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 6px;
}

.admin-notification-rich-text__toolbar button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 6px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  height: 28px;
  justify-content: center;
  min-width: 28px;
  padding: 0 8px;
}

.admin-notification-rich-text__toolbar button:hover,
.admin-notification-rich-text__toolbar button:focus-visible {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  color: #006aa6;
  outline: none;
}

.admin-notification-rich-text__editor {
  background: #ffffff;
  border: 1px solid #cfd8e3;
  border-radius: 0 0 8px 8px;
  box-sizing: border-box;
  color: #101828;
  display: block;
  font: inherit;
  font-weight: 400;
  line-height: 1.45;
  min-height: 130px;
  overflow-wrap: anywhere;
  padding: 10px;
  width: 100%;
}

.admin-notification-rich-text__editor:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  outline: none;
}

.admin-notification-rich-text.is-empty .admin-notification-rich-text__editor::before {
  color: #8a94a6;
  content: attr(data-placeholder);
  pointer-events: none;
}

.admin-notification-rich-text__editor :where(p, ul, ol) {
  margin: 0 0 8px;
}

.admin-notification-rich-text__editor :where(ul, ol) {
  padding-left: 22px;
}

.admin-notification-role-header {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.admin-notification-role-mode-toggle {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 8px;
  color: #344054;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 400;
  min-height: 32px;
  padding: 6px 12px;
  white-space: nowrap;
  width: auto;
}

.admin-notification-role-mode-toggle[aria-pressed="true"] {
  background: #fef3f2;
  border-color: #fecdca;
  color: #b42318;
}

.admin-notification-role-list {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  display: grid;
  gap: 6px;
  max-height: 180px;
  overflow: auto;
  padding: 8px;
}

.admin-notification-role-list label {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 13px;
  font-weight: 500;
  gap: 8px;
}

.admin-notification-role-list input {
  min-height: 0;
  width: auto;
}

.admin-notification-role-list--exclude label:has(input:checked) span {
  opacity: 0.8;
  text-decoration: line-through;
}

.admin-notification-datetime-field {
  display: grid;
  font-weight: 400;
  position: relative;
}

.admin-notification-datetime-field input[data-admin-datetime-proxy] {
  padding-right: 42px;
}

.admin-notification-datetime-button {
  align-items: center;
  background: transparent;
  border: 0;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  height: 38px;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: 8px;
  top: 0;
  width: 30px;
}

.admin-notification-datetime-button:hover,
.admin-notification-datetime-button:focus-visible {
  background: #e0f2fe;
  border-radius: 6px;
  box-shadow: inset 0 0 0 2px var(--app-action-primary, #0ea5e9);
  color: var(--app-action-primary-border, #0284c7);
  outline: none;
}

.admin-notification-datetime-button:active {
  background: #bae6fd;
  transform: scale(0.94);
}

html[data-keshero-theme="dark"] .admin-notification-datetime-button:hover,
html[data-keshero-theme="dark"] .admin-notification-datetime-button:focus-visible {
  background: #1f3148;
  color: #7dd3fc;
}

.admin-notification-datetime-button svg {
  fill: none;
  height: 18px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 18px;
}

.admin-notification-datetime-native {
  height: 1px !important;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 1px !important;
}

.admin-notification-datetime-popover {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  box-shadow: 0 18px 44px rgba(16, 24, 40, 0.18);
  box-sizing: border-box;
  display: grid;
  gap: 10px;
  left: 0;
  min-width: min(320px, calc(100vw - 40px));
  padding: 12px;
  position: absolute;
  top: calc(100% + 8px);
  z-index: 180;
}

.admin-notification-datetime-popover[hidden] {
  display: none;
}

.admin-notification-datetime-popover label {
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 900;
  gap: 5px;
}

.admin-notification-datetime-popover input {
  min-height: 38px;
}

.admin-notification-datetime-popover__actions {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.admin-notification-datetime-field.is-picker-open input[data-admin-datetime-proxy] {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
}

.admin-notification-check-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.admin-notification-check-row label {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 13px;
  font-weight: 700;
  gap: 8px;
}

.admin-notification-check-row input {
  min-height: 0;
  width: auto;
}

.admin-notification-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.admin-notifications-table-wrap {
  overflow-x: auto;
}

.admin-notifications-table {
  border-collapse: collapse;
  min-width: 980px;
  width: 100%;
}

.admin-notifications-table th,
.admin-notifications-table td {
  border-bottom: 1px solid #eaecf0;
  padding: 10px;
  text-align: left;
  vertical-align: top;
}

.admin-notifications-table th {
  color: #344054;
  font-size: 12px;
  font-weight: 900;
}

.admin-notifications-table td {
  color: #475467;
  font-size: 13px;
}

.admin-notification-status {
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  padding: 4px 8px;
}

.admin-notification-status--active {
  background: #ecfdf3;
  color: #067647;
}

.admin-notification-status--sent {
  background: #eff8ff;
  color: #175cd3;
}

.admin-notification-status--paused {
  background: #fffaeb;
  color: #b54708;
}

.admin-notification-status--ended {
  background: #f2f4f7;
  color: #475467;
}

@media (max-width: 760px) {
  .admin-notifications-page {
    padding: 0 14px;
  }

  .admin-notifications-focus-grid {
    grid-template-columns: 1fr;
  }
}

.app-color-preview-pair {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}

.app-color-preview-swatch {
  border: 1px solid #d0d5dd;
  border-radius: 4px;
  display: inline-block;
  flex-shrink: 0;
  height: 18px;
  width: 18px;
}

.admin-settings-timeline-use {
  flex: 0 0 auto;
  margin: 0;
  vertical-align: middle;
}

.admin-settings-timeline-use input:checked + .db-widget-toggle-slider,
.settings-pip-level-active input:checked + .db-widget-toggle-slider {
  background: #2ec5ff;
}

.admin-settings-timeline-control {
  align-items: center;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 8px;
  max-width: 100%;
  width: 100%;
}

.admin-settings-timeline-control .admin-settings-timeline-use,
.admin-settings-timeline-control .db-widget-toggle {
  flex: 0 0 auto;
}

.admin-settings-timeline-control .admin-settings-timeline-offset {
  flex: 1 1 auto;
  margin-left: 0;
  min-width: 0;
  width: auto;
}

.admin-settings-timeline-control .app-rounded-select {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
}

.admin-settings-timeline-offset {
  margin-left: 8px;
}

.admin-settings-timeline-combine {
  align-items: stretch;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 11.5rem;
}

.admin-settings-timeline-combine .admin-settings-timeline-offset {
  margin-left: 0;
  width: 100%;
}

[data-timeline-overdue-rule-row][data-attach-to="standalone"] [data-timeline-overdue-combine],
[data-timeline-overdue-rule-row][data-attach-to="standalone"] [data-timeline-overdue-combine] + .app-rounded-select,
[data-timeline-overdue-rule-row][data-attach-to="standalone"] [data-timeline-overdue-color-inherited] {
  display: none !important;
}

[data-timeline-overdue-rule-row][data-attach-to="overdue"] [data-timeline-overdue-color-picker] {
  display: none !important;
}

.admin-settings-timeline-color-inherited {
  color: #475467;
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  max-width: 9rem;
}

.admin-settings-timeline-color-inherited[hidden],
[data-timeline-overdue-color-picker][hidden] {
  display: none !important;
}

.admin-settings-timeline-offset--number {
  max-width: 130px;
}

.grouping-value-line-row {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-bottom: 6px;
  min-width: 0;
}

.grouping-value-line-input {
  flex: 1 1 auto;
  min-width: 0;
}

.grouping-value-line-control--hidden {
  visibility: hidden;
}

.admin-groupings-panel {
  max-width: 980px;
}

.admin-groupings-rows,
.admin-urg-groupings-rows {
  align-items: start;
  display: grid;
  gap: 12px;
}

.admin-groupings-rows[data-gender-grouping-cols="3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-groupings-rows[data-gender-grouping-cols="2"] {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-urg-groupings-rows {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-groupings-section-title {
  font-weight: 700;
  margin-bottom: 8px;
}

.admin-groupings-card {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  margin-bottom: 12px;
  padding: 10px;
}

.admin-groupings-field {
  margin-bottom: 8px;
}

.admin-groupings-name-input {
  max-width: 340px;
  width: 100%;
}

.admin-groupings-value-label {
  display: block;
  margin-bottom: 6px;
}

.admin-groupings-value-input,
.admin-groupings-region-input {
  max-width: 520px;
}

.admin-groupings-region-input {
  width: 100%;
}

.admin-groupings-add-value {
  margin-top: 6px;
}

.admin-groupings-actions {
  align-items: center;
  display: flex;
  gap: 10px;
}

.admin-groupings-divider {
  border: none;
  border-top: 1px solid #e2e8f0;
  margin: 16px 0;
}

.admin-groupings-note {
  color: #555;
  font-size: 12px;
  margin-bottom: 8px;
}

.admin-grid-filters-shell-notice {
  border-radius: 8px;
  font-size: 13px;
  margin-bottom: 12px;
  max-width: 860px;
  padding: 10px 12px;
}

.admin-grid-filters-shell-notice--talent {
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}

.admin-grid-filters-shell-notice--compensation {
  background: #eff8ff;
  border: 1px solid #b2ddff;
}

.admin-grid-filters-form {
  max-width: 980px;
}

.admin-grid-filters-cell--left {
  text-align: left;
}

.admin-grid-filters-cell--actions {
  width: 160px;
}

.admin-grid-filters-field-select {
  min-width: 220px;
}

.admin-grid-filters-label-input {
  box-sizing: border-box;
  width: 100%;
}

.admin-grid-filters-row-actions {
  white-space: nowrap;
}

.admin-grid-filters-move-button {
  padding: 2px 6px;
}

.admin-users-toolbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 14px;
  max-width: 960px;
}

.admin-users-search-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
}

.admin-users-search-label {
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.admin-users-search-input {
  max-width: 240px;
  min-width: 180px;
  padding: 6px 8px;
}

.admin-users-clear-link {
  font-size: 13px;
}

.admin-users-table {
  max-width: 960px;
  width: 100%;
}

.admin-users-actions-col {
  width: 200px;
}

.admin-users-inline-form {
  display: inline;
}

.admin-cycle-duplicate-panel {
  max-width: 860px;
}

.admin-cycle-duplicate-copy {
  color: #555;
}

.admin-cycle-inline-error {
  color: #b42318;
  margin: 10px 0 14px;
}

.admin-cycle-form-label {
  display: block;
  font-weight: 600;
  margin-bottom: 6px;
}

.admin-cycle-name-input {
  margin-bottom: 14px;
  max-width: 520px;
  padding: 8px 10px;
  width: 100%;
}

.admin-cycle-form-actions {
  align-items: center;
  display: flex;
  gap: 10px;
}

.admin-cycle-action-summary {
  margin-bottom: 16px;
  max-width: 640px;
}

.admin-cycle-action-summary--wide {
  max-width: 680px;
}

.admin-cycle-action-copy {
  color: #444;
  font-size: 14px;
}

.admin-cycle-action-form {
  align-items: center;
  display: flex;
  gap: 12px;
}

.admin-cycle-action-submit {
  cursor: pointer;
  padding: 8px 14px;
}

.admin-cycle-results-review-wrap {
  margin-top: 8px;
  max-width: 1100px;
  overflow-x: auto;
}

.admin-cycle-results-review-table {
  border-collapse: collapse;
  width: 100%;
}

.admin-cycle-results-review-table th,
.admin-cycle-results-review-table td {
  border-bottom: 1px solid #e4e7ec;
  font-size: 13px;
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
}

.admin-cycle-results-review-table th {
  color: #475467;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.admin-cycle-results-review-detail {
  color: #667085;
  display: block;
  font-size: 12px;
  font-weight: 600;
  margin-top: 2px;
}

.admin-cycle-results-status {
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  padding: 3px 8px;
}

.admin-cycle-results-status--sent {
  background: #ecfdf3;
  color: #027a48;
}

.admin-cycle-results-status--pending {
  background: #effaff;
  color: #087db0;
}

.admin-cycle-results-status--not_needed,
.admin-cycle-results-status--no_account {
  background: #f2f4f7;
  color: #475467;
}

.admin-cycle-results-status--incomplete,
.admin-cycle-results-status--excluded {
  background: #fffaf0;
  color: #93370d;
}

.admin-cycle-action-submit--danger {
  background: #b42318;
  border: 0;
  color: #fff;
}

.admin-cycle-create-panel {
  max-width: 900px;
}

.admin-cycle-create-field {
  margin-bottom: 12px;
}

.admin-cycle-create-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 12px;
}

.admin-cycle-create-grid--flush {
  margin-bottom: 0;
}

.admin-cycle-create-input {
  box-sizing: border-box;
  width: 100%;
}

.admin-cycle-create-input--date {
  max-width: 280px;
}

.admin-cycle-create-input--axis {
  max-width: 420px;
}

.admin-cycle-create-section-title {
  font-weight: 700;
  margin-top: 14px;
}

.admin-cycle-create-help {
  color: #444;
  font-size: 12px;
  margin-top: 4px;
}

.admin-cycle-create-matrix-section {
  margin-top: 12px;
}

.admin-cycle-create-header-label {
  margin: 0;
}

.admin-cycle-create-matrix-table {
  border-collapse: collapse;
  margin-top: 8px;
}

.admin-cycle-create-help--matrix {
  margin-top: 6px;
}

.admin-cycle-create-hidden-field {
  display: none;
}

.admin-cycle-create-footnote {
  color: #475467;
  font-size: 12px;
  margin-top: 10px;
}

.admin-cycle-create-generated-corner {
  min-width: 100px;
}

.admin-cycle-create-target-input {
  width: 90px;
}

.admin-cycle-create-label-input {
  width: 148px;
}

.admin-module-cycle-create-intro {
  max-width: 840px;
}

.admin-module-cycle-create-intro--compact {
  max-width: 720px;
}

.admin-module-cycle-create-panel {
  max-width: 920px;
}

.admin-module-cycle-create-panel--compact {
  max-width: 900px;
}

.admin-module-cycle-create-field {
  margin-bottom: 12px;
}

.admin-module-cycle-create-input {
  box-sizing: border-box;
  width: 100%;
}

.admin-module-cycle-create-select {
  max-width: 420px;
}

.admin-module-cycle-create-help {
  color: #667085;
  font-size: 12px;
  margin-top: 6px;
}

.admin-module-cycle-create-date-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-bottom: 12px;
}

.admin-module-cycle-create-date-input {
  max-width: 260px;
}

.admin-cycle-cell-labels-table {
  border-collapse: collapse;
  margin-top: 12px;
}

.admin-cycle-cell-labels-corner {
  min-width: 88px;
}

.admin-cycle-cell-labels-axis-cell {
  max-width: 118px;
  width: 118px;
  word-break: break-word;
}

.admin-cycle-cell-labels-entry-cell {
  max-width: 118px;
  vertical-align: top;
}

.admin-cycle-cell-labels-input {
  box-sizing: border-box;
  max-width: 100%;
  width: 110px;
}

.admin-cycle-cell-labels-actions {
  margin-top: 14px;
}

.admin-home-setup-notice {
  background: #f5fbff;
  border-color: #b9e6fe;
}

.admin-home-setup-notice__title {
  color: #1849a9;
  font-weight: 800;
}

.admin-home-setup-notice__copy {
  color: #344054;
  font-size: 14px;
  line-height: 1.45;
  margin: 8px 0 0;
}

.admin-home-table-cell--center {
  text-align: center;
}

.admin-home-actions-heading {
  min-width: 520px;
}

.comp-plan-placements {
  margin-top: 16px;
}

@media (max-width: 760px) {
  .admin-cycle-create-grid,
  .admin-module-cycle-create-date-grid,
  .admin-groupings-rows[data-gender-grouping-cols="3"],
  .admin-groupings-rows[data-gender-grouping-cols="2"],
  .admin-urg-groupings-rows {
    grid-template-columns: 1fr;
  }
}

.admin-access-notice {
  background: #ecfdf3;
  border: 1px solid #b7ebc6;
  border-radius: 8px;
  color: #067647;
  font-weight: 600;
  margin-bottom: 12px;
  padding: 10px 12px;
}

.admin-access-tabs-panel {
  padding-bottom: 0;
}

.admin-access-create-notice {
  color: #344054;
  font-weight: 600;
  margin-bottom: 10px;
}

.admin-access-create-form {
  margin-bottom: 12px;
}

.admin-access-create-form .is-hidden,
.admin-access-create-form [hidden] {
  display: none;
}

.admin-access-create-form__row {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-access-create-form__row > label {
  min-width: 0;
}

.admin-access-create-form > button {
  justify-self: end;
  width: auto;
}

@media (max-width: 640px) {
  .admin-access-create-form__row {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Keep the primary team role controls together as one responsive toolbar row. */
.team-skill-search__picks {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  min-width: 0;
}

.team-skill-search__picks .team-skill-search__mode-field {
  flex: 0 0 200px;
  max-width: 200px;
  min-width: 140px;
  width: 200px;
}

.team-skill-search__picks > [data-team-skill-role-wrap],
.team-skill-search__picks > [data-team-skill-compare-slot] {
  flex: 1 1 260px;
  min-width: 0;
}

.team-skill-search__picks > [data-team-skill-add-compare],
.team-skill-search__picks > .team-skill-search__vs,
.team-skill-search__picks > .target-role-toolbar__compare-btn,
.team-skill-search__picks > .team-skill-search__run {
  flex: 0 0 auto;
}

.team-skill-search__picks .pm-manage-filter-field select,
.team-skill-search__picks .target-role-toolbar__field label,
.team-skill-search__picks .target-role-toolbar__field select {
  box-sizing: border-box;
  display: block;
  width: 100%;
}

@media (max-width: 720px) {
  .team-skill-search__picks {
    align-items: stretch;
    flex-direction: column;
  }

  .team-skill-search__picks .team-skill-search__mode-field,
  .team-skill-search__picks > [data-team-skill-role-wrap],
  .team-skill-search__picks > [data-team-skill-compare-slot] {
    flex-basis: auto;
    max-width: none;
    min-width: 0;
    width: 100%;
  }
}

.admin-access-create-link-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.admin-access-create-link-row {
  align-items: end;
  display: flex;
  gap: 8px;
}

.admin-access-create-link-row label {
  flex: 1;
  margin: 0;
}

.admin-access-create-remove {
  white-space: nowrap;
}

.admin-access-create-helper,
.admin-access-create-period-note {
  color: #667085;
  font-size: 12px;
  line-height: 1.4;
}

.admin-access-create-helper {
  margin-top: 5px;
}

.settings-spotlight-reminder-settings { display: grid; gap: 14px; max-width: 720px; }
.settings-spotlight-reminder-details { display: grid; gap: 14px; }
.settings-spotlight-reminder-details[hidden] { display: none !important; }
.settings-checkbox-row { display: flex; align-items: flex-start; gap: 10px; }
.settings-checkbox-row input { margin-top: 3px; accent-color: var(--app-checkbox-checked-bg, #12b76a); }
.settings-checkbox-row span { display: grid; gap: 3px; }
.settings-checkbox-row small, .settings-spotlight-reminder-note { color: #667085; font-size: 12px; line-height: 1.45; }
.settings-spotlight-reminder-cadence { display: grid; gap: 6px; max-width: 230px; font-weight: 700; }

.admin-access-create-add {
  align-self: flex-start;
}

.admin-access-filter-form {
  margin-bottom: 14px;
}

.admin-access-filter-form--compact {
  margin-bottom: 10px;
}

.admin-access-filter-row {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.admin-access-filter-row--spaced {
  margin-top: 10px;
}

.admin-access-filter-action {
  align-self: flex-end;
}

.admin-access-table-toolbar,
.admin-access-bulk-toolbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
  margin-bottom: 8px;
}

.admin-access-inline-form {
  display: inline;
  margin: 0;
}

.admin-access-danger-action {
  color: var(--app-action-delete);
}

.admin-access-table-empty {
  color: #667085;
  padding: 18px;
}

.admin-access-table-heading--left {
  text-align: left;
}

.admin-access-person-link {
  color: #1aa6d6;
  font-weight: 600;
  text-decoration: none;
}

.admin-access-button-link {
  display: inline-block;
  text-decoration: none;
}

.admin-access-detail-header {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
  margin-bottom: 10px;
}

.admin-access-detail-title {
  color: #101828;
  font-size: 24px;
  font-weight: 800;
}

.admin-access-section-title {
  color: #101828;
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 8px;
}

.admin-access-section-copy {
  color: #475467;
  font-size: 13px;
  margin: 0 0 10px;
}

.admin-access-table-wrap--spaced {
  margin-bottom: 16px;
}

.admin-access-primary-actions {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}

.cycle-import-panel {
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  margin-bottom: 18px;
  padding: 16px 18px;
}

.cycle-import-title,
.cycle-preview-title {
  font-weight: 700;
  margin-bottom: 6px;
}

.cycle-import-copy {
  color: #475467;
  font-size: 14px;
  margin: 0 0 12px;
}

.cycle-import-cycle-field {
  display: block;
  margin-bottom: 12px;
  max-width: 360px;
}

.cycle-import-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.cycle-import-fieldset {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  padding: 12px;
}

.cycle-import-legend {
  font-weight: 700;
  padding: 0 6px;
}

.cycle-import-check {
  align-items: center;
  display: inline-flex !important;
  flex-wrap: nowrap;
  font-size: 14px;
  gap: 8px;
  margin: 6px 0;
  white-space: nowrap;
  width: 100%;
}

.cycle-import-check span {
  display: inline-block;
  flex: 0 1 auto;
  line-height: 1.2;
  white-space: nowrap;
}

.cycle-import-check input[type="checkbox"] {
  display: inline-block;
  flex: 0 0 auto;
  height: 14px;
  margin: 0;
  vertical-align: middle;
  width: 14px;
}

.cycle-import-select-all {
  align-items: center;
  color: #1aa6d6;
  cursor: pointer;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  margin-bottom: 8px;
}

.cycle-import-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.cycle-import-summary {
  margin-bottom: 12px;
}

.cycle-import-pill {
  background: #eef4ff;
  border-radius: 999px;
  color: #3538cd;
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  margin-right: 8px;
  padding: 3px 10px;
}

.cycle-preview-section {
  margin: 14px 0 10px;
}

.cycle-preview-copy {
  color: #475467;
  font-size: 13px;
  margin: 0 0 10px;
}

.cycle-preview-toolbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.cycle-preview-toolbar__spacer {
  flex: 1 1 auto;
}

.cycle-preview-count {
  color: #344054;
  font-size: 13px;
  font-weight: 700;
}

.cycle-preview-scroll {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  max-height: 480px;
  overflow: auto;
}

.cycle-preview-scroll table {
  margin: 0;
}

.cycle-preview-scroll thead th {
  background: #f8fafc;
  position: sticky;
  top: 0;
  z-index: 4;
}

.cycle-preview-sort-btn {
  align-items: center;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: inherit;
  gap: 6px;
  justify-content: flex-start;
  padding: 0;
  text-align: left;
  width: 100%;
}

.cycle-preview-sort-btn:hover {
  color: #1aa6d6;
}

.cycle-preview-sort-ind {
  color: #475467;
  font-size: 11px;
}

.cycle-preview-empty {
  color: #667085;
  padding: 12px 0;
}

.field-management-select {
  font-size: 13px;
  line-height: 1.25;
  max-width: 220px;
  min-width: 180px;
  padding: 2px 8px;
}

.field-management-actions {
  align-items: center;
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 4px;
  justify-content: flex-end;
  max-width: 100%;
}

.field-management-select-all {
  align-items: center;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: var(--app-radius-control, 6px);
  box-sizing: border-box;
  color: #1d4ed8;
  cursor: pointer;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  justify-content: center;
  letter-spacing: 0.04em;
  line-height: 1;
  min-height: 28px;
  padding: 0 9px;
  text-decoration: none;
  text-transform: uppercase;
  transition: background-color 0.14s ease, border-color 0.14s ease, color 0.14s ease, box-shadow 0.14s ease;
}

.field-management-select-all:hover,
.field-management-select-all:focus-visible {
  background: #dbeafe;
  border-color: #93c5fd;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.18);
  color: #1e40af;
}

.field-management-intro {
  white-space: normal;
}

.field-management-copy {
  color: #475467;
  font-size: 13px;
  margin: -4px 0 14px;
}

.field-management-move-btn {
  min-width: 28px;
  padding: 2px 6px;
}

.field-management-remove-btn {
  min-height: 28px;
  padding: 2px 8px;
}

.field-management-impact-guide-disclosure {
  margin: 0 0 14px;
}

.field-management-impact-guide-disclosure > summary {
  color: #344054;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  list-style: none;
  margin: 0 0 8px;
  width: fit-content;
}

.field-management-impact-guide-disclosure > summary::-webkit-details-marker {
  display: none;
}

.field-management-impact-guide-wrap {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 4px;
}

.field-management-impact-guide {
  background: #f8fbff;
  border: 1px solid #d8e7f7;
  border-radius: 8px;
  box-sizing: border-box;
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  min-width: 640px;
  padding: 10px;
}

.field-management-impact-guide__item {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 8px 10px;
}

.field-management-impact-guide__item b {
  color: #101828;
  font-size: 12px;
  font-weight: 800;
}

.field-management-impact-guide__item span,
.field-management-section-impact {
  color: #475467;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.field-management-impact-trigger {
  background: transparent;
  border: 0;
  color: #344054;
  display: inline-block;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  max-width: 7.5rem;
  padding: 0;
  text-align: center;
  text-decoration: none;
  white-space: normal;
}

.field-management-impact-trigger:hover,
.field-management-impact-trigger:focus-visible,
.field-management-impact-trigger[aria-expanded="true"] {
  color: #1454d4;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.field-management-impact-trigger:focus-visible {
  border-radius: 4px;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.25);
  outline: 2px solid #2ec5ff;
  outline-offset: 2px;
}

.field-management-impact-popover {
  left: var(--field-impact-left, 24px);
  position: fixed;
  top: var(--field-impact-top, 24px);
  width: var(--field-impact-width, 340px);
  z-index: 1200;
}

.field-management-impact-popover__card {
  background: #fff;
  border: 1px solid #c8d8ea;
  border-radius: 8px;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.18);
  color: #1f2937;
  max-height: min(620px, calc(100vh - 32px));
  overflow: auto;
  padding: 12px;
}

.field-management-impact-popover__head {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  margin-bottom: 6px;
}

.field-management-impact-popover__head strong {
  color: #14253b;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
}

.field-management-impact-popover__close {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #dbe6f3;
  border-radius: 7px;
  color: #52657a;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 20px;
  font-weight: 600;
  height: 30px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 30px;
}
.field-management-impact-popover__close span {
  display: block;
  line-height: 1;
  margin-top: -2px;
}

.field-management-impact-popover__close:hover,
.field-management-impact-popover__close:focus-visible {
  background: #eaf7ff;
  color: #0b3da3;
  cursor: pointer;
}

.field-management-impact-popover p {
  color: #475467;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
  margin: 0;
}

.field-management-impact-preview {
  display: grid;
  gap: 7px;
  margin-top: 12px;
}

.field-management-impact-preview__label {
  color: #667085;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.field-management-impact-preview__screen {
  background:
    linear-gradient(180deg, rgba(46, 197, 255, 0.12), rgba(255, 255, 255, 0) 46px),
    #f8fbff;
  border: 1px solid #d8e7f7;
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  display: grid;
  gap: 10px;
  overflow: hidden;
  padding: 10px;
}

.field-management-impact-preview__top {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
}

.field-management-impact-preview__top strong {
  color: #14253b;
  font-size: 12px;
  font-weight: 900;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.field-management-impact-preview__top span {
  background: #e0f2fe;
  border: 1px solid #bae6fd;
  border-radius: 999px;
  color: #075985;
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 900;
  padding: 3px 7px;
}

.field-management-impact-preview__rows,
.field-management-impact-preview__bars {
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 7px;
  display: grid;
  overflow: hidden;
}

.field-management-impact-preview__empty {
  background: #ffffff;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  padding: 12px;
}

.field-management-impact-preview__empty strong {
  color: #14253b;
  font-size: 12px;
  font-weight: 900;
}

.field-management-impact-preview__empty span {
  color: #667085;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.field-management-impact-preview__row {
  align-items: center;
  border-top: 1px solid #eef2f6;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(92px, 1fr) minmax(70px, 0.75fr) minmax(62px, 0.55fr);
  padding: 8px 9px;
}

.field-management-impact-preview__row:first-child {
  border-top: 0;
}

.field-management-impact-preview__row strong,
.field-management-impact-preview__row span,
.field-management-impact-preview__row em {
  font-size: 11px;
  line-height: 1.2;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.field-management-impact-preview__row strong {
  color: #101828;
  font-weight: 900;
}

.field-management-impact-preview__row span {
  color: #667085;
  font-weight: 800;
}

.field-management-impact-preview__row em {
  background: #ecfdf3;
  border: 1px solid #abefc6;
  border-radius: 999px;
  color: #027a48;
  font-style: normal;
  font-weight: 900;
  padding: 3px 6px;
  text-align: center;
}

.field-management-impact-preview__filter-grid,
.field-management-impact-preview__metrics {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.field-management-impact-preview__metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.field-management-impact-preview__field {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 7px;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px;
}

.field-management-impact-preview__field span {
  color: #667085;
  font-size: 10px;
  font-weight: 900;
}

.field-management-impact-preview__field strong {
  color: #14253b;
  font-size: 12px;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.field-management-impact-preview__button {
  align-items: center;
  background: #2ec5ff;
  border: 1px solid #1aa6d6;
  border-radius: 7px;
  color: #ffffff;
  display: inline-flex;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  justify-content: center;
  justify-self: start;
  min-height: 30px;
  padding: 0 10px;
}

.field-management-impact-preview__bar-row {
  align-items: center;
  border-top: 1px solid #eef2f6;
  display: grid;
  gap: 9px;
  grid-template-columns: 82px minmax(0, 1fr);
  padding: 8px 9px;
}

.field-management-impact-preview__bar-row:first-child {
  border-top: 0;
}

.field-management-impact-preview__bar-row span {
  color: #344054;
  font-size: 11px;
  font-weight: 900;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.field-management-impact-preview__bar-row i,
.field-management-impact-preview__chart {
  background: #eef6ff;
  border-radius: 999px;
  display: block;
  min-width: 0;
}

.field-management-impact-preview__bar-row i {
  height: 9px;
  overflow: hidden;
}

.field-management-impact-preview__bar-row b {
  background: linear-gradient(90deg, #2ec5ff, #8a2be2);
  border-radius: inherit;
  display: block;
  height: 100%;
  width: 58%;
}

.field-management-impact-preview__bar-row b.is-wide {
  width: 86%;
}

.field-management-impact-preview__bar-row b.is-mid {
  width: 62%;
}

.field-management-impact-preview__bar-row b.is-short {
  width: 36%;
}

.field-management-impact-preview__chart {
  align-items: end;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  display: flex;
  gap: 10px;
  height: 86px;
  padding: 12px 14px 10px;
}

.field-management-impact-preview__chart i {
  background: linear-gradient(180deg, #2ec5ff, #8a2be2);
  border-radius: 6px 6px 2px 2px;
  flex: 1 1 0;
  min-width: 0;
}

.field-management-impact-preview__chart .is-tall {
  height: 78%;
}

.field-management-impact-preview__chart .is-mid {
  height: 56%;
}

.field-management-impact-preview__chart .is-short {
  height: 36%;
}

.field-management-impact-preview__chart .is-wide {
  height: 66%;
}

.field-management-section-card {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  box-sizing: border-box;
  margin-bottom: 16px;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  padding: 14px;
}

.field-management-section-card .home-table-wrap {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: visible;
}

.field-management-section-card .field-management-matrix {
  min-width: 980px;
}

.field-management-section-header {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  margin-bottom: 10px;
}

.field-management-section-heading-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.field-management-section-heading {
  /* Row wrap so change-count badges sit beside the title; impact stays full-width below. */
  gap: 2px 8px;
}

.field-management-section-title {
  font-weight: 700;
}

.field-management-form-actions {
  align-items: flex-start;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin: 0 0 16px;
}

.field-management-form-actions--bottom {
  background: color-mix(in srgb, #ffffff 92%, #eef2f6);
  border-top: 1px solid #e4e7ec;
  bottom: 0;
  margin: 16px -4px 0;
  padding: 12px 4px;
  position: sticky;
  z-index: 6;
}

@media (max-width: 1100px) {
  .field-management-impact-guide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-width: 560px;
  }
}

@media (max-width: 720px) {
  .field-management-impact-guide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-width: 520px;
  }

  .field-management-section-header {
    align-items: flex-start;
    flex-direction: column;
  }
}

.person-profile-header {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 16px;
}

.person-profile-title {
  color: #101828;
  font-size: 26px;
  font-weight: 800;
}

.person-profile-subtitle {
  color: #475467;
  margin-top: 4px;
}

.person-profile-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.person-profile-card {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  padding: 16px;
}

.person-profile-card h3 {
  color: #101828;
  font-size: 18px;
  margin: 0 0 12px;
}

.person-profile-table {
  border-collapse: collapse;
  width: 100%;
}

.person-profile-table th,
.person-profile-table td {
  border-bottom: 1px solid #eaecf0;
  font-size: 14px;
  padding: 8px 0;
  vertical-align: top;
}

.person-profile-table th {
  color: #475467;
  font-weight: 700;
  text-align: left;
  width: 42%;
}

.person-profile-table tr:last-child th,
.person-profile-table tr:last-child td {
  border-bottom: 0;
}

.person-profile-empty {
  color: #667085;
  font-size: 14px;
}

@media (max-width: 900px) {
  .person-profile-grid {
    grid-template-columns: 1fr;
  }
}

.admin-access-audit-summary {
  background: linear-gradient(180deg, #fffaf3 0%, #fff7ed 100%);
  border: 1px solid #fed7aa;
  border-radius: 8px;
  color: #7c2d12;
  font-weight: 700;
  margin-bottom: 12px;
  padding: 10px 12px;
}

.admin-access-audit-empty {
  border-radius: 8px;
  font-weight: 700;
  padding: 12px 14px;
}

.admin-access-audit-empty--success {
  background: #ecfdf3;
  border: 1px solid #b7ebc6;
  color: #067647;
}

.admin-access-audit-warning {
  background: #fef3f2;
  border: 1px solid #fecdca;
  border-radius: 8px;
  color: #b42318;
  font-size: 14px;
  margin-bottom: 14px;
  padding: 10px 12px;
}

.admin-access-audit-section--spaced {
  margin-bottom: 20px;
}

.admin-access-audit-empty-copy {
  color: #667085;
  font-size: 14px;
}

.admin-access-audit-table-wrap {
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  overflow-x: auto;
}

.admin-access-audit-table-wrap--manager {
  background: #fff;
  border-color: #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.08);
  overflow: hidden auto;
}

.admin-access-audit-table {
  border-collapse: collapse;
  width: 100%;
}

.admin-access-audit-table--manager-issues,
.admin-access-audit-table--manager-overrides {
  min-width: 1040px;
  table-layout: fixed;
}

.admin-access-audit-table--manager-issues .admin-access-audit-col--employee,
.admin-access-audit-table--manager-overrides .admin-access-audit-col--employee {
  width: 19%;
}

.admin-access-audit-table--manager-issues .admin-access-audit-col--issue {
  width: 15%;
}

.admin-access-audit-table--manager-issues .admin-access-audit-col--manager,
.admin-access-audit-table--manager-overrides .admin-access-audit-col--manager {
  width: 20%;
}

.admin-access-audit-table--manager-overrides .admin-access-audit-col--date {
  width: 13%;
}

.admin-access-audit-table--manager-issues .admin-access-audit-col--status {
  width: 12%;
}

.admin-access-audit-table--manager-overrides .admin-access-audit-col--status {
  width: 16%;
}

.admin-access-audit-table--manager-issues .admin-access-audit-col--actions {
  width: 34%;
}

.admin-access-audit-table--manager-overrides .admin-access-audit-col--actions {
  width: 32%;
}

.admin-access-audit-table.home-cycles-table {
  box-shadow: none;
  margin: 0;
}

.admin-access-audit-table th {
  background: linear-gradient(180deg, #f8fbff 0%, #f3f7fb 100%);
  border-bottom: 1px solid #dbe5ef;
  color: #344054;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.025em;
  text-align: left !important;
  text-transform: uppercase;
}

.admin-access-audit-table th,
.admin-access-audit-table td {
  padding-left: 14px;
  padding-right: 14px;
  padding-bottom: 11px;
  padding-top: 11px;
  vertical-align: middle;
}

.admin-access-audit-table tbody tr {
  transition: background-color 0.14s ease;
}

.admin-access-audit-table tbody tr:hover td {
  background: #f8fbff;
}

.admin-access-audit-table tbody tr:last-child td {
  border-bottom: 0;
}

.admin-access-audit-person-cell,
.admin-access-audit-manager-cell,
.admin-access-audit-date-cell,
.admin-access-audit-status-cell,
.admin-access-audit-actions-cell {
  text-align: left !important;
}

.admin-access-audit-person-cell > strong,
.admin-access-audit-manager-cell > strong {
  display: block;
  line-height: 1.35;
  margin-bottom: 3px;
}

.admin-access-audit-date-cell {
  color: #344054;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  white-space: nowrap;
}

.admin-access-audit-actions-cell {
  background: #fbfdff;
  border-left: 1px solid #edf2f7;
}

.admin-access-audit-normal-cell {
  white-space: normal;
}

.admin-access-audit-compact-cell {
  font-size: 13px;
}

.admin-access-audit-issue-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-access-audit-issue {
  background: #fef3f2;
  border: 1px solid #fecdca;
  border-radius: 999px;
  color: #b42318;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 8px;
}

.admin-access-audit-muted {
  color: #667085;
  font-size: 12px;
}

.admin-access-audit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-access-audit-actions--manager-fix {
  align-items: stretch;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.admin-access-manager-fix-form {
  align-items: end;
  background: #f4f8fc;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  display: grid;
  gap: 6px;
  grid-template-columns: minmax(190px, 1fr) auto;
  padding: 5px;
  width: 100%;
}

.admin-access-manager-fix-form label {
  display: grid;
  gap: 3px;
  margin: 0;
  min-width: 0;
}

.admin-access-manager-fix-label {
  align-items: center;
  color: #344054;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  gap: 3px;
  line-height: 1.1;
}

.admin-access-manager-fix-form select {
  background-color: #fff;
  border: 0;
  box-shadow: none;
  height: 30px;
  max-width: none;
  min-height: 30px;
  width: 100%;
}

.admin-access-manager-fix-submit.button-small {
  background: #2ec5ff !important;
  border-color: #1aa6d6 !important;
  color: #fff !important;
  height: 30px;
  min-height: 30px !important;
  padding: 4px 12px !important;
  white-space: nowrap;
}

.admin-access-manager-fix-submit.button-small:hover {
  background: #1aa6d6 !important;
  border-color: #1689b8 !important;
}

.admin-access-audit-open-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.admin-access-audit-open-link.button-small {
  align-items: center;
  display: inline-flex;
  height: 27px;
  justify-content: center;
  min-height: 27px !important;
  padding: 3px 9px !important;
  width: auto;
}

.admin-access-audit-override-flag {
  background: #fffbeb;
  border: 1px solid #fedf89;
  border-radius: 999px;
  color: #92400e;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  padding: 4px 8px;
  text-align: center;
}

.admin-access-audit-section-head {
  border-bottom: 1px solid #e4e7ec;
  margin-bottom: 14px;
  padding-bottom: 12px;
}

.admin-access-audit-section-head h3 {
  margin: 0 0 5px;
}

.admin-access-audit-section-head p {
  color: #667085;
  margin: 0;
}

.admin-access-manager-issues-panel,
.admin-access-manager-overrides-panel {
  gap: 12px !important;
}

.admin-access-manager-issues-panel .admin-access-intro {
  background: #f8fbff;
  border-color: #dbeafe;
  margin-bottom: 10px;
  padding: 11px 12px;
}

.admin-access-manager-overrides-panel .admin-access-audit-section-head {
  margin-bottom: 12px;
}

.admin-access-audit-inline-reassign-form {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
}

.admin-access-audit-stack-reassign-form {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 8px;
}

.admin-access-audit-inline-form {
  display: inline;
}

.admin-access-audit-label {
  font-size: 12px;
}

.admin-access-audit-select {
  max-width: 240px;
}

.admin-access-audit-select--goal {
  max-width: 220px;
}

.admin-access-audit-danger-text {
  color: #b42318;
}

.admin-access-audit-danger-button {
  color: var(--app-action-delete);
}

.admin-access-history-panel {
  box-sizing: border-box;
  max-width: none;
  width: 100%;
}

.admin-access-history-header {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 14px;
}

.admin-access-history-title {
  margin: 0;
}

.admin-access-history-copy {
  color: #475467;
  margin: 4px 0 0;
}

.admin-access-history-empty {
  color: #667085;
}

/* Admin cycle: live sum of target % cells vs 100%. */
.targets-percent-header-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 16px;
}

.targets-allocated-total {
  font-size: 13px;
  font-weight: 700;
  color: #344054;
  white-space: nowrap;
}

.targets-allocated-total--over {
  color: var(--app-action-danger);
}

.targets-allocated-total--complete {
  background: #ecfdf3;
  border: 1px solid #abefc6;
  border-radius: 999px;
  color: #067647;
  padding: 4px 8px;
}

a.grid-th-sort {
  color: inherit;
  text-decoration: none;
  font-weight: 600;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

a.grid-th-sort:hover {
  text-decoration: underline;
}

.grid-sort-indicator {
  font-size: 1.05em;
  font-weight: 700;
  opacity: 1;
}

.grid-stack-hr {
  margin: 0;
  border: 0;
  border-top: 1px solid #ddd;
}

.legend-detail {
  color: #555;
  font-size: 11px;
}

.admin-placement-dd {
  max-width: 100%;
  min-width: 10rem;
  font-size: 12px;
  margin-bottom: 4px;
  white-space: pre-line;
  line-height: 1.2;
}

.admin-placement-dd option {
  white-space: pre-line;
}

.admin-placement-dd optgroup {
  font-weight: 700;
  text-decoration: underline;
}

.stacked-legend-swatch {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 1px solid #999;
  border-radius: 2px;
  vertical-align: middle;
  margin-right: 6px;
}

.home-empty {
  border: 1px dashed #cfd8e3;
  border-radius: 10px;
  background: #f8fafc;
  padding: 14px 16px;
  color: #334155;
}

.home-table-wrap {
  border: 1px solid #dde5ee;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.04);
  margin-bottom: 18px;
  overflow: auto;
  padding: 12px;
}

.home-table-wrap h3 {
  color: #0f172a;
  font-size: 1rem;
  letter-spacing: 0;
}

.home-cycles-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
}

.home-cycles-table thead th {
  background: #f5f8fb;
  color: #334155;
  font-weight: 700;
}

.home-cycles-table thead th:nth-child(3),
.home-cycles-table thead th:nth-child(4),
.home-cycles-table thead th:nth-child(5),
.home-cycles-table thead th:nth-child(6),
.home-cycles-table thead th:nth-child(7),
.home-cycles-table tbody td:nth-child(3),
.home-cycles-table tbody td:nth-child(4),
.home-cycles-table tbody td:nth-child(5),
.home-cycles-table tbody td:nth-child(6),
.home-cycles-table tbody td:nth-child(7) {
  text-align: center;
}

/* Row colors come from .home-cycle-row / .home-saved-view-* only (no striping ? nth-child was overriding main cycle green). */

.home-cycle-row {
  background: linear-gradient(90deg, #059669 0, #059669 4px, #6ee7b7 4px, #6ee7b7 100%);
}

.home-cycle-row td {
  background: transparent;
}

.home-saved-view-row {
  background: #d1fae5;
}

.home-saved-view-create-row {
  background: #ecfdf5;
}

.home-sv-toggle-btn,
.home-sv-toggle-btn.button-add-small {
  aspect-ratio: 1;
  box-sizing: border-box;
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  max-width: 30px !important;
  max-height: 30px !important;
  padding: 0 !important;
  border: 1px solid var(--app-success-border);
  border-radius: var(--app-radius-control, 6px);
  background: var(--app-success-surface);
  color: var(--app-success-fg);
  font-weight: 700;
  cursor: pointer;
  display: inline-grid;
  line-height: 1;
  place-items: center;
}

.home-sv-toggle-btn:hover,
.home-sv-toggle-btn.button-add-small:hover {
  background: var(--app-success-surface-hover);
  border-color: var(--app-success-border-strong);
  color: var(--app-success-fg-hover);
}

.home-sv-form {
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
  color: var(--app-text, #182230);
  display: grid;
  gap: 10px;
  margin: 2px 0 6px;
  max-width: none;
  padding: 12px 14px 14px;
  width: 100%;
  box-sizing: border-box;
}

.home-sv-form-row {
  align-items: start;
  display: grid;
  gap: 4px;
  max-width: 420px;
  text-align: left;
}

.home-sv-population-type {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  box-sizing: border-box;
  display: grid;
  gap: 8px;
  margin: 0;
  max-width: none;
  min-width: 0;
  padding: 10px 12px;
  text-align: left;
  width: 100%;
}

.home-sv-population-type legend {
  align-items: center;
  color: var(--app-label-color, #344054);
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
  padding: 0 4px;
}

.home-sv-population-type__help.inline-help-button {
  --app-mark-bubble-size: 18px;
}

.home-sv-population-type__intro,
.home-sv-population-type__security-note {
  color: var(--app-muted, #667085);
  font-size: 12px;
  line-height: 1.4;
  margin: 0;
}

.home-sv-population-type__cards {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-sv-population-type__option {
  align-items: flex-start;
  background: var(--app-surface, #ffffff);
  border: 1px solid var(--app-border-soft, #d0d5dd);
  border-radius: 8px;
  box-shadow: none;
  cursor: pointer;
  display: flex;
  gap: 8px;
  min-width: 0;
  padding: 10px 36px 10px 10px;
  position: relative;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.home-sv-population-type__option:hover {
  border-color: var(--app-accent, #2ec5ff);
  box-shadow: none;
  transform: none;
}

.home-sv-population-type__option:has(input:checked) {
  background: #f0f9ff;
  border-color: var(--app-accent, #2ec5ff);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--app-accent, #2ec5ff) 28%, transparent);
}

.home-sv-population-type__option input {
  height: 1px;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 1px;
}

.home-sv-population-type__option::after {
  align-items: center;
  background: #ffffff;
  border: 2px solid #b8c7d3;
  border-radius: 999px;
  color: #ffffff;
  content: "";
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  height: 18px;
  justify-content: center;
  position: absolute;
  right: 10px;
  top: 10px;
  width: 18px;
}

.home-sv-population-type__option:has(input:checked)::after {
  background-color: var(--app-checkbox-checked-bg, #12b76a);
  background-image: var(--app-checkbox-mark-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--app-checkbox-mark-size, 12px) var(--app-checkbox-mark-size, 12px);
  border-color: var(--app-checkbox-checked-border, #039855);
  content: "";
}

.home-sv-population-type__option:has(input:focus-visible) {
  box-shadow: 0 0 0 3px var(--app-focus-ring, rgba(39, 186, 242, 0.28));
}

.home-sv-population-type__content {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.home-sv-population-type__content > strong {
  color: var(--app-heading, #101828);
  font-size: 13px;
  line-height: 1.25;
}

.home-sv-population-type__kicker {
  color: #087ca7;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.home-sv-population-type__description,
.home-sv-population-type__example,
.home-sv-population-type__availability {
  color: var(--app-muted, #667085);
  font-size: 12px;
  line-height: 1.35;
}

.home-sv-population-type__example,
.home-sv-population-type__availability {
  background: transparent;
  border-radius: 0;
  padding: 0;
}

.home-sv-population-type__security-note {
  border-top: 0;
  padding-top: 0;
}

@media (max-width: 760px) {
  .home-sv-population-type__cards {
    grid-template-columns: 1fr;
  }
}

.home-sv-form-actions {
  align-items: center;
  border-top: 1px solid #eaecf0;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 2px;
  padding-top: 10px;
  width: 100%;
}

.home-sv-form-actions > :first-child {
  margin-left: auto;
}

.home-sv-form-actions .button-add-small,
.home-sv-form-actions .button-save-small,
.home-sv-form-actions .button-primary,
.home-sv-form-actions .button-small,
.home-sv-form-actions .home-sv-cancel-button {
  margin: 0;
  min-height: var(--app-control-height, 38px);
}

.home-sv-form .button-add-small {
  background: var(--app-success-surface, #ecfdf5) !important;
  border-color: var(--app-success-border, #b8ebd4) !important;
  color: var(--app-success-fg, #0d6f52) !important;
}

.home-sv-form .home-sv-cancel-button,
.home-sv-form .button-neutral-action,
.home-sv-form .button-small.home-sv-cancel-button {
  background: #e4e7ec !important;
  border: 1px solid #98a2b3 !important;
  border-radius: var(--app-radius-control, 6px);
  color: #1d2939 !important;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  min-height: var(--app-control-height, 38px);
  padding: 0 12px;
}

.home-sv-form-empty {
  color: var(--app-muted, #667085);
  font-size: 12px;
  font-weight: 600;
}

.home-sv-cancel-button {
  margin-left: 0;
}

.home-sv-filter-title {
  color: var(--app-heading, #101828) !important;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
  margin: 0;
  text-align: left;
}

.home-sv-filter-note {
  color: var(--app-muted, #667085);
  font-size: 12px;
  line-height: 1.45;
  margin: -2px 0 0;
  text-align: left;
}

.home-sv-filter-grid {
  align-items: stretch;
  display: grid;
  gap: 8px 10px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin: 0;
}

.home-sv-filter-field {
  background: #f8fafc;
  border: 1px solid #eaecf0;
  border-radius: 8px;
  color: var(--app-text, #182230) !important;
  display: flex;
  flex-direction: column;
  font-size: 12px;
  gap: 6px;
  min-width: 0;
  padding: 8px;
  text-align: left;
}

.home-sv-filter-field > span {
  color: var(--app-label-color, #344054) !important;
  font-size: 12px;
  font-weight: 800;
  line-height: 18px;
  text-align: left;
}

.home-sv-filter-field select {
  min-height: 106px;
}

.home-sv-form label,
.home-sv-form input,
.home-sv-form button,
.home-sv-form select,
.home-sv-form span {
  color: inherit;
}

.home-sv-option-row {
  align-items: flex-start;
  display: flex;
  gap: 8px;
  transition: color 0.16s ease, opacity 0.16s ease;
  text-align: left;
}

.home-sv-option-row--muted {
  color: #667085;
  opacity: 0.9;
  text-decoration: line-through;
}

.home-sv-option-row--unavailable {
  cursor: not-allowed;
}

.home-sv-option-row--unavailable input {
  background: #98a2b3;
  border-color: #98a2b3;
  cursor: not-allowed;
  opacity: 1;
}

.home-sv-option-row--unavailable input::after,
.home-sv-option-row--unavailable input:checked::after {
  border: 0;
  content: "X";
  color: #ffffff;
  font-size: 10px;
  font-weight: 900;
  height: auto;
  line-height: 1;
  transform: none;
  width: auto;
}

.home-sv-option-row--manual-unchecked {
  color: #101828;
  text-decoration: none;
}

.home-sv-filter-stack {
  display: grid;
  gap: 10px 12px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin: 0;
}

.home-sv-filter-stack .home-sv-filter-title,
.home-sv-filter-stack .home-sv-filter-note {
  grid-column: 1 / -1;
}

.home-sv-filter-stack .ks-field {
  margin: 0;
  min-width: 0;
}

/* Saved-view filters: label above control (not native fieldset border box). */
.home-sv-form .home-sv-filter-stack fieldset.ks-field {
  background: transparent;
  border: 0;
  margin: 0;
  min-inline-size: 0;
  padding: 0;
}

.home-sv-form .home-sv-filter-stack fieldset.ks-field > legend.ks-field__label {
  display: block;
  float: none;
  margin: 0 0 6px;
  padding: 0;
  width: 100%;
}

.home-sv-form .home-sv-filter-stack fieldset.ks-field:focus-within {
  background: transparent;
}

/* Saved-view / all ks-dropdown option checks: canonical blue rounded square lives in
   design_system.css (--app-dropdown-option-checkbox-*). Do not reintroduce green circles here. */

.home-planning-module-card {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 16px;
  margin-top: 16px;
  overflow: hidden;
}

.home-planning-module-card__header {
  border-bottom: 1px solid #eaecf0;
  padding: 14px 16px 10px;
  position: relative;
}

.home-planning-module-card--performance .home-planning-module-card__header {
  background:
    linear-gradient(180deg, #dbeafe 0%, #e8f2ff 42%, #f3f8ff 78%, #fff 100%);
  border-bottom-color: #93c5fd;
  box-shadow: inset 0 3px 0 var(--keshero-teal, #2ec5ff);
}

.home-planning-module-card--compensation .home-planning-module-card__header {
  background:
    linear-gradient(180deg, #a8e6cf 0%, #d1fae5 42%, #ecfdf5 78%, #fff 100%);
  border-bottom-color: #6ee7b7;
  box-shadow: inset 0 3px 0 var(--keshero-green, #34c38f);
}

.home-planning-module-card--talent .home-planning-module-card__header {
  background:
    linear-gradient(180deg, #ede9fe 0%, #f3efff 42%, #f9f7ff 78%, #fff 100%);
  border-bottom-color: #c4b5fd;
  box-shadow: inset 0 3px 0 var(--keshero-purple, #8a2be2);
}

.home-planning-module-card--promotion .home-planning-module-card__header {
  background:
    linear-gradient(180deg, #fef3c7 0%, #fff7db 42%, #fffbeb 78%, #fff 100%);
  border-bottom-color: #fcd34d;
  box-shadow: inset 0 3px 0 #f59e0b;
}

.home-planning-module-card__title {
  color: #101828;
  font-size: var(--app-container-title-size, 17px);
  margin: 0;
}

.home-planning-module-card__table-wrap {
  background: #fff;
  overflow-x: auto;
  padding: 0 16px 14px;
}

.home-planning-module-card .home-planning-table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
}

.home-planning-col-saved-view {
  width: 40px;
}

.home-planning-col-population {
  width: 120px;
}

.home-planning-col-progress {
  width: 180px;
}

.home-planning-col-open {
  width: 200px;
}

.home-planning-col-analysis {
  width: 120px;
}

/* Cycle column absorbs remaining width. */
.home-planning-col-cycle {
  width: auto;
}

.home-planning-module-card .home-planning-table thead th {
  background: transparent;
  border-bottom: 1px solid #eaecf0;
  color: #667085;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  padding: 6px 8px;
  text-transform: none;
  vertical-align: bottom;
  white-space: nowrap;
}

.home-planning-module-card .home-planning-table thead th.home-col-population,
.home-planning-module-card .home-planning-table thead th.home-col-progress,
.home-planning-module-card .home-planning-table thead th.home-col-open,
.home-planning-module-card .home-planning-table thead th.home-col-analysis {
  padding-left: 12px;
  padding-right: 14px;
}

.home-planning-module-card .home-planning-table tbody td {
  border-bottom: 1px solid #f2f4f7;
  color: #344054;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.3;
  padding: 7px 8px;
  vertical-align: middle;
}

/* Undo global home-cycles-table nth-child centering inside planning tables. */
.home-planning-module-card .home-planning-table thead th:nth-child(3),
.home-planning-module-card .home-planning-table thead th:nth-child(4),
.home-planning-module-card .home-planning-table thead th:nth-child(5),
.home-planning-module-card .home-planning-table thead th:nth-child(6),
.home-planning-module-card .home-planning-table thead th:nth-child(7),
.home-planning-module-card .home-planning-table tbody td:nth-child(3),
.home-planning-module-card .home-planning-table tbody td:nth-child(4),
.home-planning-module-card .home-planning-table tbody td:nth-child(5),
.home-planning-module-card .home-planning-table tbody td:nth-child(6),
.home-planning-module-card .home-planning-table tbody td:nth-child(7) {
  text-align: unset;
}

.home-planning-module-card .home-planning-table tbody tr:last-child td {
  border-bottom: 0;
}

.home-planning-th-label {
  align-items: center;
  display: inline-flex;
  gap: 4px;
  justify-content: center;
  line-height: 1.2;
}

.home-planning-module-card .home-planning-table th.home-col-saved-view,
.home-planning-module-card .home-planning-table td.home-col-saved-view,
.home-planning-module-card .home-planning-table th.home-col-open,
.home-planning-module-card .home-planning-table td.home-col-open,
.home-planning-module-card .home-planning-table th.home-col-analysis,
.home-planning-module-card .home-planning-table td.home-col-analysis {
  text-align: center;
}

.home-planning-module-card .home-planning-table th.home-col-population,
.home-planning-module-card .home-planning-table td.home-col-population,
.home-planning-module-card .home-planning-table th.home-col-progress,
.home-planning-module-card .home-planning-table td.home-col-progress {
  text-align: center;
  white-space: nowrap;
}

.home-planning-module-card .home-planning-table td.home-col-progress .home-progress-cell {
  display: inline-grid;
  justify-items: center;
}

.home-planning-module-card .home-planning-table th.home-col-cycle,
.home-planning-module-card .home-planning-table td.home-col-cycle {
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-planning-module-card .home-planning-table td.home-col-cycle .home-cycle-cell {
  min-width: 0;
  overflow: hidden;
}

.home-planning-module-card .home-planning-table td.home-col-cycle .home-cycle-cell__name,
.home-planning-module-card .home-planning-table td.home-col-cycle .home-saved-view-row__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-planning-module-card .home-cycle-row,
.home-planning-module-card .home-cycle-row > td {
  background: #f2f4f7 !important;
  color: #101828;
}

.home-planning-module-card .home-saved-view-row,
.home-planning-module-card .home-saved-view-row > td {
  background: #fff !important;
  color: #475467;
}

.home-planning-module-card .home-saved-view-form-row > td {
  background: #f8fafc !important;
  border-bottom: 1px solid #eaecf0;
  padding: 12px;
  white-space: normal;
}

.home-planning-saved-view-help.inline-help-button {
  flex-shrink: 0;
  margin: 0;
}

.home-cycle-cell {
  display: block;
  line-height: 1.25;
  min-width: 0;
}

.home-cycle-cell__name {
  color: #101828;
  display: block;
  font-size: 13px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-cycle-cell__period {
  color: #667085;
  display: block;
  font-size: 11px;
  font-weight: 400;
  margin-top: 1px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-planning-module-card .home-col-cycle--child {
  padding-left: 12px;
  vertical-align: middle;
}

.home-saved-view-row__label {
  align-items: center;
  display: inline-flex;
  gap: 0;
  max-width: 100%;
  min-width: 0;
}

.home-saved-view-row__connector {
  flex: 0 0 14px;
  height: 12px;
  margin-right: 8px;
  position: relative;
  width: 14px;
}

.home-saved-view-row__connector::before {
  border-bottom: 2px solid #d0d5dd;
  border-left: 2px solid #d0d5dd;
  border-radius: 0 0 0 6px;
  bottom: 0;
  box-sizing: border-box;
  content: "";
  height: 10px;
  left: 0;
  position: absolute;
  width: 14px;
}

.home-saved-view-row__text {
  align-items: center;
  display: inline-flex;
  gap: 0;
  line-height: 1.25;
  max-width: calc(100% - 22px);
  min-width: 0;
  overflow: hidden;
}

.home-saved-view-row__name {
  color: #344054;
  flex: 0 1 auto;
  font-size: 13px;
  font-weight: 500;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-saved-view-row__sep {
  color: #98a2b3;
  flex: 0 0 auto;
  font-weight: 400;
  margin: 0 4px;
}

.home-saved-view-row__type {
  color: #667085;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}

.home-progress-cell {
  display: grid;
  gap: 6px;
  justify-items: center;
  line-height: 1.2;
  min-width: 0;
}

.home-progress-cell__grid {
  column-gap: 20px;
  display: grid;
  grid-template-columns: repeat(2, auto);
  justify-items: center;
  row-gap: 2px;
  text-align: center;
}

.home-progress-cell__label {
  color: #667085;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.home-progress-cell__value {
  align-items: baseline;
  color: #101828;
  display: inline-flex;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  gap: 4px;
  justify-content: center;
  white-space: nowrap;
}

.home-progress-cell__pct {
  color: #667085;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}

.home-progress-cell__empty {
  color: #98a2b3;
  font-size: 13px;
  font-weight: 400;
}

.home-progress-bar {
  background: #eaecf0;
  border-radius: 999px;
  height: 3px;
  justify-self: center;
  max-width: 9.5rem;
  overflow: hidden;
  width: 100%;
}

.home-progress-bar__fill {
  background: #2ec5ff;
  display: block;
  height: 100%;
}

.home-analysis-links {
  align-items: center;
  display: inline-flex;
  flex-wrap: nowrap;
  font-size: 12px;
  gap: 0;
  justify-content: center;
  white-space: nowrap;
}

.home-analysis-links__sep {
  color: #98a2b3;
  font-weight: 400;
  margin: 0 4px;
}

.home-planning-module-card .home-col-population {
  color: #101828;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.home-planning-module-card .home-sv-toggle-btn,
.home-planning-module-card .home-sv-toggle-btn.button-add-small {
  align-items: center;
  display: inline-grid !important;
  font-size: 17px;
  font-weight: 700;
  height: 28px !important;
  justify-content: center;
  line-height: 1;
  max-height: 28px !important;
  max-width: 28px !important;
  min-height: 28px !important;
  min-width: 28px !important;
  padding: 0 0 2px !important;
  place-items: center;
  width: 28px !important;
}

.home-planning-module-card .home-row-actions {
  flex-wrap: wrap;
  gap: 0;
  justify-content: center;
  row-gap: 2px;
}

.home-planning-module-card .home-row-actions > .home-row-action-link,
.home-planning-module-card .home-row-actions > .home-row-action-button,
.home-planning-module-card .home-row-actions > .home-row-actions__form > .home-row-action-button {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  height: auto !important;
  line-height: 1.2 !important;
  margin: 0;
  max-height: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  padding: 0 4px !important;
}

.home-planning-module-card .home-row-actions > .home-row-action-link:not(:first-child)::before,
.home-planning-module-card .home-row-actions > .home-row-action-button:not(:first-child)::before,
.home-planning-module-card .home-row-actions > .home-row-actions__form::before {
  color: #98a2b3;
  content: "|";
  font-weight: 400;
  margin: 0 4px;
}

.home-planning-module-card .home-row-actions > .home-row-action-link:hover,
.home-planning-module-card .home-row-actions > .home-row-action-button:hover {
  background: none !important;
  text-decoration: underline;
}

.home-planning-module-card .home-cycle-row--performance,
.home-planning-module-card .home-cycle-row--compensation,
.home-planning-module-card .home-cycle-row--talent,
.home-planning-module-card .home-saved-view-row--performance,
.home-planning-module-card .home-saved-view-row--compensation,
.home-planning-module-card .home-saved-view-row--talent {
  --home-action-open: #2ec5ff;
  --home-action-review: #2ec5ff;
  --home-action-edit: #344054;
  --home-action-delete: #800020;
}

.home-planning-module-card .home-row-action-link--open,
.home-planning-module-card .home-row-action-link--review {
  color: var(--home-action-open) !important;
}

.home-planning-module-card .home-row-action-button--edit {
  color: var(--home-action-edit) !important;
}

.home-planning-module-card .home-row-action-button--delete {
  color: var(--home-action-delete) !important;
}

.home-planning-module-card .home-row-restricted {
  color: #98a2b3;
  font-size: 12px;
  font-weight: 500;
}

.home-planning-module-card .home-planning-table .home-row-action-link {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: inline;
  font-size: 12px !important;
  font-weight: 600 !important;
  height: auto !important;
  line-height: 1.2 !important;
  max-height: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
}

.home-planning-module-card .home-planning-table .home-row-action-link:hover {
  background: none !important;
  text-decoration: underline;
}

.home-saved-view-form-row .home-sv-form,
.home-saved-view-form-row .home-sv-form label:not([class*="button-"]),
.home-saved-view-form-row .home-sv-form input:not([type="checkbox"]),
.home-saved-view-form-row .home-sv-form select,
.home-saved-view-form-row .home-sv-form span {
  color: var(--app-text, #182230);
}

.home-saved-view-form-row .home-sv-name-label,
.home-saved-view-form-row .home-sv-filter-title {
  color: var(--app-label-color, #344054) !important;
}

.admin-clear-filters {
  font-size: 13px;
}

.admin-cycle-filter-row {
  align-items: center;
  display: flex;
  justify-content: flex-start;
  margin-bottom: 12px;
}

.admin-cycle-filter-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-cycle-search-field {
  align-items: center;
  background: var(--app-pill-bg, #ffffff);
  border: 1px solid var(--app-pill-border, #d0d5dd);
  border-radius: var(--app-pill-radius, 999px);
  color: #344054;
  display: inline-flex;
  gap: 8px;
  min-height: 38px;
  padding: 4px 6px 4px 12px;
}

.admin-cycle-search-field span {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.admin-cycle-search-field input {
  background: #fff;
  border: 0;
  border-left: 1px solid #e4e7ec;
  color: #182230;
  font: inherit;
  font-size: 13px;
  min-height: 28px;
  min-width: min(280px, 52vw);
  outline: 0;
  padding: 4px 8px;
}

.admin-cycle-search-field:focus-within {
  border-color: var(--app-action-primary-border);
  box-shadow: 0 0 0 3px var(--app-focus-ring, rgba(46, 197, 255, 0.24));
}

.admin-cycle-type-menu {
  position: relative;
}

.admin-cycle-type-menu summary {
  align-items: center;
  background: var(--app-pill-bg, #ffffff);
  border: 1px solid var(--app-pill-border, #d0d5dd);
  border-radius: var(--app-pill-radius, 999px);
  color: var(--app-pill-text, #344054);
  cursor: pointer;
  display: inline-flex;
  gap: 8px;
  list-style: none;
  min-height: 38px;
  min-width: 220px;
  padding: 8px 11px;
}

.admin-cycle-type-menu--active summary {
  background: var(--app-pill-active-bg, #2ec5ff);
  border-color: var(--app-pill-active-border);
  color: var(--app-pill-active-text, #ffffff);
}

.admin-cycle-type-menu summary::-webkit-details-marker {
  display: none;
}

.admin-cycle-type-menu summary span {
  color: currentColor;
  font-size: 12px;
  font-weight: 800;
  opacity: 0.72;
}

.admin-cycle-type-menu summary strong {
  color: currentColor;
  font-size: 13px;
}

.admin-cycle-type-menu__panel {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.14);
  display: grid;
  gap: 7px;
  left: 0;
  min-width: 260px;
  padding: 10px;
  position: absolute;
  top: calc(100% + 6px);
  z-index: 30;
}

.admin-cycle-type-menu__option {
  align-items: center;
  color: #344054;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 700;
  gap: 8px;
  line-height: 1.35;
}

.admin-cycle-type-menu__option input {
  margin: 0;
}

.admin-cycle-type-menu__actions {
  align-items: center;
  border-top: 1px solid #e4e7ec;
  display: flex;
  gap: 10px;
  justify-content: flex-start;
  margin-top: 4px;
  padding-top: 9px;
}

.admin-cycle-type-menu__actions button {
  min-height: 32px;
  padding: 6px 11px;
}

.admin-cycle-type-menu__actions a {
  color: var(--keshero-teal);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.admin-cycle-type-menu__actions a:hover {
  text-decoration: underline;
}

.admin-cycle-filter-row {
  align-items: stretch;
  margin-bottom: 14px;
}

.admin-cycle-filter-form.app-filter-bar {
  align-items: end;
  box-sizing: border-box;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) minmax(230px, max-content);
  width: 100%;
}

.admin-cycle-filter-form.app-filter-bar .admin-clear-filters {
  justify-self: start;
}

.admin-cycle-search-field {
  align-items: stretch;
  background: transparent;
  border: 0;
  border-radius: 0;
  display: grid;
  gap: 5px;
  min-height: 0;
  min-width: 0;
  padding: 0;
}

.admin-cycle-search-field span {
  color: var(--app-table-header-text, #344054);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.admin-cycle-search-field input {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: var(--app-radius-control, 7px);
  box-sizing: border-box;
  font: inherit;
  font-size: 13px;
  min-height: var(--app-control-height, 38px);
  min-width: 0;
  overflow: hidden;
  padding: 8px 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

.admin-cycle-search-field input::placeholder {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-cycle-search-field input:focus {
  border-color: var(--app-action-primary-border);
  box-shadow: 0 0 0 3px var(--app-focus-ring, rgba(46, 197, 255, 0.24));
  outline: none;
}

.admin-cycle-search-field:focus-within {
  border-color: transparent;
  box-shadow: none;
}

.admin-cycle-type-menu {
  align-self: end;
  position: relative;
  z-index: 21;
}

.admin-cycle-type-menu[open] {
  z-index: 40;
}

.admin-cycle-type-menu summary {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: var(--app-radius-control, 7px);
  color: #344054;
  min-height: 32px;
  min-width: 230px;
  padding: 5px 9px;
}

.admin-cycle-type-menu--active summary {
  background: #eef4ff;
  border-color: #84adff;
  color: var(--keshero-teal);
}

.admin-cycle-type-menu summary span {
  font-size: 12px;
  letter-spacing: 0.01em;
  opacity: 0.78;
}

.admin-cycle-type-menu summary strong {
  font-size: 13px;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .admin-cycle-filter-form.app-filter-bar {
    grid-template-columns: 1fr;
  }
}

.home-cycles-table thead th .home-cycles-sort-link {
  color: inherit;
  text-decoration: none;
  font-weight: inherit;
}

.home-cycles-table thead th .home-cycles-sort-link:hover {
  text-decoration: underline;
}

.home-cycles-sort-indicator {
  color: inherit;
  display: inline-block;
  font-size: 0.95em;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  margin-left: 5px;
  opacity: 1;
  transform: scaleY(1.15);
  vertical-align: -1px;
}

/* Password requirement checklist (reset / change password) */
.password-req-list {
  list-style: none;
  padding-left: 0;
  margin: 8px 0 12px;
  font-size: 13px;
  line-height: 1.45;
}

.password-req-list li {
  margin: 5px 0;
  padding: 6px 8px 6px 1.55em;
  position: relative;
  font-weight: 500;
  border-radius: 4px;
}

.password-req-list li::before {
  font-family: inherit;
  font-weight: 700;
  left: 8px;
  position: absolute;
  text-align: left;
  width: 1.1em;
}

.password-req-list li.password-req-unmet {
  color: var(--app-action-danger);
  background: rgba(180, 35, 24, 0.08);
}

.password-req-list li.password-req-unmet::before {
  content: "\00D7";
  color: var(--app-action-danger);
}

.password-req-list li.password-req-met {
  color: var(--app-success-fg);
  background: rgba(6, 118, 71, 0.08);
}

.password-req-list li.password-req-met::before {
  content: "\2713";
  color: var(--app-success-fg);
}

.password-req-list li.password-req-neutral {
  color: #666;
  background: transparent;
}

.password-req-list li.password-req-neutral::before {
  content: "\2013";
  color: #999;
}

/* ???????????????????????????????????????????????????????????????
   Data Analysis page
   ??????????????????????????????????????????????????????????????? */

.da-empty {
  text-align: center;
  color: #888;
  padding: 48px 24px;
  font-size: 15px;
}

.da-filters-panel {
  padding: 12px 20px 8px;
}

/* ?? KPI cards ?? */
.da-kpi-section {
  padding: 16px 20px 0;
}
.da-kpi-row {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}
.da-kpi-card {
  flex: 1 1 130px;
  min-width: 120px;
  max-width: 200px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 14px 16px;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.da-kpi-card--primary {
  border-left: 4px solid var(--keshero-indigo);
}
.da-kpi-label {
  font-size: 11.5px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: .3px;
  margin-bottom: 4px;
}
.da-kpi-value {
  font-size: 26px;
  font-weight: 700;
  color: #111827;
  line-height: 1.15;
}
.da-kpi-sub {
  font-size: 12px;
  color: #9ca3af;
  margin-top: 3px;
}

/* ?? Chart sections ?? */
.da-chart-section {
  padding: 16px 20px 0;
}
.da-chart-section--duo {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.da-chart-section--duo > .da-chart-card {
  flex: 1 1 340px;
  min-width: 300px;
}
.da-chart-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 18px 20px 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.da-chart-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.da-chart-title {
  font-size: 15px;
  font-weight: 700;
  color: #1f2937;
  margin: 0 0 10px;
}
.da-chart-header .da-chart-title {
  margin-bottom: 0;
}

/* Expand / collapse button */
.da-expand-btn {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  border: 1px solid #d1d5db;
  background: #f9fafb;
  font-size: 18px;
  font-weight: 700;
  color: #374151;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, border-color .15s;
}
.da-expand-btn:hover {
  background: rgba(46, 197, 255, 0.1);
  border-color: var(--keshero-cyan-glow);
}

/* ?? Horizontal bar chart ?? */
.da-bar-chart {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.da-bar-chart--detail {
  margin-top: 6px;
}
.da-bar-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.da-bar-label {
  width: 160px;
  min-width: 120px;
  font-size: 13px;
  font-weight: 500;
  color: #374151;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.da-bar-track {
  flex: 1;
  height: 22px;
  background: #f3f4f6;
  border-radius: 4px;
  overflow: hidden;
}
.da-bar-fill {
  height: 100%;
  border-radius: 4px;
  min-width: 2px;
  transition: width .3s ease;
}
.da-bar-value {
  min-width: 90px;
  font-size: 12.5px;
  font-weight: 600;
  color: #6b7280;
  white-space: nowrap;
}

/* Detail panel (expandable) */
.da-detail-panel {
  border-top: 1px solid #e5e7eb;
  margin-top: 14px;
  padding-top: 14px;
}
.da-detail-title {
  font-size: 13px;
  font-weight: 600;
  color: #6b7280;
  margin: 0 0 10px;
}

/* ?? Summary tables ?? */
.da-table-wrap {
  overflow-x: auto;
}
.da-summary-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.da-summary-table th,
.da-summary-table td {
  padding: 8px 12px;
  text-align: left;
  border-bottom: 1px solid #f3f4f6;
}
.da-summary-table thead th {
  font-weight: 700;
  color: #374151;
  background: #f9fafb;
  border-bottom: 2px solid #e5e7eb;
  font-size: 12px;
  text-transform: none;
  letter-spacing: 0.01em;
}
.da-summary-table tbody td {
  color: #4b5563;
}
.da-summary-table tbody tr:hover {
  background: #f9fafb;
}

/* ?? Dashboard Builder ?? */
.admin-dashboard-builder-panel {
  max-width: 840px;
}

.admin-dashboard-builder-actions {
  align-items: center;
  display: flex;
  gap: 10px;
  margin-top: 18px;
}

.admin-dashboard-builder-preview-link {
  color: #344054;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.db-widget-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.db-widget-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #fff;
  border: 1.5px solid #d0d5dd;
  border-radius: 10px;
  transition: box-shadow .15s, border-color .15s, opacity .15s;
  cursor: grab;
  user-select: none;
}
.db-widget-card:hover {
  border-color: #6366f1;
  box-shadow: 0 2px 8px rgba(99,102,241,.12);
}
.db-widget-card--disabled {
  opacity: .5;
  background: #f9fafb;
  border-color: #e5e7eb;
}
.db-widget-card--disabled:hover {
  border-color: #d0d5dd;
  box-shadow: none;
}
.db-widget-card--dragging {
  opacity: .35;
  border-style: dashed;
}

.db-widget-grip {
  font-size: 20px;
  color: #9ca3af;
  cursor: grab;
  flex-shrink: 0;
  line-height: 1;
  letter-spacing: 1px;
}

.db-widget-info {
  flex: 1;
  min-width: 0;
}
.db-widget-name {
  font-size: 14px;
  font-weight: 700;
  color: #1f2937;
  line-height: 1.3;
}
.db-widget-desc {
  font-size: 12px;
  color: #6b7280;
  margin-top: 2px;
  line-height: 1.35;
}

.db-widget-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

/* Toggle switch */
.db-widget-toggle {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 22px;
  cursor: pointer;
}
.db-widget-toggle input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}
.db-widget-toggle-slider {
  position: absolute;
  inset: 0;
  background: #d1d5db;
  border-radius: 22px;
  transition: background .2s;
}
.db-widget-toggle-slider::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 2px;
  width: 18px;
  height: 18px;
  background: #fff;
  border-radius: 50%;
  transition: transform .2s;
  box-shadow: 0 1px 3px rgba(0,0,0,.15);
}
.db-widget-toggle input:checked + .db-widget-toggle-slider {
  background: var(--app-action-primary, #2ec5ff);
}
.db-widget-toggle input:checked + .db-widget-toggle-slider::before {
  transform: translateX(18px);
}

/* Move buttons */
.db-move-btn {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  border: 1px solid #d1d5db;
  background: #f9fafb;
  font-size: 12px;
  color: #374151;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, border-color .15s;
  padding: 0;
}
.db-move-btn:hover:not(:disabled) {
  background: #e5e7eb;
  border-color: #9ca3af;
}
.db-move-btn:disabled {
  opacity: .35;
  cursor: not-allowed;
}

/* ?? In-app help (floating bubble + slide-over) ?? */
.in-app-help-bubble {
  position: fixed;
  bottom: var(--help-bottom, 18px);
  left: var(--help-left, auto);
  right: var(--help-right, 18px);
  z-index: 10060;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 1px solid #dbe5ef;
  border-radius: 50%;
  background: #ffffff;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16);
  transition: background 0.15s, border-color 0.15s, transform 0.15s, box-shadow 0.15s, opacity 0.15s, width 0.15s;
}
.in-app-help-bubble:hover {
  background: #eef4ff;
  border-color: #c7d7fe;
  transform: scale(1.04);
  box-shadow: 0 6px 22px rgba(15, 23, 42, 0.18);
}
.in-app-help-bubble:focus {
  outline: 2px solid #2ec5ff;
  outline-offset: 3px;
}
.in-app-help-bubble--open {
  background: #eef4ff;
  border-color: #84adff;
}
.in-app-help-bubble--hidden {
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px) scale(0.94);
}
.in-app-help-bubble--collapsed {
  width: 34px;
  height: 34px;
}
.in-app-help-bubble--collapsed .in-app-help-bubble__mark {
  font-size: 16px;
}

.in-app-help-bubble__mark {
  color: var(--keshero-teal);
  font-size: 20px;
  font-weight: 900;
  line-height: 1;
}
.in-app-help-bubble__label {
  color: var(--keshero-teal);
  display: none;
  font-size: 13px;
  font-weight: 800;
}
.in-app-help-bubble:hover,
.in-app-help-bubble:focus-visible {
  border-radius: 999px;
  width: 82px;
}
.in-app-help-bubble:hover .in-app-help-bubble__label,
.in-app-help-bubble:focus-visible .in-app-help-bubble__label {
  display: inline;
}

.in-app-help-bubble__bars {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 20px;
  pointer-events: none;
}
.in-app-help-bubble__bars span {
  display: block;
  height: 2px;
  background: #1a4d2e;
  border-radius: 1px;
}

body.in-app-help-open {
  overflow: hidden;
}

.in-app-help-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10040;
  background: rgba(15, 23, 42, 0.35);
  cursor: pointer;
}

.in-app-help-backdrop[hidden],
.in-app-help-panel[hidden] {
  display: none;
}

.ezer-assistant-backdrop[hidden],
.ezer-clippy[hidden] {
  display: none !important;
}

.ezer-assistant-backdrop {
  background: rgba(15, 23, 42, 0.2);
  inset: 0;
  position: fixed;
  z-index: 10040;
}

.ezer-launcher {
  align-items: center;
  background: linear-gradient(
    145deg,
    var(--keshero-violet-glow, #b57cff) 0%,
    var(--keshero-purple, #8a2be2) 55%,
    #6b1fb8 100%
  );
  border: 0;
  border-radius: 50%;
  bottom: 18px;
  box-shadow: 0 10px 24px rgba(138, 43, 226, 0.35);
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  height: 48px;
  justify-content: center;
  padding: 0;
  position: fixed;
  right: 18px;
  transition: transform 0.14s ease, box-shadow 0.14s ease, background 0.14s ease;
  width: 48px;
  z-index: 10045;
}

/* The Setup Checklist sits horizontally to the left of Ezer. The general
   in-app Help bubble still uses vertical stacking when it is visible. */
body:has(.in-app-help-bubble:not(.in-app-help-bubble--hidden)) .ezer-launcher {
  bottom: calc(18px + var(--app-help-launcher-size, 40px) + 12px);
}

.ezer-launcher:hover,
.ezer-launcher:focus-visible {
  box-shadow: 0 0 0 3px rgba(181, 124, 255, 0.35), 0 12px 28px rgba(138, 43, 226, 0.4);
  outline: none;
  transform: scale(1.05);
}

.ezer-launcher[aria-expanded="true"] {
  background: linear-gradient(145deg, var(--keshero-purple, #8a2be2) 0%, #6b1fb8 100%);
}

.ezer-launcher__paw {
  display: block;
  fill: currentColor;
  height: 28px;
  width: 28px;
}

.ezer-clippy {
  align-items: flex-end;
  bottom: calc(18px + 48px + 14px);
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: min(360px, calc(100vw - 28px));
  position: fixed;
  right: 18px;
  z-index: 10050;
}

body:has(.in-app-help-bubble:not(.in-app-help-bubble--hidden)) .ezer-clippy {
  bottom: calc(18px + var(--app-help-launcher-size, 40px) + 12px + 48px + 14px);
}

.ezer-clippy__mascot {
  display: block;
  filter: drop-shadow(0 8px 14px rgba(15, 23, 42, 0.18));
  height: auto;
  margin: 0 4px -18px auto;
  max-width: 118px;
  pointer-events: none;
  position: relative;
  width: 118px;
  z-index: 1;
}

.ezer-clippy__bubble {
  background: var(--app-surface, #fff);
  border: 1px solid var(--app-border, #d0d5dd);
  border-radius: 16px;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
  display: grid;
  gap: 8px;
  padding: 14px 16px 16px;
  position: relative;
  z-index: 2;
}

.ezer-clippy__bubble::after {
  background: var(--app-surface, #fff);
  border-bottom: 1px solid var(--app-border, #d0d5dd);
  border-right: 1px solid var(--app-border, #d0d5dd);
  bottom: -7px;
  content: "";
  height: 12px;
  position: absolute;
  right: 28px;
  transform: rotate(45deg);
  width: 12px;
}

.ezer-clippy__close {
  align-items: center;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--app-border, #d0d5dd);
  border-radius: 999px;
  color: #475467;
  cursor: pointer;
  display: inline-flex;
  font-size: 18px;
  font-weight: 700;
  height: 28px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 28px;
  z-index: 3;
}

.ezer-clippy__close:hover,
.ezer-clippy__close:focus-visible {
  background: #f8fafc;
  color: #101828;
  outline: 2px solid #2ec5ff;
  outline-offset: 2px;
}

.ezer-clippy__title {
  color: var(--app-heading, #101828);
  font-size: 16px;
  font-weight: 800;
  margin: 0;
}

.ezer-clippy__lede,
.ezer-clippy__note {
  color: var(--app-muted, #667085);
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.ezer-clippy__note {
  background: #eff8ff;
  border: 1px solid #b2ddff;
  border-radius: 8px;
  color: #175cd3;
  padding: 8px 10px;
}

.ezer-clippy__composer {
  margin: 4px 0 0;
}

body.ezer-open .setup-checklist-launcher,
body.ezer-open .in-app-help-bubble {
  opacity: 0.35;
  pointer-events: none;
}

@media (max-width: 760px) {
  .ezer-launcher {
    bottom: 16px;
    right: 12px;
  }
  .ezer-clippy {
    bottom: calc(16px + 48px + 12px);
    right: 12px;
  }
}

.in-app-help-panel {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10050;
  width: min(420px, 100vw);
  height: 100vh;
  height: 100dvh;
  background: #fff;
  box-shadow: -8px 0 24px rgba(15, 23, 42, 0.12);
  display: flex;
  flex-direction: column;
  border-left: 1px solid #e2e8f0;
}

.in-app-help-panel__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid #e2e8f0;
  flex-shrink: 0;
}

.in-app-help-panel__title {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a;
}
.in-app-help-panel__header p {
  color: #667085;
  font-size: 13px;
  line-height: 1.35;
  margin: 4px 0 0;
}

.in-app-help-panel__close {
  width: auto;
  min-width: 60px;
  height: 36px;
  padding: 0 12px;
  border: none;
  background: transparent;
  font-size: 0.75rem;
  font-weight: 800;
  line-height: 1;
  color: #64748b;
  cursor: pointer;
  border-radius: 6px;
}
.in-app-help-panel__close:hover {
  background: #f1f5f9;
  color: #0f172a;
}

.in-app-help-panel__body {
  padding: 18px;
  overflow-y: auto;
  flex: 1;
  font-size: 14px;
  color: #475569;
  line-height: 1.5;
}

.help-guide-section {
  border-bottom: 1px solid #e4e7ec;
  margin: 0 0 14px;
  padding: 0 0 14px;
}

.help-guide-section:last-child {
  border-bottom: 0;
  margin-bottom: 0;
}

.help-guide-section h3 {
  color: #0f172a;
  font-size: 15px;
  margin: 0 0 6px;
}

.help-guide-section p {
  color: #475467;
  line-height: 1.45;
  margin: 0;
}
.help-guide-section--hero {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  padding: 12px;
}
.help-search {
  display: grid;
  gap: 6px;
  margin: 0 0 14px;
}
.help-search span {
  color: #344054;
  font-size: 12px;
  font-weight: 800;
}
.help-search input {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  font: inherit;
  min-height: 38px;
  padding: 8px 10px;
}
.help-topic-list {
  display: grid;
  gap: 8px;
}
.help-topic-card {
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 10px;
}
.help-topic-card[hidden] {
  display: none;
}
.help-topic-card__toggle {
  align-items: flex-start;
  background: transparent;
  border: 0;
  color: #101828;
  cursor: pointer;
  display: flex;
  font: inherit;
  gap: 10px;
  justify-content: space-between;
  padding: 0;
  text-align: left;
  width: 100%;
}
.help-topic-card__toggle small {
  color: #667085;
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-top: 2px;
}
.help-topic-card > p {
  font-size: 13px;
  margin-top: 6px;
}
.help-topic-card__long {
  border-top: 1px solid #e4e7ec;
  color: #344054;
  font-size: 13px;
  margin-top: 8px;
  padding-top: 8px;
  white-space: pre-line;
}
.help-topic-card__example {
  background: #f8fafc;
  border-radius: 6px;
  color: #475467;
  font-size: 12.5px;
  line-height: 1.45;
  margin: 10px 0 0;
  padding: 8px 10px;
}
.help-topic-card__example-label {
  color: #1d2939;
  font-weight: 700;
  margin-right: 4px;
}
.help-topic-card__link {
  margin: 10px 0 0;
}
.help-topic-card__link a {
  color: #087db0;
  font-weight: 700;
  text-decoration: none;
}
.help-topic-card__link a:hover {
  text-decoration: underline;
}
.help-topic-card__image-wrap {
  margin: 12px 0 0;
}
.help-topic-card__image {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  display: block;
  height: auto;
  max-width: 100%;
}
.inline-help-button {
  align-items: center;
  appearance: none;
  background: linear-gradient(180deg, #ffffff 0%, #eef6ff 100%);
  border: 1px solid #b2ddff;
  border-radius: 999px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  color: #0b63ce;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-family: inherit;
  font-size: 13px;
  font-weight: 900;
  height: 24px;
  justify-content: center;
  margin-left: 6px;
  padding: 0;
  position: relative;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease, transform 0.15s ease;
  vertical-align: middle;
  width: 24px;
  -webkit-appearance: none;
}
.inline-help-button:hover,
.inline-help-button:focus-visible {
  background: #e0f2fe;
  border-color: #60a5fa;
  box-shadow: 0 4px 12px rgba(14, 116, 199, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  color: #075985;
  outline: 2px solid rgba(37, 99, 235, 0.35);
  outline-offset: 2px;
  transform: translateY(-1px);
}

.layout-builder-widget__scroll .inline-help-button:hover,
.layout-builder-widget__scroll .inline-help-button:focus-visible {
  outline-offset: -2px;
  transform: none;
}
@media (max-width: 720px) {
  .app-topnav__button--help {
    display: none;
  }
  .in-app-help-panel {
    width: 100vw;
  }
}

/* ?? Talent & succession planning workspace ????????????????????????????? */
.succession-workspace-body {
  background: #f8fafc;
}

/* Full-bleed within body gutters (same as cycle grid / other wide admin pages). */
.succession-subhead,
.succession-panel,
.succession-workspace-filters,
.succession-promotion-signals {
  box-sizing: border-box;
  max-width: none;
  width: 100%;
}

.succession-subhead {
  margin: 0 0 10px;
  padding: 2px 0 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  border-bottom: 1px solid #e2e8f0;
}

.succession-tabs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  width: 100%;
}

.succession-tab {
  padding: 6px 12px;
  border: 1px solid #cbd5e1;
  background: #fff;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  color: #344054;
  line-height: 1.2;
}

.succession-tab:hover {
  background: #f8fafc;
  border-color: #94a3b8;
}

.succession-tab--active {
  border-color: var(--app-action-primary-border, #14a8d4);
  background: var(--app-action-primary, #2ec5ff);
  color: #fff;
  font-weight: 800;
}

.succession-tab--active:hover {
  background: var(--app-action-primary-hover, #1aa6d6);
  border-color: var(--app-action-primary-border, #14a8d4);
  color: #fff;
}

.succession-panel {
  display: none;
  margin: 0;
  padding: 0 0 24px;
}

.succession-panel--active {
  display: block;
}

.succession-panel > h3 {
  margin: 4px 0 6px;
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f172a;
}

.succession-section-title {
  margin: 12px 0 6px;
  font-size: 1rem;
  font-weight: 800;
  color: #0f172a;
  border-left: 3px solid var(--app-action-primary-border, #14a8d4);
  padding-left: 10px;
}

.succession-hint {
  color: #64748b;
  font-size: 13px;
  margin: 0 0 10px;
  max-width: none;
  line-height: 1.45;
}

.succession-table-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.succession-table-head .succession-hint {
  margin: 0;
}

.succession-role-owner-line {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  position: relative;
}

.succession-role-alert {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  cursor: help;
}

.succession-role-alert-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: var(--app-action-danger);
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.succession-role-alert-popover {
  position: absolute;
  left: 22px;
  top: 50%;
  transform: translateY(-50%);
  min-width: 240px;
  max-width: 320px;
  padding: 10px 12px;
  border: 1px solid #fda29b;
  border-radius: 10px;
  background: #fff5f4;
  color: #7a271a;
  box-shadow: 0 12px 24px rgba(16, 24, 40, 0.12);
  z-index: 20;
  display: none;
  white-space: normal;
}

.succession-role-alert:hover .succession-role-alert-popover,
.succession-role-alert:focus .succession-role-alert-popover,
.succession-role-alert:focus-within .succession-role-alert-popover {
  display: block;
}

.succession-role-alert-popover strong {
  display: block;
  margin-bottom: 6px;
}

.succession-role-alert-popover ul {
  margin: 0 0 0 16px;
  padding: 0;
}

.succession-org-wrap {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 12px 14px 16px;
  margin-bottom: 12px;
}

.succession-org-wrap .succession-section-title {
  margin-top: 0;
}

.succession-workspace-filters {
  display: block;
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
}

.succession-workspace-filters__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.succession-workspace-filters__title {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
}

.succession-workspace-filters__rows {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.succession-workspace-filter-field {
  display: grid;
  gap: 4px;
  max-width: 240px;
  min-width: 180px;
}

.succession-workspace-filter-field__label {
  color: #0f172a;
  font-size: 12px;
  font-weight: 700;
}

.succession-workspace-filter-field .ks-dropdown {
  width: 100%;
}

.succession-job-level-filter {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}

.succession-job-level-filter__label {
  font-size: 13px;
  font-weight: 700;
}

.succession-job-level-filter .ks-dropdown {
  min-width: 160px;
}

.succession-workspace-filter {
  min-width: 180px;
  max-width: 240px;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  background: #fcfcfd;
}

.succession-workspace-filters:not(.is-expanded) .succession-workspace-filter {
  min-height: 40px;
}

.succession-workspace-filter summary {
  cursor: pointer;
  list-style: none;
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
}

.succession-workspace-filter summary::-webkit-details-marker {
  display: none;
}

.succession-workspace-filter__options {
  max-height: 200px;
  overflow: auto;
  padding: 6px 12px 10px;
}

.succession-workspace-filter__option {
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
}

.succession-workspace-filter__option:has(input[data-select-all-checkbox]) {
  font-weight: 900;
  margin-bottom: 3px;
}

.succession-workspace-filter__option input {
  accent-color: var(--app-checkbox-checked-bg, #12b76a);
  height: 16px;
  margin: 0;
  min-height: 0;
  width: 16px;
}

.succession-workspace-filter__option span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.succession-workspace-filters__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
}

.succession-workspace-filters__clear {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.succession-org-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
}

.succession-org-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.succession-org-filter {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #344054;
}

.succession-org-filter select {
  min-width: 150px;
}

.succession-org-size-toggle {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  background: #ffffff;
  color: #111827;
  cursor: pointer;
}

.succession-org-size-toggle:hover {
  background: #f8fafc;
}

.succession-org-size-toggle__icon {
  position: relative;
  display: inline-block;
  width: 18px;
  height: 18px;
}

.succession-org-size-toggle__icon--collapse {
  display: none;
}

.succession-org-size-toggle.is-expanded .succession-org-size-toggle__icon--expand {
  display: none;
}

.succession-org-size-toggle.is-expanded .succession-org-size-toggle__icon--collapse {
  display: inline-block;
}

.succession-org-size-toggle__glyph {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
  color: currentColor;
}

.succession-org-size-toggle__glyph--top {
  top: 0;
}

.succession-org-size-toggle__glyph--bottom {
  bottom: 0;
}

.succession-org-chart {
  overflow-x: hidden;
  overflow-y: auto;
  padding: 8px 0;
  max-height: 460px;
}

.succession-org-wrap.is-expanded .succession-org-chart {
  max-height: 78vh;
}

.succession-org-columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  align-items: start;
}

.succession-org-columns--filtered {
  grid-template-columns: minmax(0, 1fr);
}

.succession-org-group {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 12px;
  min-width: 0;
}

.succession-org-group--filtered {
  width: 100%;
}

.succession-org-group-title {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 10px;
  text-align: center;
}

.succession-org-level {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: flex-start;
  justify-items: stretch;
}

.succession-org-level--filtered {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.succession-org-level--scroll {
  max-height: 420px;
  overflow-y: auto;
  padding-right: 4px;
}

.succession-org-node {
  width: 100%;
  min-width: 0;
  max-width: none;
  padding: 9px 10px;
  border: 2px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.succession-org-node:focus {
  outline: 2px solid var(--app-success);
  outline-offset: 2px;
}

.succession-org-node--highlight {
  box-shadow: 0 0 0 3px var(--keshero-light-green);
}

.succession-org-node-title {
  font-weight: 700;
  font-size: 14px;
  color: #0f172a;
}

.succession-org-node-meta {
  font-size: 12px;
  color: #475569;
  margin-top: 4px;
}

.succession-org-node-risk,
.succession-org-node-ready {
  font-size: 11px;
  margin-top: 6px;
  color: #334155;
}

.succession-org-children {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px dashed #e2e8f0;
}

.succession-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 12px;
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  font-size: 13px;
}

.succession-toolbar > label {
  display: grid;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  color: #475467;
}

.succession-toolbar > label select,
.succession-toolbar > label input {
  font-weight: 400;
  color: #101828;
}

.succession-save-status {
  align-self: center;
  font-size: 13px;
  color: var(--app-success);
  min-height: 1.2em;
  margin-left: auto;
}

.succession-save-status.is-error {
  color: #b42318;
  font-weight: 700;
}

.succession-table-scroll {
  overflow-x: auto;
  overflow-y: auto;
  width: 100%;
  max-width: 100%;
  max-height: 70vh;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  scrollbar-gutter: stable;
}

.succession-table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.succession-table th,
.succession-table td {
  border-bottom: 1px solid #e2e8f0;
  padding: 8px 10px;
  vertical-align: top;
  text-align: left;
}

.succession-table th {
  background: #f1f5f9;
  font-weight: 600;
  position: sticky;
  top: 0;
  z-index: 2;
  box-shadow: 0 1px 0 #d0d5dd;
}

/* Succession row fills come from inline Settings CSS on the Talent Planning page. */

.succession-row-dev {
  background: #f8fafc;
}

.succession-row-addchild {
  background: #f1f5f9;
}

.succession-cell-indent {
  padding-left: 22px !important;
}

.succession-inline,
.succession-inline.wide {
  width: 100%;
  max-width: 160px;
  box-sizing: border-box;
  padding: 4px 6px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: 13px;
}

.succession-inline.wide {
  max-width: 280px;
}

.succession-inline.succession-inline-type {
  max-width: 160px;
  min-width: 124px;
}

.succession-col-critical {
  min-width: 92px;
  width: 92px;
}

.succession-col-order {
  min-width: 104px;
  width: 104px;
}

.succession-col-readiness {
  min-width: 124px;
  width: 124px;
}

.succession-col-grouping {
  min-width: 136px;
  width: 136px;
}

.succession-col-actions {
  min-width: 120px;
  width: 120px;
}

.succession-table th:nth-child(2),
.succession-table td:nth-child(2) {
  min-width: 92px;
  width: 92px;
}

.succession-table th:nth-child(5),
.succession-table td:nth-child(5) {
  min-width: 110px;
}

.succession-table th:nth-child(6),
.succession-table td:nth-child(6) {
  min-width: 150px;
}

.succession-ta {
  width: 100%;
  min-height: 48px;
  max-width: 420px;
  box-sizing: border-box;
  padding: 6px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: 13px;
  resize: vertical;
}

.succession-table th:nth-child(8),
.succession-table td:nth-child(8) {
  min-width: 104px;
  width: 104px;
}

.succession-table th:nth-child(9),
.succession-table td:nth-child(9) {
  min-width: 124px;
  width: 124px;
}

.succession-table th:nth-child(10),
.succession-table td:nth-child(10) {
  min-width: 136px;
  width: 136px;
}

.succession-table th:nth-child(11),
.succession-table td:nth-child(11) {
  width: 124px;
  min-width: 124px;
}

.succession-table th:nth-child(12),
.succession-table td:nth-child(12) {
  width: 280px;
  min-width: 280px;
}

.succession-table th:nth-child(13),
.succession-table td:nth-child(13) {
  width: 150px;
  min-width: 150px;
}

.succession-table th:nth-child(14),
.succession-table td:nth-child(14) {
  min-width: 120px;
  width: 120px;
}

.succession-readonly {
  color: #475569;
}

.succession-owner-extras {
  font-size: 13px;
  text-align: right;
}

.succession-inline-label {
  margin-right: 12px;
}

.succession-row-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.button-primary,
.button-small,
.button-danger-small,
.button-add-small {
  align-items: center;
  border: 1px solid var(--app-border-soft);
  border-radius: var(--app-radius-control);
  box-sizing: border-box;
  display: inline-flex;
  gap: 5px;
  justify-content: center;
  min-height: var(--app-control-height, 38px);
  padding: 0 12px;
  background: var(--app-action-secondary);
  color: #344054;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.1;
  text-decoration: none;
  transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, color 0.14s ease, transform 0.14s ease;
  user-select: none;
  white-space: nowrap;
}

.button-primary {
  background: var(--app-action-primary);
  color: #fff;
  border-color: var(--app-action-primary-border);
  box-shadow: 0 8px 22px rgba(46, 197, 255, 0.22), 0 0 0 1px rgba(111, 227, 255, 0.12);
}

.button-small {
  background: var(--app-action-secondary);
  font-size: 12px;
}

.button-primary:hover,
.button-small:hover,
.button-danger-small:hover,
.button-add-small:hover {
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.09);
  transform: translateY(-1px);
}

.button-primary:hover {
  background: var(--app-action-primary-hover);
}

.button-small:hover {
  background: var(--app-action-secondary-hover);
  border-color: #cbd5e1;
  color: var(--keshero-teal);
}

/* Keep primary fill when both size + primary classes are present
   (e.g. Search via action_buttons.js); .button-small alone would
   force a white secondary background over white primary text. */
.button-small.button-primary {
  background: var(--app-action-primary);
  border-color: var(--app-action-primary-border);
  box-shadow: 0 8px 22px rgba(46, 197, 255, 0.22), 0 0 0 1px rgba(111, 227, 255, 0.12);
  color: #fff;
}

.button-small.button-primary:hover {
  background: var(--app-action-primary-hover);
  border-color: var(--app-action-primary-border);
  color: #fff;
}

.button-small.button-add-small {
  background: var(--app-success-surface);
  border-color: var(--app-success-border);
  color: var(--app-success-fg);
}

.button-small.button-add-small:hover {
  background: var(--app-success-surface-hover);
  border-color: var(--app-success-border-strong);
  color: var(--app-success-fg-hover);
}

.button-danger-small {
  color: var(--app-action-danger);
  border-color: var(--keshero-light-red);
  background: var(--app-danger-surface);
}

.button-danger-small:hover {
  background: #ffe8ea;
  color: #c41e2d;
  border-color: var(--app-action-danger);
}

.button-add-small {
  background: var(--app-success-surface);
  border-color: var(--app-success-border);
  color: var(--app-success-fg);
  font-size: 12px;
}

.button-add-small:hover {
  background: var(--app-success-surface-hover);
  border-color: var(--app-success-border-strong);
  color: var(--app-success-fg-hover);
}

.button-primary:focus-visible,
.button-small:focus-visible,
.button-danger-small:focus-visible,
.button-add-small:focus-visible {
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  outline: none;
}

.button-primary:disabled,
.button-small:disabled,
.button-danger-small:disabled,
.button-add-small:disabled {
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.52;
  transform: none;
}

.succession-expand {
  align-items: center;
  background: transparent;
  border: 0;
  color: #475467;
  cursor: pointer;
  display: inline-flex;
  height: 22px;
  justify-content: center;
  padding: 0;
  width: 22px;
}
.succession-expand.app-disclosure-chevron[data-expanded="1"]::before,
.succession-expand.app-disclosure-chevron[aria-expanded="true"]::before {
  transform: rotate(45deg);
}

.succession-dev-panel {
  padding: 12px 16px !important;
}

.succession-dev-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.succession-dev-grid label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: #475569;
}

.succession-dev-grid textarea {
  min-height: 56px;
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid #cbd5e1;
}

.succession-job-level-filter {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.succession-job-level-filter__label {
  font-size: 13px;
  color: #475569;
  font-weight: 600;
}

.succession-job-level-filter__toggle {
  min-width: 120px;
  justify-content: space-between;
}

.succession-job-level-filter__menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 20;
  min-width: 180px;
  max-width: 240px;
  max-height: 240px;
  overflow: auto;
  padding: 10px;
}

.succession-job-level-filter__options {
  display: grid;
  gap: 8px;
}

.succession-job-level-filter__option {
  font-size: 13px;
}

.succession-job-level-filter__empty {
  font-size: 12px;
  color: #64748b;
}

.succession-bench-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--succession-kpi-width, 170px), var(--succession-kpi-width, 170px)));
  grid-auto-flow: row;
  align-items: stretch;
  gap: 12px;
  justify-content: start;
  margin-bottom: 14px;
}

.succession-bench-grid > * {
  max-width: 100%;
  min-width: 0;
}

.succession-bench-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}

.succession-bench-head h3 {
  margin: 0;
}

.succession-bench-head__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.succession-bench-customize {
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #ffffff;
}

.succession-bench-customize__title {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 10px;
}

.succession-bench-customize__options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px 12px;
}

.succession-bench-customize__option {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #334155;
}

.succession-bench-customize__actions {
  margin-top: 12px;
}

.succession-kpi {
  position: relative;
  min-width: 0;
  min-height: var(--succession-kpi-height, 92px);
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 14px;
  box-sizing: border-box;
}

.succession-kpi-label {
  font-size: 12px;
  color: #64748b;
}

.succession-kpi-value {
  font-size: 1.6rem;
  font-weight: 700;
  color: #0f172a;
}

.succession-bench-visual-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-flow: row;
  grid-auto-rows: minmax(220px, auto);
  gap: 14px;
  align-items: start;
}

.succession-bench-visual-grid > * {
  max-width: 100%;
  min-width: 0;
}

.succession-bench-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  height: 100%;
  box-sizing: border-box;
}

.succession-bench-item {
  position: relative;
}

.succession-bench-item.is-dragging {
  opacity: 0.55;
}

.succession-bench-item.is-drop-target {
  outline: 2px dashed #2ec5ff;
  outline-offset: 2px;
}

.succession-bench-item--visual {
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

.succession-bench-item--visual.is-collapsed .succession-bench-item__body > :not(.succession-bench-card) {
  display: none;
}

.succession-bench-item--visual.is-collapsed .succession-bench-card > :not(.succession-bench-card__header):not(.succession-bench-section-title) {
  display: none;
}

.succession-bench-item--visual.is-collapsed .succession-bench-resize {
  display: none;
}

.succession-bench-item__body {
  height: 100%;
  max-width: 100%;
  min-width: 0;
}

.succession-bench-item__body > * {
  max-width: 100%;
  min-width: 0;
}

.succession-bench-toggle-visual {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 1px solid #94a3b8;
  background: rgba(255, 255, 255, 0.98);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.succession-bench-item--visual .succession-bench-card {
  position: relative;
}

.succession-bench-item--visual .succession-bench-card__header,
.succession-bench-item--visual .succession-bench-section-title {
  padding-left: 34px;
}

.succession-bench-item--visual .succession-bench-card__header {
  min-height: 24px;
}

.succession-bench-toggle-visual__dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #0f172a;
}

.succession-bench-item--visual.is-collapsed .succession-bench-toggle-visual__dot {
  background: #ffffff;
  box-shadow: inset 0 0 0 2px #0f172a;
}

.succession-bench-move {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  border: 1px solid #cbd5e1;
  background: rgba(255, 255, 255, 0.96);
  color: #334155;
  border-radius: 999px;
  width: 28px;
  height: 28px;
  cursor: grab;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.15s ease;
}

.succession-bench-item:hover .succession-bench-move,
.succession-bench-item:focus-within .succession-bench-move {
  opacity: 1;
}

.succession-bench-move:active {
  cursor: grabbing;
}

.succession-bench-item--metric .succession-kpi-label,
.succession-bench-item--metric .succession-kpi-value {
  padding-right: 24px;
}

.succession-bench-resize {
  position: absolute;
  right: 6px;
  bottom: 6px;
  width: 18px;
  height: 18px;
  cursor: nwse-resize;
  opacity: 0;
  transition: opacity 0.15s ease;
}

.succession-kpi-resize {
  appearance: none;
  -webkit-appearance: none;
  position: absolute;
  right: 6px;
  bottom: 6px;
  z-index: 2;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: transparent;
  cursor: nwse-resize;
  display: block;
  font-size: 0;
  line-height: 0;
  opacity: 0;
  transition: opacity 0.15s ease;
}

.succession-kpi-resize::before {
  content: "";
  position: absolute;
  inset: 2px;
  background:
    linear-gradient(135deg, transparent 0 46%, #94a3b8 46% 54%, transparent 54% 100%),
    linear-gradient(135deg, transparent 0 62%, #94a3b8 62% 70%, transparent 70% 100%),
    linear-gradient(135deg, transparent 0 78%, #94a3b8 78% 86%, transparent 86% 100%);
}

.succession-kpi:hover .succession-kpi-resize,
.succession-kpi:focus-within .succession-kpi-resize {
  opacity: 1;
}

.succession-bench-resize::before {
  content: "";
  position: absolute;
  inset: 2px;
  background:
    linear-gradient(135deg, transparent 0 46%, #94a3b8 46% 54%, transparent 54% 100%),
    linear-gradient(135deg, transparent 0 62%, #94a3b8 62% 70%, transparent 70% 100%),
    linear-gradient(135deg, transparent 0 78%, #94a3b8 78% 86%, transparent 86% 100%);
}

.succession-bench-item--visual:hover .succession-bench-resize,
.succession-bench-item--visual:focus-within .succession-bench-resize {
  opacity: 1;
}

.succession-bench-card__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.succession-bench-card__title,
.succession-bench-section-title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
}

.succession-bench-card__meta {
  font-size: 12px;
  color: #64748b;
  white-space: nowrap;
}

.succession-bench-section-title {
  margin-bottom: 10px;
}

.succession-bench-toggle {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 12px;
  color: #475569;
}

.succession-bench-toggle label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.succession-bench-donut-layout {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(180px, 1fr);
  gap: 16px;
  align-items: center;
}

.succession-bench-donut {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  gap: 10px;
}

.succession-bench-donut__view,
.succession-bench-legend__view {
  width: 100%;
}

.succession-bench-donut__view.is-hidden,
.succession-bench-legend__view.is-hidden,
.is-hidden {
  display: none;
}

.succession-bench-donut__view {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 250px;
}

.succession-bench-donut__svg {
  width: 210px;
  height: 210px;
}

.succession-bench-donut__center {
  position: absolute;
  display: grid;
  place-items: center;
  text-align: center;
  gap: 3px;
}

.succession-bench-donut__value {
  font-size: 1.65rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1;
}

.succession-bench-donut__label {
  font-size: 12px;
  color: #64748b;
}

.succession-bench-legend {
  margin-top: 0;
  align-self: stretch;
  display: grid;
  align-content: center;
}

.succession-bench-legend__row {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  color: #334155;
  padding: 4px 0;
}

.succession-bench-legend__swatch {
  width: 12px;
  height: 12px;
  border-radius: 999px;
}

.succession-bench-legend__text {
  min-width: 0;
}

.succession-bench-legend__count {
  font-weight: 600;
  color: #0f172a;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .succession-bench-donut-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .succession-bench-legend {
    margin-top: 6px;
  }

}

.succession-bench-bars,
.succession-bench-criticality {
  display: grid;
  gap: 10px;
}

.succession-bench-bars__row,
.succession-bench-criticality__row {
  display: grid;
  gap: 6px;
}

.succession-bench-bars__top,
.succession-bench-criticality__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: #334155;
}

.succession-bench-bars__top strong,
.succession-bench-criticality__header strong {
  color: #0f172a;
}

.succession-bench-bars__track,
.succession-bench-criticality__track {
  display: flex;
  width: 100%;
  min-height: 10px;
  background: #e2e8f0;
  border-radius: 999px;
  overflow: hidden;
}

.succession-bench-bars__fill,
.succession-bench-criticality__segment {
  display: block;
  min-height: 10px;
}

.succession-bench-criticality__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 11px;
  color: #475569;
}

.succession-bench-criticality__legend-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.succession-bench-criticality__legend-swatch {
  width: 10px;
  height: 10px;
  border-radius: 999px;
}

.succession-bench-table-scroll,
.succession-bench-heatmap-scroll {
  overflow: auto;
  max-width: 100%;
  min-width: 0;
}

.succession-bench-table {
  width: 100%;
  min-width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  table-layout: fixed;
}

.succession-bench-table th,
.succession-bench-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #e2e8f0;
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
  word-break: normal;
}

.succession-bench-table th {
  background: #f8fafc;
  font-weight: 600;
  color: #334155;
}

.succession-link-button {
  appearance: none;
  border: 0;
  background: transparent;
  color: #34C38F;
  cursor: pointer;
  font-weight: 600;
  padding: 0;
  text-decoration: underline;
}

.succession-link-button:hover {
  color: #115e59;
}

.succession-bench-heatmap-note,
.succession-bench-heatmap-unplaced {
  font-size: 12px;
  color: #475569;
}

.succession-bench-heatmap-note {
  margin-bottom: 10px;
}

.succession-bench-heatmap-unplaced {
  margin-top: 10px;
}

.succession-bench-heatmap-table {
  width: 100%;
  min-width: 540px;
  border-collapse: collapse;
  table-layout: fixed;
}

.succession-bench-heatmap-table th,
.succession-bench-heatmap-table td {
  border: 1px solid #e2e8f0;
  padding: 8px;
  vertical-align: top;
}

.succession-bench-heatmap-table thead th {
  background: #f8fafc;
  font-size: 12px;
  color: #334155;
}

.succession-bench-heatmap-table tbody th {
  background: #f8fafc;
  width: 88px;
  min-width: 88px;
  font-size: 12px;
  color: #334155;
}

.succession-bench-heatmap-cell-title {
  font-size: 11px;
  color: #64748b;
  margin-bottom: 4px;
}

.succession-bench-heatmap-cell-count {
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 6px;
}

.succession-bench-heatmap-people {
  display: grid;
  gap: 4px;
}

.succession-bench-heatmap-person {
  font-size: 12px;
  color: #334155;
}

.succession-bench-heatmap-person span {
  color: #64748b;
}

.succession-bench-heatmap-person--empty {
  color: #94a3b8;
}

.succession-modal {
  position: fixed;
  inset: 0;
  z-index: 120;
}

.succession-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
}

.succession-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(720px, calc(100vw - 32px));
  max-height: min(80vh, 760px);
  margin: 8vh auto 0;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2);
  overflow: auto;
}

.succession-modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid #e2e8f0;
}

.succession-modal__header h4 {
  margin: 0;
  font-size: 16px;
  color: #0f172a;
}

.succession-modal__body {
  padding: 18px;
}

.succession-modal__dialog--org-role {
  width: min(860px, calc(100vw - 32px));
}

.succession-org-modal-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.succession-org-modal-summary div,
.succession-org-modal-successor__meta div,
.succession-org-modal-successor__gaps {
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
  padding: 10px 12px;
}

.succession-org-modal-summary span,
.succession-org-modal-successor__meta span,
.succession-org-modal-successor__gaps span {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}

.succession-org-modal-summary strong,
.succession-org-modal-successor__meta strong,
.succession-org-modal-successor__gaps strong {
  color: #0f172a;
  font-size: 13px;
}

.succession-org-modal-section {
  display: grid;
  gap: 12px;
}

.succession-org-modal-section h5 {
  margin: 0;
  font-size: 14px;
  color: #0f172a;
}

.succession-org-modal-successor {
  border: 1px solid #dbe5ef;
  border-radius: 12px;
  background: #fff;
  padding: 12px;
  display: grid;
  gap: 10px;
}

.succession-org-modal-successor__name {
  font-weight: 700;
  color: #0f172a;
}

.succession-org-modal-successor__meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 10px;
}

.succession-bench-dev-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}

.succession-bench-dev-label {
  font-size: 12px;
  color: #64748b;
  margin-bottom: 4px;
}

.succession-bench-dev-value {
  font-size: 13px;
  color: #0f172a;
  white-space: pre-wrap;
}

.succession-scenario-pre {
  background: #0f172a;
  color: #e2e8f0;
  padding: 16px;
  border-radius: 10px;
  overflow: auto;
  font-size: 12px;
  max-height: 400px;
}

.succession-history-list {
  font-size: 13px;
  color: #334155;
}

.succession-edit-intro {
  max-width: 1120px;
  margin: 16px auto 0;
}

.succession-saved-banner {
  margin-top: 10px;
  padding: 8px 12px;
  background: #dcfce7;
  border-radius: 8px;
  color: #166534;
  font-weight: 600;
}

.succession-edit-form {
  max-width: 1180px;
  margin: 0 auto;
  padding: 20px 0;
  gap: 18px;
}

.succession-edit-section {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.04);
  margin-bottom: 0;
  padding: 18px;
}

.succession-edit-section h3 {
  margin: 0 0 8px;
  font-size: 1.05rem;
  color: #0f172a;
}

/* Password field + in-field visibility control. */
.password-field {
  align-items: stretch;
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
  max-width: 100%;
  position: relative;
  vertical-align: middle;
}

.password-field--block {
  display: flex;
  width: 100%;
}

.password-field input[type="password"],
.password-field input[type="text"] {
  box-sizing: border-box;
  margin-bottom: 0;
  padding-right: 48px;
  width: 100%;
}

.password-field__show {
  align-items: center;
  color: #475467;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 500;
  gap: 6px;
  margin-top: 0;
  user-select: none;
}

.password-field__option-row {
  align-items: center;
  display: flex;
  height: var(--app-control-height, 38px);
  justify-content: center;
  position: absolute;
  right: 4px;
  top: 0;
  width: 40px;
  z-index: 1;
}

.password-field__option-row .login-form__save-password {
  order: 1;
}

.login-form .password-field--block {
  display: grid;
  gap: 4px;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto;
  justify-items: start;
}

.login-form .password-field--block > input[type="password"],
.login-form .password-field--block > input[type="text"] {
  grid-area: 1 / 1;
  justify-self: stretch;
  margin-top: 0;
  width: 100%;
}

.login-form .password-field--block > .password-field__option-row {
  align-self: stretch;
  grid-area: 1 / 1;
  height: auto;
  justify-self: end;
  position: relative;
  right: 0;
  top: auto;
  width: 40px;
}

.login-form .password-field--block > .login-form__save-password {
  align-items: center;
  display: inline-flex;
  grid-area: 2 / 1;
  justify-content: flex-start;
  justify-self: start;
  margin-inline: 0;
  margin-left: 4px;
  margin-top: 3px;
  max-width: max-content;
  text-align: left;
  width: auto;
}

.password-field__show-check {
  aspect-ratio: 1 / 1;
  box-sizing: border-box;
  cursor: pointer;
  flex: 0 0 var(--app-checkbox-size, 16px);
  height: var(--app-checkbox-size, 16px);
  max-height: var(--app-checkbox-size, 16px);
  max-width: var(--app-checkbox-size, 16px);
  min-height: var(--app-checkbox-size, 16px);
  min-width: var(--app-checkbox-size, 16px);
  padding: 0;
  width: var(--app-checkbox-size, 16px);
}

.password-field__option-row .password-field__show:not(.login-form__save-password) {
  background: transparent;
  border: 0;
  border-radius: 0;
  color: #344054;
  height: 100%;
  justify-content: center;
  margin-top: 0;
  padding: 0;
  position: relative;
  transition: color 140ms ease;
  width: 100%;
}

.password-field__option-row .password-field__show:not(.login-form__save-password):hover {
  background: transparent;
  border-color: transparent;
  color: #101828;
}

.password-field__option-row .password-field__show:not(.login-form__save-password):focus-within {
  border-color: transparent;
  box-shadow: none;
  color: var(--app-action-primary);
  outline: none;
}

.password-field__option-row .password-field__show-check:not([data-login-save-password]) {
  cursor: pointer;
  height: 100%;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 100%;
}

.password-field__visibility-icon {
  align-items: center;
  display: inline-flex;
  height: 18px;
  justify-content: center;
  pointer-events: none;
  width: 18px;
}

.password-field__eye {
  fill: none;
  height: 18px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 18px;
}

.password-field__eye--visible {
  display: none;
}

.password-field__show-check:checked ~ .password-field__visibility-icon .password-field__eye--hidden {
  display: none;
}

.password-field__show-check:checked ~ .password-field__visibility-icon .password-field__eye--visible {
  display: block;
}

.account-security-page {
  box-sizing: border-box;
  margin: 0 auto;
  max-width: 1040px;
  padding: 8px 0 28px;
  width: 100%;
}

.account-security-card {
  background:
    radial-gradient(circle at 96% 0%, rgba(46, 197, 255, 0.09), transparent 28%),
    #fff;
  border: 1px solid #dbe5ef;
  border-radius: 18px;
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.08);
  display: grid;
  gap: 22px;
  padding: 28px;
}

.account-security-card__intro {
  align-items: flex-start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.account-security-card__intro h1 {
  color: #0f172a;
  font-size: 28px;
  line-height: 1.15;
  margin: 2px 0 8px;
}

.account-security-card__intro p {
  color: #667085;
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
  max-width: 680px;
}

.account-security-card__eyebrow {
  color: var(--app-action-primary) !important;
  font-size: 12px !important;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.account-security-card__badge {
  align-items: center;
  background: #eff8ff;
  border: 1px solid #b2ddff;
  border-radius: 16px;
  color: var(--keshero-teal);
  display: inline-flex;
  height: 58px;
  justify-content: center;
  width: 58px;
}

.account-security-card__badge svg {
  fill: currentColor;
  height: 32px;
  width: 32px;
}

.account-security-alert {
  border-radius: 12px;
  font-size: 14px;
  font-weight: 800;
  padding: 11px 13px;
}

.account-security-alert--error {
  background: var(--app-danger-surface);
  border: 1px solid #fecdca;
  color: var(--app-action-danger);
}

.account-security-alert--warning {
  background: #fffbeb;
  border: 1px solid #fedf89;
  color: #93370d;
}

.account-security-alert--success {
  background: var(--app-success-surface);
  border: 1px solid var(--app-success-border);
  color: var(--app-success-fg);
}

.account-security-form {
  display: grid;
  gap: 18px;
}

.account-security-form__grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-security-form__field {
  display: grid;
  gap: 7px;
}

.account-security-form__field label {
  color: #344054;
  font-size: 13px;
  font-weight: 900;
}

.account-security-form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
.account-security-form textarea {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 10px;
  box-shadow: inset 0 1px 1px rgba(15, 23, 42, 0.025);
  box-sizing: border-box;
  color: var(--app-text);
  font: inherit;
  min-height: 42px;
  padding: 9px 11px;
  width: 100%;
}

.account-security-form textarea {
  resize: vertical;
}

.account-security-form input:focus,
.account-security-form textarea:focus {
  border-color: var(--app-action-primary);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  outline: none;
}

.account-security-form .password-field__show-check {
  min-height: 0;
  padding: 0;
  width: 16px;
}

.account-password-requirements {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 14px;
  padding: 14px;
}

.account-password-requirements strong {
  color: #344054;
  display: block;
  font-size: 13px;
  margin-bottom: 4px;
}

.account-security-form__actions {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.account-security-form__actions--start {
  justify-content: flex-start;
}

.profile-page-shell {
  display: grid;
  gap: 16px;
}

.profile-page-shell > .spotlight-tabs {
  margin: 0;
}

.profile-card {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
  padding: 18px;
}

.profile-card--hero {
  background: #fff;
  box-sizing: border-box;
  display: grid;
  gap: 16px;
  width: 100%;
}

.profile-card--accessibility {
  width: 100%;
}

.profile-accessibility-header {
  display: grid;
  gap: 4px;
  margin-bottom: 14px;
}

.profile-accessibility-header h3 {
  color: var(--app-heading, #101828);
  font-size: 18px;
  margin: 0;
}

.profile-accessibility-header p {
  color: var(--app-muted, #667085);
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.profile-accessibility-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr;
}

.profile-accessibility-panel--color-vision {
  min-width: 0;
}

.profile-color-vision-layout {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1.05fr) minmax(260px, 0.95fr);
}

.profile-color-vision-layout .profile-accessibility-choice-row {
  grid-template-columns: 1fr;
}

.profile-color-vision-preview {
  background: #f8fafc;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.profile-color-vision-preview__head {
  align-items: baseline;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.profile-color-vision-preview__head strong {
  color: #101828;
  font-size: 13px;
}

.profile-color-vision-preview__head span {
  color: #667085;
  font-size: 12px;
}

.profile-color-vision-preview__stage {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  overflow: hidden;
}

.profile-color-vision-preview__stage[data-preview-color-vision="deuteranopia"] {
  filter: url(#keshero-cv-deuteranopia);
}
.profile-color-vision-preview__stage[data-preview-color-vision="protanopia"] {
  filter: url(#keshero-cv-protanopia);
}
.profile-color-vision-preview__stage[data-preview-color-vision="tritanopia"] {
  filter: url(#keshero-cv-tritanopia);
}
.profile-color-vision-preview__stage[data-preview-color-vision="achromatopsia"] {
  filter: grayscale(1);
}

.cv-home-mock__topbar {
  align-items: center;
  background: linear-gradient(90deg, #d8ecff, #c8f1ff);
  border-bottom: 1px solid #93c5fd;
  display: flex;
  gap: 10px;
  padding: 8px 10px;
}

.cv-home-mock__brand {
  color: #0f172a;
  font-size: 12px;
  font-weight: 800;
}

.cv-home-mock__nav {
  color: #334155;
  font-size: 11px;
  font-weight: 600;
}

.cv-home-mock__body {
  display: grid;
  gap: 8px;
  padding: 10px;
}

.cv-home-mock__title {
  color: #0f172a;
  font-size: 13px;
  font-weight: 800;
}

.cv-home-mock__chips,
.cv-home-mock__bars {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.cv-home-mock__chip {
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 8px;
}

.cv-home-mock__chip--ok { background: #dcfce7; color: #166534; }
.cv-home-mock__chip--warn { background: #fef3c7; color: #92400e; }
.cv-home-mock__chip--bad { background: #fee2e2; color: #991b1b; }
.cv-home-mock__chip--info { background: #dbeafe; color: #1d4ed8; }

.cv-home-mock__table {
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  overflow: hidden;
}

.cv-home-mock__row {
  align-items: center;
  border-bottom: 1px solid #eef2f6;
  display: grid;
  gap: 8px;
  grid-template-columns: 24px 1fr auto;
  padding: 6px 8px;
}

.cv-home-mock__row:last-child {
  border-bottom: 0;
}

.cv-home-mock__avatar {
  align-items: center;
  background: #c7d2fe;
  border-radius: 6px;
  color: #312e81;
  display: inline-flex;
  font-size: 9px;
  font-weight: 800;
  height: 22px;
  justify-content: center;
  width: 22px;
}

.cv-home-mock__avatar--warn { background: #fde68a; color: #92400e; }
.cv-home-mock__avatar--bad { background: #fecaca; color: #991b1b; }

.cv-home-mock__row > span:nth-child(2) {
  color: #101828;
  font-size: 11px;
  font-weight: 600;
}

.cv-home-mock__status {
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
}

.cv-home-mock__status--ok { background: #bbf7d0; color: #14532d; }
.cv-home-mock__status--warn { background: #fcd34d; color: #78350f; }
.cv-home-mock__status--bad { background: #f87171; color: #7f1d1d; }

.cv-home-mock__bar {
  border-radius: 4px;
  flex: 1 1 40px;
  height: 10px;
  min-width: 40px;
}

.cv-home-mock__bar--ok { background: #22c55e; }
.cv-home-mock__bar--warn { background: #f59e0b; }
.cv-home-mock__bar--bad { background: #ef4444; }
.cv-home-mock__bar--info { background: #3b82f6; }

@media (max-width: 900px) {
  .profile-accessibility-grid {
    grid-template-columns: 1fr;
  }

  .profile-color-vision-layout {
    grid-template-columns: 1fr;
  }

  .profile-reading-layout {
    grid-template-columns: 1fr;
  }
}

.profile-accessibility-panel {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
}

.profile-accessibility-panel h4 {
  color: var(--app-heading, #101828);
  font-size: 15px;
  margin: 0;
}

.profile-accessibility-panel > p {
  color: var(--app-muted, #667085);
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.profile-accessibility-choice-row {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.profile-accessibility-choice {
  align-items: flex-start;
  background: #f8fafc;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  cursor: pointer;
  display: grid;
  gap: 4px;
  grid-template-columns: auto 1fr;
  padding: 10px;
}

.profile-accessibility-choice:has(input:checked) {
  background: #eff8ff;
  border-color: #2ec5ff;
  box-shadow: 0 0 0 1px rgba(46, 197, 255, 0.35);
}

.profile-accessibility-choice input {
  --app-checkbox-radius: var(--app-dropdown-option-checkbox-radius, 4px);
  --app-checkbox-checked-bg: var(--app-dropdown-option-checkbox-checked-bg, var(--keshero-blue, #3a7bff));
  --app-checkbox-checked-border: var(--app-dropdown-option-checkbox-checked-border, var(--keshero-blue, #3a7bff));
  accent-color: var(--app-checkbox-checked-bg);
  border-radius: var(--app-checkbox-radius);
  margin-top: 2px;
}

.profile-accessibility-choice input:checked:not(:disabled),
.profile-accessibility-toggle input:checked:not(:disabled) {
  background-color: var(--app-checkbox-checked-bg) !important;
  background-image: var(--app-checkbox-mark-image) !important;
  border-color: var(--app-checkbox-checked-border) !important;
}

.profile-accessibility-choice strong {
  color: #101828;
  display: block;
  font-size: 13px;
}

.profile-accessibility-choice small {
  color: #667085;
  display: block;
  font-size: 12px;
  line-height: 1.35;
}

/* Accessibility preferences are compact choice cards. Keep history inside a
   fixed third column so a live "Was" label never pushes the title or help copy
   onto another line while the person is reviewing their selection. */
.profile-accessibility-choice.is-changed,
.profile-accessibility-toggle.is-changed {
  column-gap: 8px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  padding: 10px 10px 10px 13px;
}

.profile-accessibility-choice.is-changed > input,
.profile-accessibility-toggle.is-changed > input {
  grid-column: 1;
  grid-row: 1;
}

.profile-accessibility-choice.is-changed > :not(input):not(.app-change-was),
.profile-accessibility-toggle.is-changed > :not(input):not(.app-change-was) {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

.profile-accessibility-choice.is-changed > .app-change-was,
.profile-accessibility-toggle.is-changed > .app-change-was {
  align-self: start;
  background: #fff8e6;
  border: 1px solid #fcd34d;
  border-radius: var(--app-field-radius, 6px);
  box-sizing: border-box;
  color: #92400e;
  grid-column: 3;
  grid-row: 1;
  margin: 0;
  min-height: 22px;
  padding: 0 8px;
  white-space: nowrap;
}

.profile-accessibility-choice.is-changed:has(input:checked) {
  box-shadow: inset 3px 0 0 #f59e0b, 0 0 0 1px rgba(46, 197, 255, 0.35);
}

.profile-accessibility-toggles {
  display: grid;
  gap: 8px;
}

.profile-accessibility-toggle {
  align-items: flex-start;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: grid;
  gap: 8px;
  grid-template-columns: auto 1fr;
  padding: 10px;
}

.profile-accessibility-toggle input {
  --app-checkbox-radius: var(--app-dropdown-option-checkbox-radius, 4px);
  --app-checkbox-checked-bg: var(--app-dropdown-option-checkbox-checked-bg, var(--keshero-blue, #3a7bff));
  --app-checkbox-checked-border: var(--app-dropdown-option-checkbox-checked-border, var(--keshero-blue, #3a7bff));
  accent-color: var(--app-checkbox-checked-bg);
  border-radius: var(--app-checkbox-radius);
  margin-top: 2px;
}

.profile-accessibility-toggle strong {
  color: #101828;
  display: block;
  font-size: 13px;
}

.profile-accessibility-toggle small {
  color: #667085;
  display: block;
  font-size: 12px;
  line-height: 1.35;
}

.profile-accessibility-panel--reading {
  min-width: 0;
}

.profile-reading-layout {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1.05fr) minmax(260px, 0.95fr);
}

.profile-reading-preview {
  background: #f8fafc;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.profile-reading-preview__head {
  align-items: baseline;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.profile-reading-preview__head strong {
  color: #101828;
  font-size: 13px;
}

.profile-reading-preview__head span {
  color: #667085;
  font-size: 12px;
  text-align: right;
}

.profile-reading-preview__stage {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  min-height: 220px;
  overflow: hidden;
  position: relative;
}

.reading-mock {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.reading-mock__copy {
  color: #334155;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
}

.reading-mock__link {
  color: #0b6bcb;
  font-weight: 600;
  text-decoration: none !important;
}

.profile-reading-preview__stage[data-preview-underline="true"] .reading-mock__link {
  text-decoration: underline !important;
  text-underline-offset: 2px;
}

.reading-mock__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.reading-mock__button {
  background: #eff8ff;
  border: 1px solid #b2ddff;
  border-radius: 8px;
  color: #0f172a;
  cursor: default;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  padding: 7px 10px;
}

.reading-mock__button--focus {
  outline: 1px solid transparent;
  outline-offset: 0;
}

.profile-reading-preview__stage[data-preview-focus="true"] .reading-mock__button--focus {
  outline: 3px solid #0b6bcb !important;
  outline-offset: 3px !important;
}

.reading-mock__motion {
  align-items: center;
  display: flex;
  gap: 10px;
}

.reading-mock__motion-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.reading-mock__timer {
  display: block;
  flex: 0 0 auto;
  height: 18px;
  width: 18px;
}

.reading-mock__timer-track,
.reading-mock__timer-fill {
  fill: none;
  stroke-width: 5;
}

.reading-mock__timer-track {
  stroke: #dbe5f2;
}

.reading-mock__timer-fill {
  animation: reading-mock-timer-fill 10s linear infinite;
  stroke: #2ec5ff;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  stroke-linecap: round;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
}

.reading-mock__motion-label {
  color: #667085;
  font-size: 12px;
}

.reading-mock__motion-paused {
  color: #b54708;
  display: none;
  font-size: 11px;
  font-weight: 800;
}

.profile-reading-preview__stage[data-preview-motion="true"] .reading-mock__timer-fill {
  animation: none;
  stroke: #98a2b3;
  stroke-dashoffset: 58;
}

.profile-reading-preview__stage[data-preview-motion="true"] .reading-mock__motion-label {
  color: #98a2b3;
  text-decoration: line-through;
}

.profile-reading-preview__stage[data-preview-motion="true"] .reading-mock__motion-paused {
  display: block;
}

@keyframes reading-mock-timer-fill {
  to {
    stroke-dashoffset: 0;
  }
}

.reading-mock__voice {
  background: #0f172a;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  bottom: 10px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.22);
  color: #fff;
  display: none;
  gap: 6px;
  padding: 8px;
  position: absolute;
  right: 10px;
  width: min(200px, calc(100% - 20px));
}

.profile-reading-preview__stage[data-preview-voice="true"] .reading-mock {
  padding-bottom: 88px;
}

.profile-reading-preview__stage[data-preview-voice="true"] .reading-mock__voice {
  display: grid;
}

.reading-mock__voice-title {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.reading-mock__voice-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.reading-mock__voice-actions span {
  background: #fff;
  border-radius: 6px;
  color: #0f172a;
  font-size: 10px;
  font-weight: 700;
  padding: 4px 6px;
}

.profile-accessibility-actions {
  align-items: flex-start;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  /* Unsaved Changes sits under Save; keep a little air above the card edge. */
  margin-bottom: 12px;
  margin-top: 12px;
}

/* Shared option-history pattern: choice cards keep a compact, stable previous
   value badge in their upper-right corner. It complements the amber inset bar
   without consuming a second line or reflowing the option's help text. The
   accessibility cards above use their own equivalent grid implementation.
   Keep padding-right strong enough to win over ID-scoped card padding
   (e.g. #settings-check-in .settings-checkin-toggle). */
label.app-change-option-history.is-changed:not(.profile-accessibility-choice):not(.profile-accessibility-toggle),
label.profile-calendar-sync__event-type.is-changed,
.settings-form label.app-change-option-history.is-changed,
#settings-check-in label.settings-checkin-toggle.app-change-option-history.is-changed {
  padding-right: 88px;
  position: relative;
}

label.app-change-option-history.is-changed:not(.profile-accessibility-choice):not(.profile-accessibility-toggle) > .app-change-was,
label.profile-calendar-sync__event-type.is-changed > .app-change-was,
.settings-form label.app-change-option-history.is-changed > .app-change-was,
#settings-check-in label.settings-checkin-toggle.app-change-option-history.is-changed > .app-change-was {
  align-items: center;
  background: #fff8e6;
  border: 1px solid #fcd34d;
  border-radius: var(--app-field-radius, 6px);
  box-sizing: border-box;
  color: #92400e;
  display: inline-flex;
  font-size: 10.5px;
  justify-content: center;
  line-height: 1.25;
  margin: 0;
  min-height: 22px;
  padding: 0 8px;
  pointer-events: auto;
  position: absolute;
  right: 10px;
  top: 10px;
  white-space: nowrap;
  z-index: 1;
}

/* Disability assistance ? global apply */
html[data-color-vision="deuteranopia"] {
  filter: url(#keshero-cv-deuteranopia);
}
html[data-color-vision="protanopia"] {
  filter: url(#keshero-cv-protanopia);
}
html[data-color-vision="tritanopia"] {
  filter: url(#keshero-cv-tritanopia);
}
html[data-color-vision="achromatopsia"] {
  filter: grayscale(1);
}

html[data-reduced-motion="true"] *,
html[data-reduced-motion="true"] *::before,
html[data-reduced-motion="true"] *::after {
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
  scroll-behavior: auto !important;
  transition-duration: 0.01ms !important;
}

html[data-strong-focus="true"] :focus-visible {
  outline: 3px solid #0b6bcb !important;
  outline-offset: 3px !important;
}

html[data-underline-links="true"] a:not(.button):not(.button-small):not(.button-primary):not(.button-add-small):not(.button-danger-small):not(.profile-save-button) {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.keshero-voice-guidance {
  background: #0f172a;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  bottom: 20px;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.28);
  color: #fff;
  display: grid;
  gap: 8px;
  max-width: calc(100vw - 24px);
  padding: 10px;
  position: fixed;
  right: 20px;
  width: 260px;
  z-index: 12000;
}

.keshero-voice-guidance[hidden] {
  display: none !important;
}

.keshero-voice-guidance__title {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.keshero-voice-guidance__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.keshero-voice-guidance__actions button {
  background: #fff;
  border: 0;
  border-radius: 8px;
  color: #0f172a;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 8px;
}

.keshero-voice-guidance__status {
  color: rgba(255, 255, 255, 0.78);
  font-size: 12px;
  line-height: 1.35;
  min-height: 1.35em;
}

.profile-photo-grid {
  align-items: stretch;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
}

.profile-summary-card,
.profile-editor-card {
  background: var(--app-surface-muted);
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  padding: 14px;
}

.profile-summary-card {
  align-content: center;
  display: grid;
  gap: 12px;
  height: 100%;
  justify-items: center;
  min-width: 0;
  text-align: center;
}

.profile-photo-current img,
.profile-photo-current--initials {
  border: 1px solid #d0d5dd;
  border-radius: 14px;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.09);
  display: block;
  height: 132px;
  object-fit: cover;
  width: 132px;
}

.profile-photo-current--initials {
  align-items: center;
  display: inline-flex;
  font-size: 40px;
  font-weight: 900;
  justify-content: center;
}

.profile-summary-card__text {
  display: grid;
  gap: 4px;
}

.profile-summary-card__eyebrow {
  color: var(--app-action-primary);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  margin: 0;
  text-transform: uppercase;
}

.profile-summary-card h1,
.profile-details-header h2,
.profile-identity__who h1 {
  color: #0f172a;
  line-height: 1.15;
  margin: 0;
}

.profile-summary-card h1,
.profile-identity__who h1 {
  font-size: 22px;
}

.profile-summary-card p,
.profile-details-header p,
.profile-editor-card__header p,
.profile-identity__who p,
.profile-identity__colors-head p {
  color: #667085;
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

.profile-security-links {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

.profile-editor-card {
  box-sizing: border-box;
  display: grid;
  gap: 16px;
  max-width: none;
  min-width: 0;
  overflow: hidden;
  padding: 18px;
  width: 100%;
}

.profile-card--hero > .profile-editor-card__header h3,
.profile-editor-card__header h3 {
  color: #0f172a;
  font-size: 18px;
  margin: 0 0 3px;
}

.profile-editor-form {
  display: grid;
  gap: 10px;
  margin: 0;
}

.profile-identity {
  align-items: start;
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 12px;
  display: grid;
  gap: 16px 18px;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 14px 16px;
}

.profile-identity__avatar {
  position: relative;
  width: 96px;
}

.profile-identity__photo,
.profile-identity__photo--initials {
  border: 1px solid #d0d5dd;
  border-radius: 14px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.07);
  display: block;
  height: 96px;
  object-fit: cover;
  width: 96px;
}

.profile-identity__photo--initials {
  align-items: center;
  display: inline-flex;
  font-size: 32px;
  font-weight: 900;
  justify-content: center;
  letter-spacing: 0.02em;
}

.profile-identity__chip {
  align-items: center;
  border: 2px solid #fff;
  border-radius: 999px;
  bottom: -4px;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.14);
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  height: 30px;
  justify-content: center;
  position: absolute;
  right: -6px;
  width: 30px;
}

.profile-identity__body {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.profile-identity__top {
  align-items: end;
  display: grid;
  gap: 12px 16px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.profile-identity__who {
  display: grid;
  gap: 4px;
  justify-items: start;
  min-width: 0;
}

.profile-identity__who h1 {
  font-size: 22px;
  letter-spacing: -0.02em;
}

.profile-identity__meta {
  align-items: center;
  color: #667085;
  display: flex;
  flex-wrap: wrap;
  font-size: 13px;
  gap: 8px 10px;
}

.profile-identity__meta a {
  color: var(--keshero-teal, #2ec5ff);
  font-weight: 700;
  text-decoration: none;
}

.profile-identity__meta a:hover,
.profile-identity__meta a:focus-visible {
  text-decoration: underline;
}

.profile-identity__colors {
  align-items: end;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(120px, 150px) auto minmax(120px, 150px) auto;
  margin: 0;
}

.profile-identity__color {
  color: #344054;
  display: grid;
  font-size: 11px;
  font-weight: 800;
  gap: 4px;
  letter-spacing: 0.02em;
  min-width: 0;
  text-transform: uppercase;
}

.profile-identity__swap {
  align-items: center;
  background: #fff;
  border: 1px solid #98a2b3;
  border-radius: 8px;
  color: #101828;
  cursor: pointer;
  display: inline-flex;
  font-size: 22px;
  font-weight: 800;
  height: 38px;
  justify-content: center;
  line-height: 1;
  min-width: 38px;
  padding: 0;
  transition: background-color 0.14s ease, border-color 0.14s ease, color 0.14s ease;
}

.profile-identity__swap:hover,
.profile-identity__swap:focus-visible {
  background: #f8fafc;
  border-color: var(--keshero-teal, #2ec5ff);
  color: var(--keshero-teal, #2ec5ff);
  outline: none;
}

.profile-identity__colors .profile-save-button {
  min-height: 38px;
}

.profile-identity__photo-form {
  align-items: center;
  border-top: 1px solid #eef2f6;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  margin: 0;
  padding-top: 12px;
}

.profile-identity__photo-field {
  min-width: 0;
}

.profile-identity__photo-field input[type="file"] {
  background: #f8fafc;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  font: inherit;
  font-size: 13px;
  max-width: 420px;
  min-height: 38px;
  padding: 6px 8px;
  width: 100%;
}

.profile-identity__photo-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.profile-identity__photo-actions .profile-remove-photo-button,
.profile-identity__photo-actions .profile-save-button {
  min-height: 38px;
}

@media (max-width: 1100px) {
  .profile-identity__top {
    grid-template-columns: 1fr;
  }

  .profile-identity__colors {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto;
    justify-self: stretch;
    width: 100%;
  }
}

.profile-avatar-tools {
  align-items: stretch;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(210px, 0.75fr) minmax(0, 1.25fr);
}

.profile-avatar-preview {
  align-items: center;
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: flex;
  gap: 10px;
  padding: 10px;
}

.profile-avatar-preview--editor {
  align-content: space-between;
  align-items: stretch;
  display: grid;
  gap: 10px;
  height: 100%;
  min-height: 100%;
}

.profile-avatar-preview__summary {
  align-items: center;
  display: flex;
  gap: 10px;
}

.profile-avatar-preview--editor .profile-controls-grid--avatar-colors {
  border-top: 1px solid #e4e7ec;
  grid-column: auto;
  padding-top: 10px;
}

.profile-avatar-preview__bubble {
  align-items: center;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 999px;
  display: inline-flex;
  flex-shrink: 0;
  font-size: 18px;
  font-weight: 900;
  height: 52px;
  justify-content: center;
  width: 52px;
}

.profile-avatar-preview__meta {
  color: #667085;
  display: grid;
  font-size: 13px;
  gap: 2px;
}

.profile-avatar-preview__meta strong {
  color: #101828;
}

.profile-avatar-preview--editor .profile-avatar-preview__meta strong {
  color: var(--app-heading);
  font-size: 16px;
  line-height: 1.2;
  margin: 0 0 4px;
}

.profile-controls-grid {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.profile-controls-grid--avatar-colors {
  align-items: end;
  grid-column: 1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto auto;
}

.profile-controls-grid--avatar-colors label {
  grid-row: 1;
}

.profile-controls-grid--avatar-colors .profile-swap-colors-button,
.profile-controls-grid--avatar-colors .profile-save-button {
  align-self: end;
  min-width: 0;
  width: 100%;
}

.profile-controls-grid--avatar-colors .profile-swap-colors-button {
  grid-column: 1;
  grid-row: 2;
}

.profile-controls-grid--avatar-colors .profile-save-button {
  grid-column: 2;
  grid-row: 2;
}

.profile-controls-grid--photo {
  border-top: 1px solid #e4e7ec;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  padding-top: 10px;
}

.profile-controls-grid--photo label {
  gap: 4px;
}

.profile-controls-grid--photo input[type="file"],
.profile-controls-grid--photo .profile-save-button,
.profile-controls-grid--photo .profile-remove-photo-button {
  min-height: 38px;
  padding-bottom: 5px;
  padding-top: 5px;
}

.profile-controls-grid label {
  color: #344054;
  display: grid;
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
}

.profile-color-row {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) 46px;
}

.profile-color-control {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) 38px;
  min-width: 0;
  position: relative;
  width: 100%;
}

.profile-color-control .succession-color-input {
  box-sizing: border-box;
  margin-left: 0;
  min-height: 38px;
  width: 100%;
}

.profile-color-control .app-color-preview-swatch {
  border: 1px solid var(--app-border, #d0d5dd);
  border-radius: 6px;
  cursor: pointer;
  flex: 0 0 38px;
  height: 38px;
  width: 38px;
}

.profile-color-control .profile-color-native {
  display: none;
}

.profile-color-row input[type="text"] {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 8px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  min-height: 34px;
  padding: 6px 8px;
  text-transform: uppercase;
  width: 100%;
}

.profile-controls-grid input[type="file"] {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 10px;
  box-sizing: border-box;
  font: inherit;
  min-height: 40px;
  padding: 7px 9px;
  width: 100%;
}

.profile-swap-colors-button {
  align-items: center;
  align-self: end;
  background: var(--app-action-secondary);
  border: 1px solid var(--app-border-soft);
  border-radius: 8px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: max(11px, calc(var(--app-body-size) - 1px));
  font-weight: 900;
  gap: 6px;
  justify-content: center;
  min-height: 32px;
  padding: 5px 9px;
  transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, transform 0.14s ease;
  white-space: nowrap;
}

.profile-save-button {
  align-items: center;
  align-self: end;
  background: var(--app-action-primary);
  border: 1px solid var(--app-action-primary-border);
  border-radius: 8px;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: max(11px, calc(var(--app-body-size) - 1px));
  font-weight: 900;
  justify-content: center;
  min-height: 32px;
  padding: 5px 9px;
  transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, transform 0.14s ease;
  white-space: nowrap;
}

.profile-save-button:hover,
.profile-save-button:focus-visible {
  background: var(--app-action-primary-hover);
  box-shadow: 0 8px 16px rgba(46, 197, 255, 0.16);
  color: #fff;
  outline: none;
  transform: translateY(-1px);
}

.profile-swap-colors-button span[aria-hidden="true"] {
  display: none;
}

.profile-swap-colors-button:hover,
.profile-swap-colors-button:focus-visible {
  background: var(--app-action-secondary-hover);
  border-color: #cbd5e1;
  box-shadow: 0 8px 16px rgba(15, 23, 42, 0.08);
  color: var(--keshero-teal);
  outline: none;
  transform: translateY(-1px);
}

.profile-remove-photo-button {
  align-self: end;
  min-height: 38px;
  white-space: nowrap;
}

.profile-summary-photo-form {
  justify-self: stretch;
  width: 100%;
}

.profile-controls-grid--summary-photo {
  align-items: stretch;
  grid-template-columns: minmax(0, 1fr);
  padding-top: 12px;
}

.profile-controls-grid--summary-photo label {
  text-align: left;
}

.profile-photo-label-row {
  align-items: baseline;
  display: flex;
  gap: 6px;
  justify-content: space-between;
}

.profile-photo-max-size {
  color: #667085;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.profile-summary-photo-actions {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
}

.profile-summary-photo-actions .profile-remove-photo-button,
.profile-summary-photo-actions .profile-save-button {
  align-self: stretch;
  width: 100%;
}

.profile-cursor-options {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: grid;
  gap: 8px;
  grid-column: 2;
  grid-row: 1;
  height: 100%;
  min-width: 0;
  padding: 10px;
}

.profile-language-options,
.profile-display-preferences .profile-time-zone-form,
.profile-display-preferences .profile-date-format-form {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 14px;
}

.profile-display-preferences {
  align-items: stretch;
  display: grid;
  gap: 12px;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-display-preferences .profile-language-options {
  grid-column: auto;
  height: 100%;
}

.profile-text-size-options {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 14px;
}

.profile-display-preferences .profile-appearance-header {
  /* Beat the global .profile-appearance-header divider (!important).
     These headers already sit inside bordered preference cards. */
  border-top: 0 !important;
  padding-top: 0;
}

.profile-display-preferences .profile-text-size-options {
  align-items: start;
  grid-column: 1 / -1;
  grid-template-columns: minmax(180px, 0.34fr) minmax(0, 1.66fr);
}

.profile-display-preferences .profile-date-format-form {
  grid-column: 1 / -1;
}

.profile-calendar-sync {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: grid;
  gap: 12px;
  grid-column: 1 / -1;
  min-width: 0;
  padding: 14px;
}

.profile-calendar-sync__providers {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-preferences-actions {
  align-items: flex-start;
  display: flex;
  justify-content: flex-end;
  margin-top: 4px;
  min-height: 48px;
  padding: 6px 0 20px;
}

.profile-preferences-actions__controls {
  align-items: flex-start;
  display: flex;
  gap: 10px;
}

.profile-preferences-actions__controls > .app-save-action-stack {
  min-height: 42px;
}

.profile-calendar-sync__provider {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  min-width: 0;
  padding: 12px;
}

.profile-calendar-sync__provider h4 {
  color: #101828;
  font-size: 14px;
  margin: 0 0 3px;
}

.profile-calendar-sync__provider p,
.profile-calendar-sync__empty,
.profile-calendar-sync__sync-now span {
  color: #667085;
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.profile-calendar-sync__actions form {
  margin: 0;
}

.profile-calendar-sync__sync-now {
  align-items: center;
  border-top: 1px solid #e4e7ec;
  display: flex;
  gap: 10px;
  padding-top: 12px;
}

.profile-calendar-sync__published-items {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  padding: 12px;
}

.profile-calendar-sync__published-items-head,
.profile-calendar-sync__published-items-actions {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.profile-calendar-sync__published-items-actions {
  justify-content: flex-end;
}

.profile-calendar-sync__published-items h4 {
  color: #101828;
  font-size: 14px;
  margin: 0 0 3px;
}

.profile-calendar-sync__published-items p,
.profile-calendar-sync__published-items-actions span {
  color: #667085;
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.profile-calendar-sync__event-types {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-calendar-sync__event-type {
  align-items: center;
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 7px;
  color: #344054;
  display: flex;
  font-size: 13px;
  font-weight: 650;
  gap: 8px;
  min-height: 38px;
  padding: 8px 10px;
}

.profile-calendar-sync__event-type input[type="checkbox"] {
  --app-checkbox-radius: var(--app-dropdown-option-checkbox-radius, 4px);
  --app-checkbox-checked-bg: var(--app-dropdown-option-checkbox-checked-bg, var(--keshero-blue, #3a7bff));
  --app-checkbox-checked-border: var(--app-dropdown-option-checkbox-checked-border, var(--keshero-blue, #3a7bff));
  accent-color: var(--app-checkbox-checked-bg);
  border-radius: var(--app-checkbox-radius);
  flex-shrink: 0;
}

.profile-calendar-sync__event-type input[type="checkbox"]:checked:not(:disabled) {
  background-color: var(--app-checkbox-checked-bg) !important;
  background-image: var(--app-checkbox-mark-image) !important;
  border-color: var(--app-checkbox-checked-border) !important;
}

.profile-calendar-sync__event-type:has(input:checked) {
  background: #eff8ff;
  border-color: #84caff;
  color: #0b4f80;
}

.settings-calendar-event-types {
  display: grid;
  gap: 8px;
}

.profile-date-format-grid {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-date-format-card {
  align-content: start;
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
}

.profile-date-format-card__head {
  align-items: start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.profile-date-format-card__head h4 {
  color: #101828;
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 3px;
}

.profile-date-format-card__head p {
  color: #667085;
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.profile-date-format-card label {
  color: var(--app-label-color, #344054);
  display: grid;
  font-size: var(--app-label-font-size, 12px);
  font-weight: var(--app-label-font-weight, 800);
  gap: var(--app-label-gap, 6px);
}

.profile-date-format-label {
  align-items: center;
  color: var(--app-label-color, #344054);
  display: inline-flex;
  font-size: 1em;
  font-weight: var(--app-label-font-weight, 800);
  gap: 6px;
  letter-spacing: 0.02em;
  line-height: 1.2;
}

.profile-date-format-card select,
.profile-date-format-card input[type="text"] {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  min-height: 40px;
  padding: 8px 10px;
  width: 100%;
}

.profile-date-format-example-row {
  display: grid;
  gap: 6px;
}

.profile-date-format-example {
  align-items: center;
  background: #eef9ff;
  border: 1px solid #b9e6fe;
  border-radius: 8px;
  color: #075985;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  min-height: 40px;
  padding: 8px 10px;
  width: 100%;
}

.profile-date-custom-row {
  display: none;
  gap: 8px;
  margin-top: 0;
}

.profile-date-custom-row[hidden] {
  display: none !important;
}

.profile-date-custom-row.is-visible {
  display: grid;
}

.profile-display-preferences .profile-text-size-options .profile-appearance-header {
  align-items: start;
  display: grid;
  gap: 8px;
  justify-content: start;
}

.profile-language-select {
  color: #344054;
  display: grid;
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
  max-width: none;
  width: 100%;
}

.profile-language-select select {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 8px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  min-height: 38px;
  padding: 6px 8px;
  width: 100%;
}

.profile-text-size-slider-row {
  align-items: stretch;
  display: grid;
  gap: 12px;
  grid-column: 2;
  grid-template-columns: minmax(0, 1fr);
}

.profile-text-size-slider {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 4px 2px 0;
}

.profile-text-size-slider__control {
  display: grid;
  gap: 6px;
  position: relative;
}

.profile-text-size-slider__control::before {
  background: #98a2b3;
  clip-path: polygon(0 44%, 100% 6%, 100% 94%, 0 56%);
  content: "";
  height: 16px;
  left: 2px;
  pointer-events: none;
  position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
}

.profile-text-size-slider__control input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  cursor: pointer;
  height: 28px;
  margin: 0;
  position: relative;
  width: 100%;
  z-index: 1;
}

.profile-text-size-slider__control input[type="range"]::-webkit-slider-runnable-track {
  background: transparent;
  border-radius: 0;
  height: 16px;
}

.profile-text-size-slider__control input[type="range"]::-moz-range-track {
  background: transparent;
  border-radius: 0;
  height: 16px;
}

.profile-text-size-slider__control input[type="range"]::-moz-range-progress {
  background: transparent;
}

.profile-text-size-slider__control input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  background: #fff;
  border: 2px solid #475467;
  border-radius: 50%;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.18);
  height: 18px;
  margin-top: -1px;
  width: 18px;
}

.profile-text-size-slider__control input[type="range"]::-moz-range-thumb {
  background: #fff;
  border: 2px solid #475467;
  border-radius: 50%;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.18);
  height: 18px;
  width: 18px;
}

.profile-text-size-slider__control input[type="range"]:focus-visible {
  outline: none;
}

.profile-text-size-slider__control input[type="range"]:focus-visible::-webkit-slider-thumb {
  box-shadow: 0 0 0 3px rgba(71, 84, 103, 0.28);
}

.profile-text-size-slider__control input[type="range"]:focus-visible::-moz-range-thumb {
  box-shadow: 0 0 0 3px rgba(71, 84, 103, 0.28);
}

.profile-text-size-slider__labels {
  align-items: baseline;
  color: var(--app-muted, #667085);
  display: flex;
  font-weight: 700;
  justify-content: space-between;
}

.profile-text-size-slider__label--small {
  font-size: 11px;
}

.profile-text-size-slider__label--large {
  font-size: 16px;
}

.profile-text-size-slider__sample {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  color: var(--app-heading, #101828);
  display: grid;
  gap: 0.2em;
  line-height: 1.35;
  margin: 8px 0 0;
  padding: 10px 12px;
  transition: font-size 80ms ease;
}

.profile-text-size-slider__sample-title {
  display: block;
  font-size: 1.15em;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.profile-text-size-slider__sample-body {
  color: #344054;
  display: block;
  font-size: 1em;
  font-weight: 500;
}

.profile-text-size-slider__sample-meta {
  color: #667085;
  display: block;
  font-size: 0.85em;
  font-weight: 600;
}

.profile-text-size-save {
  align-self: start;
  justify-self: start;
}

.profile-cursor-options__header {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.profile-cursor-options__header h4 {
  color: var(--app-heading);
  font-size: 16px;
  margin: 0 0 4px;
}

.profile-cursor-options__header p {
  color: var(--app-muted);
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.profile-cursor-options__sample {
  display: block;
  filter: drop-shadow(0 0 0 white) drop-shadow(0 1px 2px rgba(15, 23, 42, 0.22));
  flex: 0 0 auto;
  height: 32px;
  width: 32px;
}

.profile-cursor-options__mode,
.profile-cursor-options__colors {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-cursor-options__mode label,
.profile-cursor-options__colors label {
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 850;
  gap: 5px;
}

.profile-cursor-options__mode label {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  grid-template-columns: auto 1fr;
  min-height: 32px;
  padding: 5px 8px;
}

.profile-cursor-options__colors .profile-color-control {
  margin-top: 0;
}

.profile-cursor-options__footer {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.profile-cursor-options__toggle {
  align-items: flex-start;
  background: #f9fafb;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  color: #344054;
  display: grid;
  font-size: 12px;
  gap: 8px;
  grid-template-columns: auto 1fr;
  min-width: 0;
  padding: 7px 8px;
}

.profile-cursor-options__toggle span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.profile-cursor-options__toggle strong {
  font-size: 11px;
  line-height: 1.15;
  white-space: nowrap;
}

.profile-cursor-options__toggle small {
  color: #667085;
  font-size: 11px;
  font-weight: 600;
}

.profile-cursor-options__save {
  align-self: center;
  justify-self: end;
  min-width: 96px;
}

.keshero-cursor-click-pulse {
  animation: kesheroCursorClickPulse 420ms ease-out forwards;
  border: 2px solid var(--keshero-cursor-primary, #2ec5ff);
  border-radius: 999px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--keshero-cursor-secondary, #8a2be2) 28%, transparent);
  height: 34px;
  left: 0;
  pointer-events: none;
  position: fixed;
  top: 0;
  transform: translate(-50%, -50%) scale(0.45);
  width: 34px;
  z-index: 2147483647;
}

@keyframes kesheroCursorClickPulse {
  0% {
    opacity: 0.95;
    transform: translate(-50%, -50%) scale(0.45);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.45);
  }
}

.profile-preferences-card {
  display: grid;
  gap: 12px;
}

.profile-appearance-status {
  background: var(--app-success-surface);
  border: 1px solid var(--app-success-border);
  border-radius: 999px;
  color: var(--app-success-fg);
  font-size: 12px;
  font-weight: 900;
  padding: 6px 10px;
}

.profile-appearance-status[hidden] {
  display: none !important;
}

.profile-appearance-form {
  display: grid;
  gap: 10px;
  margin: 0;
}

.profile-time-zone-form {
  display: grid;
  gap: 10px;
  margin: 0;
}

.profile-appearance-options {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-time-zone-options {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-appearance-header {
  align-items: center;
  border-top: 1px solid var(--app-border-soft);
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding-top: 10px;
}

.profile-appearance-header h3 {
  color: var(--app-heading);
  font-size: 16px;
  margin: 0 0 4px;
}

.profile-appearance-header p {
  color: var(--app-muted);
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
}

.profile-appearance-option {
  align-items: flex-start;
  background: var(--app-surface-muted);
  border: 1px solid var(--app-border-soft);
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  gap: 10px;
  padding: 12px;
}

.profile-time-zone-option {
  align-items: flex-start;
  background: var(--app-surface-muted);
  border: 1px solid var(--app-border-soft);
  border-radius: 10px;
  cursor: pointer;
  display: flex;
  gap: 10px;
  min-width: 0;
  padding: 10px;
}

.profile-appearance-option:has(input:checked) {
  background: rgba(46, 197, 255, 0.12);
  border-color: var(--app-action-primary-border);
  box-shadow: 0 0 0 3px var(--app-focus-ring);
}

.profile-time-zone-option:has(input:checked) {
  background: rgba(46, 197, 255, 0.12);
  border-color: var(--app-action-primary-border);
  box-shadow: 0 0 0 3px var(--app-focus-ring);
}

.profile-appearance-option input {
  flex: 0 0 auto;
  margin-top: 3px;
}

.profile-time-zone-option input {
  --app-checkbox-radius: var(--app-dropdown-option-checkbox-radius, 4px);
  --app-checkbox-checked-bg: var(--app-dropdown-option-checkbox-checked-bg, var(--keshero-blue, #3a7bff));
  --app-checkbox-checked-border: var(--app-dropdown-option-checkbox-checked-border, var(--keshero-blue, #3a7bff));
  accent-color: var(--app-checkbox-checked-bg);
  border-radius: var(--app-checkbox-radius);
  flex: 0 0 auto;
  margin-top: 3px;
}

.profile-time-zone-option input[type="radio"]:checked:not(:disabled) {
  background-color: var(--app-checkbox-checked-bg) !important;
  background-image: var(--app-checkbox-mark-image) !important;
  border-color: var(--app-checkbox-checked-border) !important;
}

.profile-appearance-option span {
  display: grid;
  gap: 3px;
}

.profile-time-zone-option span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.profile-appearance-option strong {
  color: var(--app-heading);
  font-size: 14px;
}

.profile-time-zone-option strong {
  color: var(--app-heading);
  font-size: 14px;
}

.profile-appearance-option small {
  color: var(--app-muted);
  font-size: 12px;
  line-height: 1.35;
}

.profile-time-zone-option small {
  color: var(--app-muted);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.profile-time-zone-manual {
  color: #344054;
  display: grid;
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
}

.profile-time-zone-manual[hidden] {
  display: none !important;
}

.profile-time-zone-manual input,
.profile-time-zone-manual select {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: 8px;
  box-sizing: border-box;
  font: inherit;
  min-height: 38px;
  padding: 6px 8px;
  width: 100%;
}

.profile-details-header {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 12px;
}

.profile-details-header h2 {
  font-size: 22px;
  margin-top: 2px;
}

.profile-sections-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-section-card {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.035);
  overflow: hidden;
}

.profile-section-card h3 {
  background: #f8fafc;
  border-bottom: 1px solid #e4e7ec;
  color: #101828;
  font-size: 14px;
  margin: 0;
  padding: 10px 12px;
}

.profile-section-table {
  border-collapse: collapse;
  width: 100%;
}

.profile-section-table th,
.profile-section-table td {
  border-bottom: 1px solid #eaecf0;
  font-size: 13px;
  padding: 8px 12px;
  vertical-align: top;
}

.profile-section-table th {
  color: #475467;
  font-weight: 800;
  min-width: max-content;
  text-align: left;
  white-space: nowrap;
  width: 58%;
}

.profile-section-table td {
  color: #182230;
}

.profile-section-table tr:last-child th,
.profile-section-table tr:last-child td {
  border-bottom: 0;
}

.profile-empty-state {
  background: #f8fafc;
  border: 1px dashed #d0d5dd;
  border-radius: 12px;
  color: #667085;
  font-size: 14px;
  padding: 16px;
  text-align: center;
}

.mfa-status-card,
.mfa-setup__steps {
  border-radius: 14px;
  display: grid;
  gap: 8px;
  padding: 16px;
}

.mfa-status-card strong,
.mfa-setup__steps strong {
  color: #0f172a;
  font-size: 16px;
}

.mfa-status-card p,
.mfa-setup__steps p {
  color: #667085;
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

.mfa-status-card--enabled {
  background: var(--app-success-surface);
  border: 1px solid var(--app-success-border);
}

.mfa-status-card--off {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
}

.mfa-status-card__pill {
  background: var(--app-success);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  justify-self: start;
  padding: 4px 9px;
}

.mfa-disable-form {
  background: #fffbeb;
  border: 1px solid #fedf89;
  border-radius: 14px;
  padding: 16px;
}

.mfa-setup {
  display: grid;
  gap: 16px;
}

.mfa-setup__steps {
  background: #eff8ff;
  border: 1px solid #b2ddff;
}

.mfa-setup__steps ol {
  color: #344054;
  display: grid;
  font-size: 14px;
  gap: 6px;
  margin: 0;
  padding-left: 20px;
}

.mfa-secret-block,
.mfa-uri-block {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 14px;
  display: grid;
  gap: 9px;
  padding: 14px;
}

.mfa-secret-label {
  color: #344054;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.mfa-copy-row {
  align-items: center;
  display: flex;
  gap: 10px;
}

.mfa-secret-block code {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  color: #0f172a;
  flex: 1;
  font-family: Consolas, "Courier New", monospace;
  font-size: 14px;
  overflow-wrap: anywhere;
  padding: 10px 12px;
}

.mfa-uri-block textarea {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  box-sizing: border-box;
  color: #344054;
  font: inherit;
  min-height: 78px;
  padding: 10px 12px;
  resize: vertical;
  width: 100%;
}

.mfa-uri-block textarea:focus {
  border-color: var(--app-action-primary);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  outline: none;
}

.mfa-enable-form {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 14px;
  padding: 16px;
}

@media (max-width: 760px) {
  .account-security-card {
    padding: 20px;
  }

  .account-security-card__intro,
  .account-security-form__grid {
    grid-template-columns: 1fr;
  }

  .admin-form-grid,
  .admin-edit-user-scope-value-grid {
    grid-template-columns: 1fr;
  }

  .account-security-card__badge {
    display: none;
  }

  .account-security-form__actions {
    align-items: stretch;
    flex-direction: column-reverse;
  }

  .profile-card {
    padding: 18px;
  }

  .profile-photo-grid,
  .profile-avatar-tools,
  .profile-identity,
  .profile-sections-grid {
    grid-template-columns: 1fr;
  }

  .profile-identity__top,
  .profile-identity__colors,
  .profile-identity__photo-form {
    grid-template-columns: 1fr;
  }

  .profile-identity__swap,
  .profile-identity__colors .profile-save-button {
    width: 100%;
  }

  .profile-identity__photo-actions {
    justify-content: stretch;
  }

  .profile-identity__photo-actions .profile-remove-photo-button,
  .profile-identity__photo-actions .profile-save-button {
    flex: 1 1 auto;
  }

  .profile-controls-grid {
    grid-template-columns: 1fr;
  }

  .profile-controls-grid--avatar-colors {
    grid-template-rows: none;
  }

  .profile-controls-grid--avatar-colors .profile-swap-colors-button,
  .profile-controls-grid--avatar-colors .profile-save-button {
    grid-column: auto;
    grid-row: auto;
  }

  .profile-cursor-options__mode,
  .profile-cursor-options__colors {
    grid-template-columns: 1fr;
  }

  .profile-display-preferences,
  .profile-text-size-slider-row {
    grid-template-columns: 1fr;
  }

  .profile-text-size-slider-row {
    grid-column: auto;
  }

  .profile-display-preferences .profile-text-size-options {
    grid-template-columns: 1fr;
  }

  .profile-calendar-sync__providers {
    grid-template-columns: 1fr;
  }

  .profile-calendar-sync__event-types {
    grid-template-columns: 1fr;
  }

  .profile-calendar-sync__provider,
  .profile-calendar-sync__sync-now,
  .profile-calendar-sync__published-items-head,
  .profile-calendar-sync__published-items-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .profile-date-format-grid {
    grid-template-columns: 1fr;
  }

  .profile-text-size-save {
    justify-self: start;
  }

  .profile-details-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .profile-section-table th {
    min-width: 0;
    white-space: normal;
    width: 46%;
  }

  .mfa-copy-row {
    align-items: stretch;
    flex-direction: column;
  }
}

.login-page {
  align-items: center;
  background:
    radial-gradient(ellipse 70% 55% at 12% 8%, rgba(46, 197, 255, 0.22), transparent 55%),
    radial-gradient(ellipse 60% 50% at 92% 12%, rgba(138, 43, 226, 0.14), transparent 50%),
    radial-gradient(ellipse 50% 40% at 70% 88%, rgba(58, 123, 255, 0.12), transparent 55%),
    linear-gradient(165deg, #f4fbff 0%, #f7f8ff 42%, #eef4ff 100%);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  font-family: "Outfit", "Segoe UI", sans-serif;
  justify-content: flex-start;
  min-height: 100vh;
  min-height: 100dvh;
  overflow-x: hidden;
  padding: max(24px, 17vh) 18px 48px;
  position: relative;
}

.login-page .app-footer-watermark {
  background: transparent;
  left: 0;
  margin-top: 0;
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
}

.login-page__glow {
  border-radius: 50%;
  filter: blur(48px);
  pointer-events: none;
  position: fixed;
  z-index: 0;
}

.login-page__glow--cyan {
  animation: login-glow-drift 14s ease-in-out infinite alternate;
  background: rgba(46, 197, 255, 0.28);
  height: min(42vw, 420px);
  left: -8%;
  top: 6%;
  width: min(42vw, 420px);
}

.login-page__glow--violet {
  animation: login-glow-drift 18s ease-in-out infinite alternate-reverse;
  background: rgba(138, 43, 226, 0.18);
  bottom: 4%;
  height: min(36vw, 360px);
  right: -6%;
  width: min(36vw, 360px);
}

@keyframes login-glow-drift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(18px, -14px, 0) scale(1.06); }
}

.login-panel {
  animation: login-panel-rise 520ms cubic-bezier(0.22, 1, 0.36, 1) both;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 252, 255, 0.96) 100%);
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 20px;
  box-shadow:
    0 0 0 1px rgba(138, 43, 226, 0.06),
    0 24px 70px rgba(15, 23, 42, 0.12),
    0 8px 24px rgba(46, 197, 255, 0.08);
  box-sizing: border-box;
  flex-shrink: 0;
  margin: 0 auto;
  max-width: 560px;
  overflow: hidden;
  padding: 40px 44px;
  position: relative;
  width: min(100%, 560px);
  z-index: 1;
}

.login-panel::before {
  background: linear-gradient(
    90deg,
    var(--keshero-teal, #2ec5ff) 0%,
    var(--keshero-blue, #3a7bff) 50%,
    var(--keshero-purple, #8a2be2) 100%
  );
  content: "";
  height: 4px;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}

@keyframes login-panel-rise {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.login-panel__tagline {
  animation: login-tagline-in 700ms cubic-bezier(0.22, 1, 0.36, 1) 120ms both;
  background: linear-gradient(105deg, var(--keshero-teal, #2ec5ff) 0%, var(--keshero-blue, #3a7bff) 48%, var(--keshero-purple, #8a2be2) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-family: "Outfit", "Segoe UI", sans-serif;
  font-size: clamp(1.15rem, 2.4vw, 1.45rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  margin: 0 0 28px;
  text-align: center;
}

@keyframes login-tagline-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.login-panel__helper {
  color: #5b6b7f;
  font-size: 14px;
  line-height: 1.45;
  margin: 0 0 20px;
}

.login-panel__error {
  background: var(--app-danger-surface);
  border: 1px solid #fecdca;
  border-radius: 10px;
  color: var(--app-action-danger);
  font-size: 14px;
  font-weight: 800;
  margin: 0 0 16px;
  padding: 10px 12px;
}

.login-panel__success {
  background: var(--app-success-surface);
  border: 1px solid var(--app-success-border);
  border-radius: 10px;
  color: var(--app-success-fg);
  font-size: 14px;
  font-weight: 800;
  margin: 0 0 16px;
  padding: 10px 12px;
}

.login-panel-logo {
  align-items: center;
  animation: login-tagline-in 600ms cubic-bezier(0.22, 1, 0.36, 1) both;
  border-radius: 12px;
  box-sizing: border-box;
  display: flex;
  height: 120px;
  justify-content: center;
  margin: 0 0 14px;
  max-width: 100%;
  overflow: hidden;
  width: 100%;
}

.login-panel-logo img {
  display: block;
  height: 100%;
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
  width: 100%;
}

.login-panel input:not([type="checkbox"]):not([type="radio"]) {
  border: 1px solid #cfd8e3;
  border-radius: 10px;
  font: inherit;
  margin-top: 4px;
  max-width: 100%;
  padding: 9px 10px;
}

.login-form {
  display: grid;
  gap: 20px;
}

.login-form__field {
  display: grid;
  gap: 6px;
}

.login-form__field > input,
.login-form__field .password-field {
  width: 100%;
}

.login-form__field > label,
.login-form__label-row,
.login-form__label-row > label {
  color: #344054;
  font-family: inherit;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.25;
}

.login-form__label-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.login-form__label-row > label {
  margin-left: 4px;
}

.login-form__label-row a,
.login-panel__links a {
  color: var(--keshero-blue, #3a7bff);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.25;
  text-decoration: none;
}

.login-form__label-row a {
  margin-right: 4px;
}

.login-form__label-row a:hover,
.login-panel__links a:hover {
  color: var(--keshero-purple, #8a2be2);
  text-decoration: underline;
}

.login-form__submit,
.login-panel button[type="submit"] {
  background: linear-gradient(105deg, var(--keshero-teal, #2ec5ff) 0%, var(--keshero-blue, #3a7bff) 100%);
  border: 0;
  box-shadow: 0 10px 24px rgba(46, 197, 255, 0.28);
  color: #fff;
  font-weight: 800;
  min-height: 44px;
  transition: box-shadow 0.16s ease, transform 0.16s ease, filter 0.16s ease;
  width: 100%;
}

.login-form__submit:hover,
.login-panel button[type="submit"]:hover {
  box-shadow: 0 14px 28px rgba(58, 123, 255, 0.32);
  filter: brightness(1.03);
  transform: translateY(-1px);
}

.login-panel .password-field__show-check {
  --app-checkbox-size: 18px;
  aspect-ratio: 1 / 1;
  box-sizing: border-box;
  flex: 0 0 18px;
  height: 18px;
  max-height: 18px;
  max-width: 18px;
  min-height: 18px;
  min-width: 18px;
  padding: 0;
  width: 18px;
}

/* Save Password: rounded square + solid app blue (not green circle / light cyan). */
.login-panel .login-form__save-password .password-field__show-check,
.login-panel .login-form .login-form__save-password > .password-field__show-check[data-login-save-password] {
  --app-checkbox-size: 20px;
  --app-checkbox-radius: 4px;
  --app-checkbox-checked-bg: var(--keshero-blue, #3a7bff);
  --app-checkbox-checked-border: var(--keshero-blue, #3a7bff);
  accent-color: var(--app-checkbox-checked-bg, var(--keshero-blue, #3a7bff));
  border-radius: var(--app-checkbox-radius, 4px);
  flex: 0 0 20px;
  height: 20px;
  max-height: 20px;
  max-width: 20px;
  min-height: 20px;
  min-width: 20px;
  /* Optical vertical center vs label text (native checkbox sits slightly low). */
  transform: translateY(-2px);
  width: 20px;
}

.login-panel .login-form__save-password .password-field__show-check:checked {
  background-color: var(--app-checkbox-checked-bg, var(--keshero-blue, #3a7bff));
  background-size: var(--app-checkbox-mark-size, 14px) var(--app-checkbox-mark-size, 14px);
  border-color: var(--app-checkbox-checked-border, var(--keshero-blue, #3a7bff));
}

/* Keep the saved-password control compact and left aligned despite shared form rules. */
.login-panel .login-form .password-field--block > input[type="password"],
.login-panel .login-form .password-field--block > input[type="text"] {
  margin-top: 0;
  min-height: var(--app-control-height, 38px);
}

.login-panel .login-form .password-field--block > .password-field__option-row {
  height: auto;
  min-height: var(--app-control-height, 38px);
}

.login-panel .login-form .password-field--block > .login-form__save-password {
  align-items: center !important;
  display: inline-flex !important;
  gap: 8px !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  line-height: 20px;
  margin: 4px 0 0 4px !important;
  max-width: max-content !important;
  min-height: 20px;
  width: max-content !important;
}

.login-panel .login-form .login-form__save-password > .password-field__show-check {
  flex: 0 0 20px !important;
  height: 20px !important;
  margin: 0 !important;
  max-height: 20px !important;
  max-width: 20px !important;
  min-height: 20px !important;
  min-width: 20px !important;
  transform: none;
  width: 20px !important;
}

.login-panel__sso {
  margin: 22px 0;
}

.login-panel__sso-button {
  align-items: center;
  background: #0f172a;
  border-radius: 10px;
  color: #fff;
  display: flex;
  font-weight: 900;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  text-decoration: none;
  transition: background-color 0.14s ease, box-shadow 0.14s ease, transform 0.14s ease;
  width: 100%;
}

.login-panel__sso-button:hover,
.login-panel__sso-button:focus-visible {
  background: #1e293b;
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.16);
  color: #fff;
  outline: none;
  transform: translateY(-1px);
}

.login-panel__divider {
  align-items: center;
  border-top: 0 !important;
  color: #667085;
  display: flex;
  font-size: 13px;
  gap: 12px;
  margin: 24px 0 18px;
}

.login-panel__divider::before,
.login-panel__divider::after {
  background: linear-gradient(90deg, transparent, rgba(46, 197, 255, 0.45), rgba(138, 43, 226, 0.35), transparent);
  content: "";
  flex: 1;
  height: 2px;
}

.login-panel__links {
  margin-top: 14px;
}

.login-panel__fallback {
  background: #fffbeb;
  border: 1px solid #fedf89;
  border-radius: 12px;
  color: #713b12;
  display: grid;
  gap: 8px;
  margin-top: 18px;
  padding: 14px;
}

.login-panel__fallback p {
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
}

.login-panel__fallback .app-button {
  width: max-content;
}

.login-panel .account-password-requirements {
  margin: 0;
}

.pm-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.pm-layout-toolbar {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin: 0 0 14px;
}

.pm-layout-status {
  color: var(--keshero-teal);
  font-size: 12px;
  font-weight: 700;
  min-height: 18px;
}

.pm-landing-hero {
  align-items: flex-start;
  background: linear-gradient(135deg, #ffffff 0%, #f4f7fb 100%);
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08);
  display: flex;
  gap: 20px;
  justify-content: space-between;
  margin: 18px 28px 14px;
  padding: 22px 24px;
}

.pm-landing-hero h1 {
  color: #0f172a;
  font-size: 28px;
  line-height: 1.15;
  margin: 0 0 8px;
}

.pm-landing-hero p {
  color: #475467;
  font-size: 14px;
  margin: 0;
}

.pm-hero-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.pm-metric-row {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  margin: 0 28px 14px;
}

.pm-metric-card {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
  padding: 14px 16px;
}

.pm-metric-card span {
  color: #667085;
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.pm-metric-card b {
  color: #0f172a;
  display: block;
  font-size: 26px;
  line-height: 1.1;
  margin-top: 8px;
}

.pm-metric-tile > span:not(.pm-metric-tile__hint)::after,
.pm-overview-kpi > span::after {
  content: ": ";
}

.pm-home-filters {
  align-items: end;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  margin: 14px 0;
  padding: 12px;
}

.pm-home-filters label {
  box-sizing: border-box;
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  min-width: 0;
}

.pm-home-filters input,
.pm-home-filters select {
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  box-sizing: border-box;
  font: inherit;
  min-height: 38px;
  min-width: 0;
  padding: 8px 10px;
  width: 100%;
}

.pm-status-chip {
  background: #eef4ff;
  border: 1px solid #c7d7fe;
  border-radius: 999px;
  color: var(--keshero-teal);
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  padding: 4px 8px;
  white-space: nowrap;
}

.pm-detail-back-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 28px 10px;
}

.pm-detail-layout-actions {
  margin-left: auto;
}

.pm-detail-grid {
  align-items: start;
  align-content: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
}

.pm-card {
  background: #fff;
  border: 1px solid var(--app-container-border-custom, var(--app-container-border, #cbd5e1));
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  overflow: auto;
  padding: 16px;
}

.pm-card.checkin-hub-filter-card {
  overflow: visible !important;
  position: relative;
  z-index: 30;
}

.pm-card.checkin-hub-filter-card .checkin-hub-filters,
.pm-card.checkin-hub-filter-card .checkin-hub-filter-group,
.pm-card.checkin-hub-filter-card .grid-filter-dropdown {
  overflow: visible !important;
}

.pm-card.checkin-hub-filter-card .checkin-hub-filter-group:has(.grid-filter-dropdown.is-open) {
  z-index: 1000;
}

.pm-card.checkin-hub-filter-card .grid-filter-dropdown-panel {
  z-index: 10000 !important;
}

.pm-detail-grid .pm-card {
  flex: 0 1 360px;
  min-height: 180px;
  min-width: 280px;
  max-width: 100%;
  position: relative;
}

.pm-detail-grid .pm-card[draggable="true"] {
  cursor: grab;
}

.pm-detail-grid .pm-card[draggable="true"].is-dragging {
  cursor: grabbing;
}

.pm-detail-grid .pm-card[draggable="true"] input,
.pm-detail-grid .pm-card[draggable="true"] textarea,
.pm-detail-grid .pm-card[draggable="true"] [contenteditable="true"] {
  cursor: text;
}

.pm-detail-grid .pm-card[draggable="true"] select,
.pm-detail-grid .pm-card[draggable="true"] button,
.pm-detail-grid .pm-card[draggable="true"] a,
.pm-detail-grid .pm-card[draggable="true"] label,
.pm-detail-grid .pm-card[draggable="true"] summary,
.pm-detail-grid .pm-card[draggable="true"] [role="button"] {
  cursor: pointer;
}

.pm-detail-grid .pm-card--overview {
  flex: 1 1 100%;
  max-width: 100%;
  width: 100%;
}

.pm-detail-grid .pm-card.is-dragging {
  opacity: 0.55;
}

.pm-detail-grid .pm-card.is-drop-target {
  outline: 2px dashed #2ec5ff;
  outline-offset: 4px;
}

.pm-detail-grid .pm-card.is-resizing {
  user-select: none;
}

.pm-card-move,
.pm-card-resize {
  display: none !important;
}

.pm-card--wide {
  flex-basis: 100%;
  width: 100%;
}

.pm-card h3 {
  color: #0f172a;
  margin: 0 0 12px;
}

.pm-board-card-head {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.pm-board-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.pm-board-chip {
  background: #eff6ff;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--keshero-teal);
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  padding: 4px 8px;
}

.pm-board-chip.pm-assignment-badge {
  background: #3A7BFF;
  border-color: #3A7BFF;
  color: #fff;
}

.pm-board-chip.pm-assignment-badge--goal,
.pm-board-chip--goal {
  background: #5A4BFF;
  border-color: #5A4BFF;
  color: #fff;
}

.pm-board-chip--task {
  background: #3A7BFF;
  border-color: #3A7BFF;
  color: #fff;
}

.pm-board-chip--due {
  background: #f8fafc;
  color: #475467;
}

.pm-board-card-link {
  color: var(--keshero-teal);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.pm-board-card-link:hover {
  text-decoration: underline;
}

.app-required-label-text {
  display: inline;
  white-space: nowrap;
}

.app-field-required-note {
  color: var(--app-action-danger);
  display: block;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  margin-top: 4px;
}

.app-field-required-note[hidden] {
  display: none !important;
}

.app-line-list-editor {
  display: grid;
  gap: 8px;
}

.app-line-list-row {
  align-items: center;
  display: flex;
  gap: 8px;
}

.app-line-list-row input {
  flex: 1 1 auto;
  min-width: 0;
}

.app-line-list-row .button-danger-small {
  flex: 0 0 auto;
}

button[data-line-list-add].button-add-small {
  justify-self: start;
}

textarea[data-line-list-editor] {
  display: none !important;
}

.keshero-date-format-native {
  border: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  max-width: 34px !important;
  min-width: 0 !important;
  opacity: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  width: 34px !important;
}

.keshero-date-format-field {
  display: block;
  height: var(--app-control-height, 38px);
  max-width: 100%;
  min-height: var(--app-control-height, 38px);
  min-width: 0;
  position: relative;
  vertical-align: middle;
  width: 100%;
}

.keshero-date-format-input {
  box-sizing: border-box;
  height: var(--app-control-height, 38px) !important;
  max-height: var(--app-control-height, 38px) !important;
  max-width: 100% !important;
  min-height: var(--app-control-height, 38px) !important;
  min-width: 0 !important;
  padding-right: 34px !important;
  width: 100% !important;
}

.keshero-date-format-input:focus {
  border-color: var(--app-action-primary);
  box-shadow: none;
  outline: none;
  position: relative;
  z-index: 0;
}

.keshero-date-format-field:has(.keshero-date-format-input:focus) {
  border-radius: 8px;
  box-shadow: 0 0 0 4px var(--app-focus-ring);
}

.keshero-date-format-field:has(.keshero-date-format-input:focus) .keshero-date-format-calendar {
  border-color: var(--app-action-primary);
  z-index: 1;
}

.keshero-date-format-calendar {
  align-items: center;
  background: var(--app-action-secondary);
  border: 1px solid #cfd8e3;
  border-left: 0;
  border-radius: 0 8px 8px 0;
  box-sizing: border-box;
  color: var(--app-muted);
  cursor: pointer;
  display: inline-flex;
  height: var(--app-control-height, 38px);
  justify-content: center;
  max-height: var(--app-control-height, 38px);
  min-height: var(--app-control-height, 38px);
  padding: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 34px;
  z-index: 1;
}

.keshero-date-format-calendar svg {
  fill: none;
  height: 17px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 17px;
}

.keshero-date-format-calendar:hover,
.keshero-date-format-calendar:focus-visible {
  background: #eef9ff;
  color: var(--app-action-primary-border);
  outline: none;
}

html[data-keshero-theme="dark"] .keshero-date-format-calendar {
  background: #162234;
  border-color: #475569;
  color: #dbeafe;
}

html[data-keshero-theme="dark"] .keshero-date-format-calendar:hover,
html[data-keshero-theme="dark"] .keshero-date-format-calendar:focus-visible {
  background: #1f3148;
  color: #7dd3fc;
}

.app-required-summary {
  background: var(--app-danger-surface);
  border: 1px solid var(--app-danger-border-strong);
  border-radius: 8px;
  color: var(--app-action-danger-hover);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  margin: 0 0 12px;
  padding: 10px 12px;
}

.app-required-summary[hidden] {
  display: none !important;
}

input.app-field-missing,
select.app-field-missing,
textarea.app-field-missing {
  border-color: var(--app-action-danger) !important;
  box-shadow: 0 0 0 3px rgba(255, 77, 90, 0.14) !important;
}

select.app-field-missing + .app-rounded-select .app-rounded-select__button,
.app-rounded-select.is-invalid .app-rounded-select__button {
  border-color: var(--app-action-danger) !important;
  box-shadow: 0 0 0 3px rgba(255, 77, 90, 0.14) !important;
}

.pm-section-header {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 12px;
}

.pm-section-header h3 {
  margin: 0;
}

.promotion-nomination-packet-page {
  display: grid;
  gap: 16px;
}

.promotion-nomination-packet-page > .pm-section-header {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  margin: 0;
  padding: 14px 16px;
}

.promotion-nomination-packet-page > .promotion-nomination-list {
  margin: 0;
}

.promotion-nomination-form {
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  padding: 14px;
}

.promotion-nomination-form fieldset {
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-column: 1 / -1;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin: 0;
  padding: 14px;
}

.promotion-nomination-form legend {
  color: var(--keshero-teal);
  font-size: 13px;
  font-weight: 800;
  padding: 0 6px;
}

.promotion-nomination-form textarea,
.promotion-nomination-form select[multiple] {
  min-height: 92px;
}

.promotion-nomination-form__checks {
  align-items: start;
}

.promotion-nomination-form__checks label,
.promotion-nomination-form fieldset > label:has(input[type="checkbox"]) {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 8px;
}

.promotion-nomination-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  grid-column: 1 / -1;
}

.promotion-confidentiality-banner,
.promotion-manager-warning,
.promotion-evidence-picker-note,
.promotion-settings-panel {
  border-radius: 8px;
  grid-column: 1 / -1;
  line-height: 1.45;
  padding: 10px 12px;
}

.promotion-confidentiality-banner {
  align-items: center;
  background: #eff6ff;
  border: 1px solid #bfd7ff;
  color: #174ea6;
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}

.promotion-manager-warning {
  background: #fff8e6;
  border: 1px solid #f5d58a;
  color: #7a4a00;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 12px;
}

.promotion-evidence-picker-note,
.promotion-settings-panel {
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  color: #475467;
  font-size: 13px;
}

.promotion-review-panel__header {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  margin-bottom: 8px;
}

.promotion-review-panel__header span {
  color: #667085;
  font-size: 12px;
  font-weight: 700;
}

.promotion-active-summary {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  margin-bottom: 12px;
  padding: 12px;
}

.promotion-active-summary > div {
  display: grid;
  gap: 4px;
}

.promotion-active-summary span {
  color: #667085;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.promotion-active-summary strong {
  color: #101828;
  font-size: 13px;
  line-height: 1.3;
}

.promotion-active-summary__actions {
  align-content: start;
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
}

.promotion-approval-timeline {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.promotion-approval-timeline__step {
  background: #f8fafc;
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  color: #475467;
  font-size: 11px;
  font-weight: 800;
  padding: 3px 8px;
}

.promotion-approval-timeline__step.is-done {
  background: var(--app-success-surface);
  border-color: var(--app-success-border);
  color: var(--app-success-fg);
}

.promotion-approval-timeline__step.is-current {
  background: #eff6ff;
  border-color: #2ec5ff;
  color: var(--keshero-teal);
}

.promotion-review-history {
  margin-top: 8px;
}

.promotion-review-history summary {
  color: var(--keshero-teal);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.promotion-review-history__list {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.promotion-review-history__item {
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  display: grid;
  gap: 3px;
  padding: 8px;
}

.promotion-review-history__item span,
.promotion-review-history__item p {
  color: #475467;
  font-size: 12px;
  margin: 0;
}

.pm-cycle-filter label {
  align-items: center;
  color: #344054;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  gap: 8px;
}

.pm-cycle-filter select {
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  font: inherit;
  padding: 7px 9px;
}

.pm-table-scroll {
  overflow: auto;
}

.pm-assignment-list-scroll {
  max-height: var(--pm-manage-viewport-height, min(78vh, 840px));
}

.pm-manage-board-surface {
  --pm-manage-viewport-height: min(78vh, 840px);
}

.pm-task-board-scroll {
  --pm-board-viewport-height: var(--pm-manage-viewport-height, min(78vh, 840px));
}

.pm-timeline-planner__viewport,
.pm-focus-groups,
.pm-workload-table-wrap {
  max-height: var(--pm-manage-viewport-height, min(78vh, 840px));
  overscroll-behavior: contain;
}

.pm-table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}

.pm-assignment-list-table {
  --pm-list-id-width: 185px;
  --pm-list-title-width: 260px;
  min-width: 1760px;
}

.pm-assignment-list-table th {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.015em;
  position: sticky;
  top: 0;
  vertical-align: middle;
  white-space: nowrap;
  z-index: 3;
}

.pm-assignment-list-table .pm-list-sticky-id,
.pm-assignment-list-table .pm-list-sticky-title {
  background: #fff;
  position: sticky;
}

.pm-assignment-list-table .pm-list-sticky-id {
  left: 0;
  max-width: var(--pm-list-id-width);
  min-width: var(--pm-list-id-width);
  width: var(--pm-list-id-width);
  z-index: 2;
}

.pm-assignment-list-table .pm-list-sticky-title {
  left: var(--pm-list-id-width);
  max-width: var(--pm-list-title-width);
  min-width: var(--pm-list-title-width);
  width: var(--pm-list-title-width);
  z-index: 2;
}

.pm-assignment-list-table th.pm-list-sticky-id,
.pm-assignment-list-table th.pm-list-sticky-title {
  background: #f8fafc;
  z-index: 5;
}

.pm-assignment-list-table .pm-list-sticky-title {
  box-shadow: 1px 0 0 #e4e7ec, 8px 0 12px -12px rgba(15, 23, 42, 0.45);
}

.pm-assignment-list-table.pm-table tbody tr.pm-task-card--goal,
.pm-assignment-list-table.pm-table tbody tr.pm-task-card--goal > td,
.pm-assignment-list-table tr.pm-task-card--goal > .pm-list-sticky-id,
.pm-assignment-list-table tr.pm-task-card--goal > .pm-list-sticky-title {
  background: #f5f3ff;
}

.pm-assignment-list-table.pm-table tbody tr.pm-task-card--goal-child,
.pm-assignment-list-table.pm-table tbody tr.pm-task-card--goal-child > td,
.pm-assignment-list-table tr.pm-task-card--goal-child > .pm-list-sticky-id,
.pm-assignment-list-table tr.pm-task-card--goal-child > .pm-list-sticky-title {
  background: #f8fafc;
}

.pm-assignment-list-table .pm-list-sticky-id--goal-child,
.pm-assignment-list-table .pm-list-sticky-title--goal-child {
  padding-left: 32px;
}

.pm-assignment-list-table .pm-list-subtask-detail-cell--goal-child .pm-list-subtasks,
.pm-assignment-list-table .pm-list-subtask-detail-cell--goal-child .pm-list-milestones {
  padding-left: 32px;
}

.pm-assignment-list-table .pm-list-subtask-detail-cell--task .pm-list-subtasks,
.pm-assignment-list-table .pm-list-subtask-detail-cell--task .pm-list-milestones {
  padding-left: 28px;
}

.pm-assignment-list-table .pm-list-created-date,
.pm-assignment-list-table .pm-list-start-date,
.pm-assignment-list-table .pm-list-due-date,
.pm-assignment-list-table .pm-list-updated-date,
.pm-assignment-list-table .pm-list-breakdown {
  white-space: nowrap;
}

.pm-assignment-list-table .pm-list-related-goal {
  max-width: 210px;
  min-width: 210px;
  text-align: left !important;
  width: 210px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

.pm-assignment-list-table th.pm-list-related-goal {
  text-align: left !important;
}

.pm-assignment-list-table .pm-list-related-goal.pm-list-truncate {
  overflow: visible;
  text-overflow: unset;
  white-space: normal;
}

.pm-assignment-list-table .pm-list-created-date,
.pm-assignment-list-table .pm-list-start-date,
.pm-assignment-list-table .pm-list-due-date {
  min-width: 110px;
}

.pm-assignment-list-table .pm-list-updated-date {
  min-width: 150px;
}

.pm-assignment-list-table .pm-list-breakdown {
  min-width: 190px;
}

.pm-assignment-list-table .pm-list-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-assignment-list-table tbody td {
  font-size: 14px;
  line-height: 1.45;
  vertical-align: middle;
}

.pm-assignment-list-table .pm-list-sticky-title {
  overflow: visible;
  text-align: left;
  text-overflow: clip;
  white-space: normal;
}

.pm-assignment-list-table .pm-list-sticky-title a {
  display: inline;
  text-align: left;
}

.pm-assignment-list-table .pm-list-evidence-cell {
  text-align: center;
  width: 88px;
}

.pm-assignment-list-table .pm-evidence-trigger--list {
  align-items: center;
  display: inline-flex;
  font-size: 15px;
  font-weight: 700;
  justify-content: center;
  min-height: 34px;
  min-width: 34px;
  padding: 4px 10px;
}

.pm-assignment-list-table .pm-list-keshboard-cell {
  max-width: 185px;
  width: 185px;
}

.pm-assignment-list-table .pm-list-person-cell {
  max-width: 220px;
  width: 220px;
}

.pm-assignment-list-table .pm-list-people-cell {
  max-width: 190px;
  width: 190px;
}

[data-pm-board-full-view-root].is-pm-board-full-view .pm-assignment-list-scroll,
[data-pm-board-full-view-root].is-pm-board-full-view .pm-task-board-scroll,
[data-pm-board-full-view-root].is-pm-board-full-view .pm-manage-board-surface {
  --pm-manage-viewport-height: calc(100vh - 92px);
  --pm-board-viewport-height: calc(100vh - 92px);
}

[data-pm-board-full-view-root].is-pm-board-full-view .pm-assignment-list-scroll {
  max-height: calc(100vh - 92px);
}

html[data-keshero-theme="dark"] .pm-assignment-list-table .pm-list-sticky-id,
html[data-keshero-theme="dark"] .pm-assignment-list-table .pm-list-sticky-title {
  background: var(--app-surface);
}

html[data-keshero-theme="dark"] .pm-assignment-list-table th.pm-list-sticky-id,
html[data-keshero-theme="dark"] .pm-assignment-list-table th.pm-list-sticky-title {
  background: var(--app-table-header-bg);
}

.pm-table th,
.pm-table td {
  border-bottom: 1px solid #e4e7ec;
  padding: 9px 8px;
  text-align: left;
}

.pm-table th {
  background: #f8fafc;
  color: #344054;
  font-size: 12px;
}

.pm-detail-header {
  align-items: center;
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
  box-sizing: border-box;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 14px;
  padding: 16px;
  width: 100%;
}

.pm-detail-header h3 {
  color: #0f172a;
  margin: 0;
}

.pm-detail-meta {
  color: #475467;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  font-size: 13px;
}

.pm-tabs {
  margin: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.pm-tabs a[hidden] {
  display: none !important;
}

.pm-overview-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.pm-overview-grid div {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 12px;
}

.pm-overview-grid span {
  color: #667085;
  display: block;
  font-size: 12px;
}

.pm-overview-grid b {
  color: #0f172a;
  display: block;
  font-size: 18px;
  margin-top: 4px;
}

.pm-count-line {
  color: #475467;
  font-size: 14px;
}

.pm-form {
  display: grid;
  gap: 12px;
}

.pm-form label {
  color: #344054;
  display: grid;
  font-size: 13px;
  font-weight: 700;
  gap: 6px;
}

.pm-form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
.pm-form select,
.pm-form textarea {
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  font: inherit;
  padding: 9px 10px;
  width: 100%;
}

.pm-form textarea {
  resize: vertical;
}

/* PM task / form sections: label + control stack per column; do not stretch short
   fields to match a tall textarea in the same grid row (grid default is stretch). */
.pm-form-sections {
  display: grid;
  gap: 16px;
}

.pm-form-section {
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  display: grid;
  gap: 12px;
  padding: 14px;
}

.pm-form-section h4 {
  margin: 0;
}

.pm-form-section-grid {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
}

.pm-form-section-grid--wide {
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
}

/* Tighter columns so several selects (e.g. Ownership & Type) fit one row on typical widths */
.pm-form-section-grid--compact {
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(min(168px, 100%), 1fr));
}

.pm-form-section-grid > label,
.pm-form-section-grid--compact > label {
  min-width: 0;
}

.pm-form-section-grid > .is-wide-field {
  grid-column: 1 / -1;
  min-width: 0;
  width: 100%;
}

.pm-form-section-grid > .is-wide-field textarea {
  display: block;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.pm-task-meta-grid {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

/* Other responsive field/card rows in grids: same anti-stretch behavior */
.pm-board-toolbar,
.pm-board-form-grid,
.cycle-import-grid,
.succession-bench-dev-grid,
.succession-org-modal-summary,
.succession-org-modal-successor__meta {
  align-items: start;
}

.pm-compact-form {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  margin-bottom: 14px;
  padding: 12px;
}

.pm-subheading {
  color: #344054;
  font-size: 14px;
  margin: 16px 0 8px;
}

.pm-rating-grid {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.pm-inline-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.pm-inline-form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
.pm-inline-form select {
  border: 1px solid #cfd8e3;
  border-radius: 6px;
  font: inherit;
  min-width: 140px;
  padding: 6px 8px;
}

.pm-recognition-list {
  display: grid;
  gap: 12px;
}

.pm-recognition-item {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border: 1px solid #dbe7f4;
  border-radius: 12px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
  overflow: hidden;
  padding: 0;
  transition: border-color 0.14s ease, box-shadow 0.14s ease, transform 0.14s ease;
}

.pm-recognition-item:hover,
.pm-recognition-item[open] {
  border-color: #b8d9f8;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
}

.pm-recognition-item summary {
  align-items: center;
  color: #344054;
  cursor: pointer;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  list-style: none;
  padding: 12px 14px;
}

.pm-recognition-item summary::-webkit-details-marker {
  display: none;
}

.pm-recognition-item__main {
  align-items: center;
  display: flex;
  flex: 1 1 auto;
  gap: 10px;
  min-width: 0;
}

.pm-recognition-item__avatar {
  align-items: center;
  background: linear-gradient(135deg, #2ec5ff, #5a4bff);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  flex: 0 0 34px;
  font-size: 13px;
  font-weight: 900;
  height: 34px;
  justify-content: center;
  text-transform: uppercase;
  width: 34px;
}

.pm-recognition-item .person-avatar--recognition {
  flex: 0 0 34px;
  font-size: 12px;
  font-weight: 800;
  height: 34px;
  min-width: 34px;
  width: 34px;
}

.pm-recognition-item .person-avatar--recognition .person-avatar__initials {
  line-height: 1;
}

.pm-recognition-item__text {
  display: grid;
  gap: 3px;
  flex: 1 1 auto;
  min-width: 0;
}

.pm-recognition-item__body {
  align-items: flex-start;
  display: flex;
  flex: 1 1 auto;
  gap: 12px;
  justify-content: space-between;
  min-width: 0;
}

.pm-recognition-item__copy {
  display: grid;
  flex: 1 1 auto;
  gap: 2px;
  min-width: 0;
}

.pm-recognition-item__aside {
  align-items: flex-end;
  display: flex;
  flex: 0 1 auto;
  flex-direction: column;
  gap: 6px;
  max-width: min(52%, 320px);
  min-width: 0;
}

.pm-recognition-item__copy b,
.pm-recognition-item__text b {
  color: #101828;
  font-size: 14px;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-recognition-item__text > span:not(.pm-recognition-item__meta),
.pm-recognition-item__meta > span:first-child {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.pm-recognition-item__meta {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
}

.pm-recognition-item__meta > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-recognition-item__date {
  color: #667085;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  padding: 0;
  white-space: nowrap;
}

.pm-recognition-item__from {
  color: #475467;
  font-size: 12px;
  font-weight: 600;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-recognition-item__from strong {
  color: #344054;
  font-weight: 800;
}

.pm-recognition-item__tags {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
  margin-top: 0;
}

.pm-recognition-item__tag {
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  color: #1d4ed8;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  max-width: 160px;
  overflow: hidden;
  padding: 3px 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-recognition-body {
  background: rgba(255, 255, 255, 0.72);
  border-top: 1px solid #edf2f7;
  color: #344054;
  display: grid;
  gap: 6px;
  line-height: 1.5;
  padding: 12px 14px 14px;
  white-space: pre-wrap;
}

.pm-recognition-body__label {
  color: #667085;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pm-recognition-body__link {
  align-items: center;
  color: #175cd3;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  margin-top: 4px;
  text-decoration: none;
  white-space: normal;
  width: fit-content;
}

.pm-recognition-body__link:hover {
  color: #0b4ea2;
  text-decoration: underline;
}

.pm-recognition-body__link .app-external-link-icon {
  flex: 0 0 auto;
}

@media (max-width: 640px) {
  .pm-recognition-item summary {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .pm-recognition-item__body {
    align-items: stretch;
    flex-direction: column;
    gap: 6px;
  }

  .pm-recognition-item__aside {
    align-items: flex-start;
    max-width: none;
  }

  .pm-recognition-item__tags {
    justify-content: flex-start;
  }

  .pm-recognition-item__date {
    margin-left: 0;
  }

  .pm-recognition-body {
    padding-left: 14px;
  }
}

.pm-manage-board-surface .pm-task-board {
  align-items: stretch;
  box-sizing: border-box;
  display: flex;
  gap: 16px;
  grid-template-columns: none;
  height: calc(var(--pm-manage-viewport-height, min(78vh, 840px)) - var(--pm-board-scroll-chrome, 14px));
  margin: 0;
  max-height: calc(var(--pm-manage-viewport-height, min(78vh, 840px)) - var(--pm-board-scroll-chrome, 14px));
  min-height: 0;
}

.pm-task-board {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin: 16px 0;
}

.pm-manage-board-surface .pm-task-column {
  align-self: stretch;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
}

details.pm-task-column[open] {
  min-height: 180px;
}

.pm-manage-board-surface details.pm-task-column[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
}

.pm-task-column__scroll-host {
  display: flex;
  flex-direction: column;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
}

.pm-task-column h4 {
  align-items: flex-start;
  display: flex;
  font-size: 0.88rem;
  gap: 8px;
  justify-content: space-between;
  margin: 0 0 10px;
}

.pm-task-column > summary.pm-task-column__header {
  align-items: center;
  align-self: start;
  justify-content: flex-start;
}

.pm-task-column h4 .pm-task-column__title,
.pm-task-column summary .pm-task-column__title {
  flex: 1;
  min-width: 0;
}

.pm-task-column > summary.pm-task-column__header .pm-task-column__count {
  margin-left: auto;
}

.pm-task-column h4 .pm-task-column__count {
  background: #eef4ff;
  border-radius: 999px;
  color: var(--keshero-teal);
  flex-shrink: 0;
  font-size: 0.88rem;
  font-weight: 700;
  padding: 2px 8px;
}

.pm-task-column__visible,
.pm-task-column__archive {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  max-height: none;
  overflow: visible;
}

.pm-task-column__sections {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 4px;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.pm-task-column__visible > summary,
.pm-task-column__archive > summary {
  --app-disclosure-chevron-size: 7px;
  align-items: center;
  color: var(--app-label-color, #344054);
  cursor: pointer;
  font-size: var(--app-control-font-size, 13px);
  font-weight: 600;
  gap: 8px;
  justify-content: flex-start;
  padding: 4px 8px 4px 12px;
}

.pm-task-column__section-label {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: 0.01em;
}

.pm-task-column__overflow {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 10px;
}

.pm-task-column__overflow[hidden] {
  display: none !important;
}

.pm-task-column__archive {
  border-top: 1px solid var(--app-border-soft);
  margin-top: 8px;
  padding-top: 6px;
}

.pm-task-column__archive > summary {
  align-items: center;
  justify-content: flex-start;
}

.pm-task-column__visible-count,
.pm-task-column__archive-count {
  background: #f2f4f7;
  border-radius: 999px;
  color: #344054;
  font-size: 0.75rem;
  font-weight: 700;
  min-width: 1.5rem;
  padding: 2px 8px;
  text-align: center;
}

.pm-task-column__body,
.pm-task-column__archive-body {
  flex: 0 0 auto;
  max-height: none;
  overflow: visible;
}

.pm-task-column__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.pm-task-column__archive-body {
  display: grid;
  gap: 10px;
  margin-top: 8px;
}

.pm-board-chip--archived {
  background: #f2f4f7;
  border-color: #d0d5dd;
  color: #475467;
}

.pm-task-card--archived {
  opacity: 0.92;
}

.pm-task-card__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* Keep visual container numbers anchored consistently in the lower-left. */
.pm-metric-card,
.spotlight-dashboard-kpis > div,
.comp-analysis-card,
.comp-stat-card,
.succession-kpi {
  position: relative;
}

.pm-metric-card,
.spotlight-dashboard-kpis > div,
.comp-analysis-card,
.comp-stat-card,
.succession-kpi {
  min-height: 92px;
  padding-bottom: 42px;
}

.pm-metric-card b,
.spotlight-dashboard-kpis b,
.comp-analysis-card b,
.comp-stat-card b,
.succession-kpi-value {
  bottom: 12px;
  left: 14px;
  margin-top: 0;
  position: absolute;
  text-align: left;
}

.pm-task-card,
.pm-task-detail-card {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: var(--app-radius-card);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.045);
}

.pm-task-card {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
  padding: 12px;
}

.pm-task-card span:not(.person-avatar):not(.person-avatar__initials):not(.person-avatar__img):not(.pm-board-card-assignee__avatar):not(.pm-board-card-assignee__name):not(.pm-assignment-badge):not(.pm-board-chip--goal):not(.pm-board-chip--task),
.pm-task-detail-card small {
  color: #667085;
  font-size: 0.82rem;
}

/* Goal/Task type pills: white on blue/purple. Card-meta gray above must not override these. */
.pm-task-card .pm-board-chip.pm-assignment-badge,
.pm-task-card .pm-board-chip.pm-assignment-badge--goal,
.pm-task-card .pm-board-chip--goal,
.pm-task-card .pm-board-chip--task {
  color: #fff;
}

/* Keep assignee initials on the person avatar color pipeline (not muted card-meta gray) */
.pm-task-card .pm-board-card-assignee__avatar .person-avatar__initials {
  color: inherit;
  font-size: 13px;
  font-weight: 900;
}

.pm-task-card select {
  width: 100%;
}

.pm-task-detail-list {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

.pm-task-detail-card {
  padding: 0;
}

.pm-task-detail-card summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  list-style: none;
  padding: 14px 16px;
}

.pm-task-detail-card summary::-webkit-details-marker {
  display: none;
}

.pm-task-detail-card summary span:first-child {
  display: grid;
  gap: 3px;
}

.pm-task-detail-grid {
  border-top: 1px solid #e4e7ec;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(280px, 1fr) minmax(280px, 1fr);
  padding: 16px;
}

.pm-task-comments {
  display: grid;
  gap: 10px;
  margin: 8px 0 14px;
}

.pm-task-comments > div:not(.home-empty) {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 10px 12px;
}

.pm-task-comments span {
  color: #667085;
  display: block;
  font-size: 0.78rem;
  margin-top: 2px;
}

.pm-task-comments p {
  margin: 8px 0 0;
}

.pm-comments-activity-header {
  align-items: flex-end;
  margin-bottom: 12px;
}

.pm-comments-activity-tabs {
  flex: 1 1 auto;
  margin: 0;
  width: 100%;
}

.pm-comments-activity-panel[hidden] {
  display: none !important;
}

.pm-comments-activity-note {
  margin: 8px 0 0;
}

.pm-task-activity {
  display: grid;
  gap: 8px;
}

.pm-task-activity__list {
  display: grid;
  gap: 8px;
  max-height: min(360px, 52vh);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 2px;
  scrollbar-gutter: stable;
}

.pm-task-activity__list[hidden] {
  display: none;
}

.pm-task-activity__row {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 6px;
  padding: 10px 12px;
}

.pm-task-activity__meta {
  align-items: flex-start;
  color: #667085;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  justify-content: space-between;
  min-width: 0;
}

.pm-task-activity__actor {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.pm-task-activity__name,
.pm-task-activity__meta b {
  color: #182230;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-task-activity__email {
  color: #98a2b3;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-task-activity__time,
.pm-task-activity__meta > span:not(.pm-task-activity__name):not(.pm-task-activity__email) {
  color: #98a2b3;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.35;
  margin-left: auto;
  text-align: right;
  white-space: nowrap;
}

.pm-task-activity__summary {
  color: #344054;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.45;
  margin: 0;
}

.pm-task-activity__changes {
  color: #344054;
  display: grid;
  font-size: 13px;
  font-weight: 500;
  gap: 3px;
  line-height: 1.45;
  list-style: disc;
  margin: 0;
  padding-left: 18px;
}

.pm-subtask-row {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(150px, 1fr) 140px 140px 120px auto;
  margin-bottom: 8px;
}

@media (max-width: 760px) {
  .pm-task-detail-grid,
  .pm-subtask-row {
    grid-template-columns: 1fr;
  }
}

.succession-edit-hint {
  font-size: 13px;
  color: #64748b;
  margin: 0 0 10px;
  line-height: 1.45;
  max-width: none;
  width: 100%;
}

.succession-edit-textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  font-family: inherit;
  font-size: 13px;
}

.succession-color-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 16px;
  align-items: center;
}

.settings-module-coloring .succession-color-row {
  align-items: stretch;
  gap: 14px 18px;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
}

.settings-module-coloring .succession-color-row.settings-calendar-color-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.succession-color-row > label {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.succession-color-row > label > span {
  flex: 0 0 auto;
}

.succession-color-input {
  width: 100px;
  margin-left: 6px;
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid #cbd5e1;
}

.settings-module-coloring .succession-color-row > label {
  align-items: stretch;
  background: var(--app-surface-muted);
  border: 1px solid var(--app-border);
  border-radius: 10px;
  color: var(--app-heading);
  flex-direction: column;
  font-size: 13px;
  font-weight: 700;
  gap: 8px;
  justify-content: flex-start;
  padding: 12px 14px;
}

.settings-module-coloring .succession-color-row > label > span:last-child {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
}

.settings-module-coloring .succession-color-input {
  margin-left: 0;
  max-width: 180px;
  width: 100%;
}

.settings-module-coloring [data-color-swatch] {
  border: 1px solid var(--app-border) !important;
  border-radius: 6px !important;
  flex-shrink: 0;
  height: 28px !important;
  min-width: 28px;
  width: 28px !important;
}

.settings-module-coloring .settings-calendar-color-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 38px;
  width: 100%;
}

.settings-module-coloring .settings-calendar-color-control .succession-color-input {
  font-weight: 800;
  max-width: none;
  min-height: 38px;
  text-transform: uppercase;
}

.settings-module-coloring .settings-calendar-color-native {
  background: #fff;
  border: 1px solid #d0d5dd !important;
  border-radius: 8px !important;
  cursor: pointer;
  height: 38px !important;
  min-width: 38px;
  padding: 5px;
  width: 38px !important;
}

.settings-module-coloring .settings-calendar-color-native::-webkit-color-swatch-wrapper {
  padding: 0;
}

.settings-module-coloring .settings-calendar-color-native::-webkit-color-swatch {
  border: 0;
  border-radius: 5px;
}

.settings-module-coloring .settings-calendar-color-native:focus-visible {
  border-color: #2ec5ff !important;
  box-shadow: 0 0 0 4px rgba(46, 197, 255, 0.22);
  outline: none;
}

.settings-module-coloring .settings-calendar-color-labelblock {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.settings-module-coloring .settings-calendar-color-title {
  color: var(--app-heading);
  font-size: 13px;
  font-weight: 700;
}

.settings-module-coloring .settings-calendar-color-hint {
  color: #667085;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
}

@media (max-width: 920px) {
  .succession-color-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .settings-module-coloring .succession-color-row.settings-calendar-color-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .settings-module-coloring .succession-color-row.settings-calendar-color-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Shared card and panel normalization. Keep this late so older page-specific styles inherit the same finish. */
.panel,
.home-table-wrap,
.inbox-panel,
.spotlight-compose,
.spotlight-card,
.spotlight-dashboard,
.succession-edit-section,
.pm-card,
.admin-proxy-user-row,
.comp-config-section,
.comp-analysis-card,
.comp-stat-card,
.grid-top-legend-panel,
.grid-charts-panel,
.perf-da-card,
.succession-bench-card,
.succession-bench-container-card {
  background-color: var(--app-surface);
  border-color: var(--app-border);
  border-radius: var(--app-radius-card);
  box-shadow: var(--app-shadow-card);
}

.panel,
.home-table-wrap,
.inbox-panel,
.spotlight-compose,
.spotlight-dashboard,
.succession-edit-section,
.pm-card,
.comp-config-section,
.grid-top-legend-panel,
.grid-charts-panel,
.perf-da-card,
.succession-bench-card,
.succession-bench-container-card {
  padding: var(--app-card-padding);
}

.home-table-wrap,
.pm-card,
.succession-edit-section,
.comp-config-section,
.inbox-panel,
.spotlight-card,
.perf-da-card,
.succession-bench-card {
  transition: box-shadow 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.home-table-wrap:hover,
.pm-card:hover,
.succession-edit-section:hover,
.comp-config-section:hover,
.inbox-panel:hover,
.spotlight-card:hover,
.perf-da-card:hover,
.succession-bench-card:hover {
  border-color: #cbd5e1;
  box-shadow: var(--app-shadow-card-hover);
}

.home-table-wrap h3,
.panel h3,
.pm-card h3,
.succession-edit-section h3,
.comp-config-section h3,
.spotlight-compose h3,
.spotlight-stream h3,
.inbox-panel h3,
.perf-da-card h4,
.succession-bench-card__title {
  color: var(--app-heading);
  letter-spacing: 0;
}

.home-empty,
.perf-da-empty,
.da-empty {
  background: var(--app-surface-muted);
  border: 1px dashed #cfd8e3;
  border-radius: var(--app-radius-card);
  color: var(--app-muted);
  padding: 14px 16px;
}

/* Shared table finish for the main data-heavy pages. */
.home-cycles-table,
.inbox-table,
.spotlight-dashboard-table,
.da-summary-table,
.succession-table,
.succession-bench-table,
.pm-table,
.admin-grid-filters-table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}

.home-cycles-table th,
.home-cycles-table td,
.inbox-table th,
.inbox-table td,
.spotlight-dashboard-table th,
.spotlight-dashboard-table td,
.da-summary-table th,
.da-summary-table td,
.succession-table th,
.succession-table td,
.succession-bench-table th,
.succession-bench-table td,
.pm-table th,
.pm-table td,
.admin-grid-filters-table th,
.admin-grid-filters-table td {
  border: 0;
  border-bottom: 1px solid var(--app-table-border);
}

.home-cycles-table thead th,
.inbox-table th,
.spotlight-dashboard-table th,
.da-summary-table thead th,
.succession-table th,
.succession-bench-table th,
.pm-table th,
.admin-grid-filters-table th {
  background: var(--app-table-header-bg);
  color: var(--app-table-header-text);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  text-transform: none;
}

/* Column titles are Title Case in the markup. Do not force ALL CAPS. */
table thead th {
  text-align: center !important;
  text-transform: none;
}

table thead th > *,
table thead th a,
table thead th button {
  text-align: center;
}

table tbody td:not(:first-child) {
  text-align: center;
}

table tbody td:not(:first-child) > input:not([type="hidden"]),
table tbody td:not(:first-child) > select {
  text-align: center;
}

.pm-long-text-cell,
table tbody td.pm-long-text-cell,
table tbody td:not(:first-child).pm-long-text-cell {
  line-height: 1.45;
  text-align: left !important;
  vertical-align: top;
  white-space: normal;
}

.pm-long-text-cell textarea,
table tbody td.pm-long-text-cell textarea {
  text-align: left !important;
}

table thead th.pm-long-text-cell {
  text-align: center !important;
}

table tbody td:first-child {
  text-align: left;
}

.home-cycles-table tbody tr:nth-child(even),
.inbox-table tbody tr:nth-child(even),
.spotlight-dashboard-table tbody tr:nth-child(even),
.da-summary-table tbody tr:nth-child(even),
.succession-table tbody tr:nth-child(even):not(.succession-row-parent):not(.succession-row-child):not(.succession-row-addchild):not(.succession-row-dev),
.succession-bench-table tbody tr:nth-child(even),
.pm-table tbody tr:nth-child(even),
.admin-grid-filters-table tbody tr:nth-child(even) {
  background: var(--app-table-stripe);
}

.home-cycles-table tbody tr:last-child td,
.inbox-table tbody tr:last-child td,
.spotlight-dashboard-table tbody tr:last-child td,
.da-summary-table tbody tr:last-child td,
.succession-table tbody tr:last-child td,
.succession-bench-table tbody tr:last-child td,
.pm-table tbody tr:last-child td,
.admin-grid-filters-table tbody tr:last-child td {
  border-bottom: 0;
}

.pm-table-scroll .pm-table thead th,
.succession-table-scroll .succession-table thead th,
.succession-bench-table-scroll .succession-bench-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
}

.pm-pip-admin-page {
  box-sizing: border-box;
  display: grid;
  gap: 14px;
  margin: 14px 0 32px;
  max-width: none;
  padding: 0 clamp(16px, 2.25vw, 42px);
  width: 100%;
}

.pm-pip-workspace {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.pm-pip-toolbar {
  background: transparent;
  border: 0;
  box-shadow: none;
  display: grid;
  gap: 10px;
  padding: 0;
}

.pm-pip-toolbar__lede {
  color: var(--app-muted, #667085);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  margin: 0;
}

.pm-pip-toolbar__link {
  color: var(--app-link, #175cd3);
  font-weight: 750;
  margin-left: 8px;
  text-decoration: none;
}

.pm-pip-toolbar__link:hover,
.pm-pip-toolbar__link:focus-visible {
  text-decoration: underline;
}

.pm-pip-admin-hero__header {
  align-items: flex-start;
}

.pm-form.pm-pip-admin-filters {
  align-items: end;
  background: var(--app-surface, #ffffff);
  border: 1px solid color-mix(in srgb, var(--app-border, #d0d5dd) 88%, transparent);
  border-radius: 12px;
  display: flex;
  flex-wrap: nowrap;
  gap: 12px;
  margin-top: 0;
  max-width: none;
  overflow: visible;
  padding: 12px 14px;
  position: relative;
  width: 100%;
}

.pm-form.pm-pip-admin-filters > .ks-field,
.pm-form.pm-pip-admin-filters > .pm-pip-admin-filter-status {
  flex: 1 1 0;
  margin: 0;
  max-width: none;
  min-width: 0;
}

.pm-form.pm-pip-admin-filters > .pm-pip-admin-filter-actions {
  flex: 0 0 auto;
  margin-left: auto;
}

.pm-pip-admin-hero {
  overflow: visible;
}

.pm-pip-admin-filter-status {
  display: grid;
  gap: 6px;
  margin: 0;
  min-width: 0;
  position: relative;
}

.pm-pip-admin-filter-status__label {
  color: var(--app-table-header-text, #344054);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  line-height: 1.2;
  margin: 0;
  padding: 0;
}

.pm-pip-admin-filter-status .keshboard-drawer__multiselect {
  display: block;
  position: relative;
  width: 100%;
}

.pm-pip-admin-filter-status .pm-pip-filter-dropdown__toggle {
  align-items: center;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  box-sizing: border-box;
  color: #101828;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  justify-content: flex-start;
  min-height: 40px;
  padding: 9px 12px;
  text-align: left;
  width: 100%;
}

.pm-pip-admin-filter-status .pm-pip-filter-dropdown__toggle:hover,
.pm-pip-admin-filter-status .pm-pip-filter-dropdown.is-open .pm-pip-filter-dropdown__toggle {
  border-color: var(--keshero-blue, #2ec5ff);
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.14);
}

.pm-pip-admin-filter-status .keshboard-drawer__multiselect-summary {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
  width: 100%;
}

.pm-pip-admin-filter-status .keshboard-drawer__multiselect-summary__text {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-pip-admin-filter-status .keshboard-drawer__multiselect-summary__chev {
  border-color: #667085 transparent transparent transparent;
  border-style: solid;
  border-width: 5px 4px 0 4px;
  flex: 0 0 auto;
  height: 0;
  width: 0;
}

.pm-pip-admin-filter-status .keshboard-drawer__multiselect-summary__chev::before {
  content: none !important;
  display: none !important;
}

.pm-pip-admin-filter-status .pm-pip-filter-dropdown.is-open .keshboard-drawer__multiselect-summary__chev {
  transform: rotate(180deg);
}

.pm-pip-admin-filter-status .keshboard-drawer__multiselect-list {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  box-shadow: 0 18px 38px rgba(16, 24, 40, 0.16);
  box-sizing: border-box;
  display: grid;
  gap: 2px;
  left: 0;
  margin-top: 6px;
  max-height: 260px;
  min-width: min(260px, 84vw);
  overflow: auto;
  padding: 6px;
  position: absolute;
  top: 100%;
  width: 100%;
  z-index: 1000;
}

.pm-pip-admin-filter-status .keshboard-drawer__multiselect-list[hidden] {
  display: none;
}

.pm-pip-admin-filter-status:has(.pm-pip-filter-dropdown.is-open) {
  z-index: 30;
}

.pm-pip-admin-filters .pm-manage-filter-option {
  align-items: center;
  border-radius: 7px;
  color: #101828;
  cursor: pointer;
  display: grid;
  font-size: 13px;
  font-weight: 700;
  gap: 9px;
  grid-template-columns: 16px minmax(0, 1fr);
  line-height: 1.25;
  margin: 0;
  min-height: 34px;
  padding: 7px 8px;
}

.pm-pip-admin-filters .pm-manage-filter-option:hover {
  background: #f2f4f7;
}

.pm-pip-admin-filters .pm-manage-filter-option[data-filter-all] {
  border-bottom: 1px solid #eaecf0;
  border-radius: 7px 7px 0 0;
  color: #1d4ed8;
  font-weight: 900;
  margin-bottom: 3px;
  padding-bottom: 9px;
}

.pm-pip-admin-filters .pm-manage-filter-option input[type="checkbox"] {
  accent-color: var(--app-checkbox-checked-bg, #12b76a);
  box-sizing: border-box;
  height: 16px;
  margin: 0;
  min-height: 0;
  width: 16px;
}

.pm-pip-admin-filters .pm-manage-filter-option span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.pm-pip-filters-updating .pm-pip-browser {
  opacity: 0.62;
  pointer-events: none;
  transition: opacity 120ms ease;
}

.pm-pip-admin-filter-status .grid-filter-dropdown {
  max-width: none;
  min-width: 0;
  width: 100%;
}

.pm-pip-admin-filter-status .grid-filter-dropdown-toggle {
  min-height: 38px;
  width: 100%;
}

.pm-pip-admin-filter-status:has(.grid-filter-dropdown.is-open) {
  z-index: 20;
}

.pm-pip-admin-filter-status .grid-filter-dropdown-panel {
  max-height: 240px;
  min-width: min(240px, 84vw);
  z-index: 1000;
}

.pm-pip-admin-filters .grid-filter-check-label {
  align-items: center;
  color: #222;
  display: flex;
  font-size: 13px;
  font-weight: 400;
  gap: 8px;
  line-height: 1.35;
  margin: 0;
  min-height: 0;
  padding: 0;
}

.pm-pip-admin-filters .grid-filter-check-label--select-all {
  border-bottom: 1px solid #e4e7ec;
  font-weight: 600;
  margin-bottom: 2px;
  padding-bottom: 4px;
}

.pm-pip-admin-filters .grid-filter-check-label input[type="checkbox"] {
  accent-color: var(--app-checkbox-checked-bg, #12b76a);
  border: 0;
  border-radius: var(--app-checkbox-radius, 50%);
  box-sizing: border-box;
  flex-shrink: 0;
  height: 14px;
  margin: 0;
  min-height: 0;
  padding: 0;
  width: 14px;
}

.pm-pip-status-filter-apply {
  border-top: 1px solid #e4e7ec;
  display: flex;
  justify-content: flex-end;
  margin-top: 2px;
  padding-top: 8px;
}

.pm-pip-status-filter-apply .button-small {
  min-height: 30px;
  padding: 5px 12px;
}

.pm-pip-admin-filter-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
  justify-content: flex-start;
  margin-left: auto;
  padding-bottom: 2px;
}

.pm-pip-admin-list .pm-section-header {
  margin-bottom: 8px;
}

.pm-pip-admin-footer-count {
  color: #475467;
  font-size: 12px;
  font-weight: 800;
  margin-top: 10px;
  text-align: right;
}

.pm-pip-admin-table th,
.pm-pip-admin-table td {
  vertical-align: middle;
}

.pm-pip-admin-table th:last-child,
.pm-pip-admin-table td:last-child,
.pm-pip-admin-table th:nth-last-child(2),
.pm-pip-admin-table td:nth-last-child(2) {
  text-align: center;
}

.pm-pip-admin-employee {
  color: inherit;
  display: grid;
  gap: 2px;
  min-width: 150px;
  text-decoration: none;
}

.pm-pip-admin-employee:hover strong {
  color: var(--keshero-teal);
  text-decoration: underline;
}

.pm-pip-admin-employee span {
  color: #667085;
  font-size: 12px;
}

.pm-pip-admin-chip {
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  padding: 5px 9px;
  white-space: nowrap;
}

.pm-pip-admin-chip--active {
  background: #ecfdf3;
  border-color: #abefc6;
  color: #067647;
}

.pm-pip-admin-chip--extended {
  background: #fffaeb;
  border-color: #fedf89;
  color: #b54708;
}

.pm-pip-admin-chip--completed {
  background: #eef4ff;
  border-color: #c7d7fe;
  color: #3538cd;
}

.pm-pip-admin-progress {
  align-items: center;
  background: #eef2f6;
  border-radius: 999px;
  container-type: inline-size;
  display: grid;
  height: 20px;
  min-width: 92px;
  overflow: hidden;
  position: relative;
}

.pm-pip-admin-progress span {
  background-color: transparent;
  background-image: var(--app-progress-gradient);
  background-position: left center;
  background-repeat: no-repeat;
  background-size: 100cqw;
  border-radius: inherit;
  height: 100%;
  min-width: 0;
}

.pm-pip-admin-progress strong {
  color: var(--app-progress-label-on-fill);
  font-size: 11px;
  font-weight: 800;
  left: 50%;
  position: absolute;
  text-shadow: var(--app-progress-label-shadow);
  transform: translateX(-50%);
}

.pm-pip-browser {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
}

.pm-pip-browser.is-list-collapsed {
  grid-template-columns: auto minmax(0, 1fr);
}

.pm-pip-scope-tabs {
  margin: 0 0 12px;
  width: 100%;
}

.pm-pip-scope-tabs .pm-manage-scope-switch__link {
  flex: 1 1 0;
}

.pm-pip-browser-list,
.pm-pip-browser-detail {
  min-width: 0;
}
.pm-pip-detail-navigation {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0;
}
.pm-pip-detail-expand-actions { justify-content: flex-end; }
.pm-pip-section-count,
[data-pip-position] { color: #667085; font-size: 12px; font-weight: 500; }
.pm-pip-detail-section__heading { flex-wrap: wrap; }
.pm-pip-detail-checkin.is-overdue { border-color: #f59e0b; }
.pm-pip-detail-checkin.is-overdue > summary { background: #fffbeb; }

.pm-pip-browser-detail {
  min-width: 0;
}

.pm-pip-list-items {
  display: grid;
  gap: 8px;
  max-height: min(720px, calc(100vh - 260px));
  overflow: auto;
  padding-right: 2px;
}

.pm-pip-list-item {
  align-items: stretch;
  background: var(--app-surface, #ffffff);
  border: 1px solid var(--app-border-soft, #eaecf0);
  border-radius: 10px;
  color: inherit;
  display: grid;
  gap: 8px;
  padding: 10px 12px;
  text-decoration: none;
  transition: background-color 120ms ease, border-color 120ms ease;
}

.pm-pip-list-item:hover {
  background: #f8fafc;
  border-color: #d0d5dd;
}

.pm-pip-list-item.is-selected {
  background: #eff8ff;
  border-color: #84caff;
}

.pm-pip-list-item__top {
  align-items: start;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.pm-pip-list-item__main,
.pm-pip-list-item strong,
.pm-pip-list-item small {
  display: block;
  min-width: 0;
}

.pm-pip-list-item__main {
  display: grid;
  gap: 4px;
}

.pm-pip-list-item strong {
  color: #101828;
  font-size: 13px;
}

.pm-pip-list-item small,
.pm-pip-list-item__meta small {
  color: #667085;
  font-size: 12px;
}

.pm-pip-list-item__meta {
  text-align: right;
  white-space: nowrap;
}

.pm-pip-list-item__progress {
  margin: 0;
  min-width: 0;
}

.pm-pip-empty {
  align-items: flex-start;
  background: color-mix(in srgb, var(--app-surface, #ffffff) 88%, #f2f4f7 12%);
  border: 1px dashed var(--app-border-soft, #eaecf0);
  border-radius: 12px;
  color: #667085;
  display: grid;
  gap: 4px;
  justify-items: start;
  padding: 18px 16px;
}

.pm-pip-empty strong {
  color: #344054;
  font-size: 13px;
}

.pm-pip-empty span {
  font-size: 12px;
  line-height: 1.45;
}

.pm-pip-empty--detail {
  min-height: 220px;
  place-content: center;
  place-items: center;
  text-align: center;
}

.pm-pip-empty--inline {
  background: transparent;
  border-style: solid;
  padding: 14px;
}

.pm-pip-detail-summary {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  margin-bottom: 14px;
}

.pm-pip-detail-summary div,
.pm-pip-detail-grid > div,
.pm-pip-detail-checkin {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 10px;
}

.pm-pip-detail-summary span {
  color: #667085;
  display: block;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.pm-pip-detail-summary strong {
  color: #101828;
  display: block;
  font-size: 13px;
  margin-top: 3px;
}

.pm-pip-area-progress-card {
  background: var(--app-container-surface-custom, #fff);
  border: 1px solid var(--app-container-border-custom, #dbe5ef);
  border-radius: 10px;
  display: grid;
  gap: 10px;
  min-width: 0;
  overflow: hidden;
  padding: 12px;
}

.pm-pip-flow-section.pm-pip-area-progress-card {
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.04);
  position: relative;
}

.pm-pip-area-progress-card h5 {
  color: #101828;
  font-size: 13px;
  margin: 0;
}

.pm-pip-area-progress-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
}

.pm-pip-area-progress-table {
  margin: 0;
  min-width: 820px;
  table-layout: fixed;
  width: 100%;
}

.pm-pip-area-progress-card .pm-table-scroll,
.pm-pip-detail-section__body > .pm-table-scroll {
  max-width: 100%;
  overflow-x: auto;
}

.pm-pip-area-progress-hint {
  margin: 0 0 10px;
}

.pm-pip-area-progress-hint a {
  color: #175cd3;
  font-weight: 700;
  text-decoration: none;
}

.pm-pip-area-progress-hint a:hover {
  text-decoration: underline;
}

.pm-pip-area-progress-table th,
.pm-pip-area-progress-table td {
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
  text-align: left !important;
  vertical-align: top;
  white-space: normal;
}

.pm-pip-area-progress-table th:nth-child(1) {
  width: 27%;
}

.pm-pip-area-progress-table th:nth-child(2),
.pm-pip-area-progress-table th:nth-child(3) {
  width: 24%;
}

.pm-pip-area-progress-table th:nth-child(4) {
  width: 12%;
}

.pm-pip-area-progress-table th:nth-child(5) {
  width: 13%;
}

.pm-pip-area-progress-name {
  align-items: flex-start;
  display: flex;
  gap: 8px;
  min-width: 0;
}

.pm-pip-area-progress-item {
  color: #344054;
  display: table-row;
  font-size: 13px;
}

.pm-pip-area-progress-bullet {
  align-items: center;
  border: 2px solid #98a2b3;
  border-radius: 999px;
  color: transparent;
  display: inline-flex;
  flex: 0 0 18px;
  font-size: 12px;
  font-weight: 900;
  height: 18px;
  justify-content: center;
  line-height: 1;
  margin-top: 1px;
  width: 18px;
}

.pm-pip-area-progress-item.is-achieved .pm-pip-area-progress-bullet {
  background: #12b76a;
  border-color: #12b76a;
  color: #fff;
}

.pm-pip-area-progress-title {
  color: #101828;
  font-weight: 800;
  min-width: 0;
  overflow-wrap: anywhere;
}

.pm-pip-area-progress-number {
  color: #475467;
  font-variant-numeric: tabular-nums;
  margin-right: 2px;
}

.pm-pip-area-progress-status {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #667085;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  padding: 4px 8px;
  white-space: nowrap;
}

.pm-pip-area-progress-status--achieved {
  background: #f4f3ff;
  border-color: #d9d6fe;
  color: #5925dc;
}

.pm-pip-area-progress-status--needs-attention {
  background: #fef7c3;
  border-color: #fde68a;
  color: #93370d;
}

.pm-pip-area-progress-status--on-track {
  background: #dcfae6;
  border-color: #abefc6;
  color: #067647;
}

.pm-pip-area-progress-status--not-started {
  background: #fee4e2;
  border-color: #fecdca;
  color: #b42318;
}

.pm-pip-detail-section {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.pm-pip-detail-section h4 {
  color: #101828;
  font-size: 14px;
  margin: 0;
}

.pm-pip-detail-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pm-pip-detail-grid strong {
  color: #344054;
  display: block;
  font-size: 12px;
  margin-bottom: 4px;
}

.pm-pip-detail-grid p {
  color: #475467;
  font-size: 13px;
  line-height: 1.45;
  margin: 0 0 6px;
  text-align: left;
}

.pm-pip-detail-checkins {
  display: grid;
  gap: 8px;
}

.pm-pip-detail-checkin summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.pm-pip-detail-checkin .pm-pip-detail-grid {
  margin-top: 10px;
}

/* Full-width PIP manager workspace and refined visual hierarchy. */
.pm-pip-browser-list,
.pm-pip-browser-detail {
  border: 1px solid color-mix(in srgb, var(--app-border, #d0d5dd) 82%, transparent);
  border-radius: 14px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05);
}

.pm-pip-admin-hero {
  background: var(--app-surface, #ffffff);
  padding: 18px 20px;
}

.pm-pip-admin-hero__header h3 {
  font-size: 18px;
  letter-spacing: -0.01em;
}

.pm-pip-browser-list {
  background: var(--app-surface, #ffffff);
  padding: 14px;
  position: sticky;
  top: 16px;
}

.pm-pip-browser-list__header {
  align-items: flex-start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.pm-pip-browser-list__header + [data-pip-browser-list-body] {
  margin-top: 12px;
}

.pm-pip-browser-list__title {
  min-width: 0;
}

.pm-pip-browser-list__header h3 {
  color: #101828;
  font-size: 15px;
  letter-spacing: -0.01em;
  margin: 0 0 2px;
}

.pm-pip-browser-list__header .pm-count-line {
  margin: 0;
}

.pm-pip-browser-list__toggle {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-right: 0;
  border-radius: 10px 0 0 10px;
  color: #475467;
  cursor: pointer;
  display: inline-flex;
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  line-height: 1;
  margin: 0;
  min-height: 52px;
  width: 22px;
  padding: 10px 5px;
  position: absolute;
  left: -22px;
  top: 12px;
  justify-content: center;
  z-index: 2;
}

.pm-pip-browser-list__toggle-glyph {
  border-bottom: 1.5px solid currentColor;
  border-left: 1.5px solid currentColor;
  width: 7px;
  height: 7px;
  transform: rotate(45deg);
}

.pm-pip-browser-list__toggle[aria-expanded="false"] .pm-pip-browser-list__toggle-glyph {
  transform: rotate(-135deg);
}

.pm-pip-browser-list__toggle:hover {
  background: #f2f4f7;
  border-color: #e4e7ec;
  color: #101828;
}

.pm-pip-browser-list__toggle:focus-visible {
  outline: 2px solid var(--keshero-blue, #2ec5ff);
  outline-offset: 2px;
}

.pm-pip-browser.is-list-collapsed .pm-pip-browser-list {
  align-items: stretch;
  background: transparent;
  border: 0;
  box-shadow: none;
  display: flex;
  justify-content: center;
  min-height: 0;
  padding: 0;
  width: auto;
}

.pm-pip-browser.is-list-collapsed .pm-pip-browser-list__header {
  align-items: stretch;
  flex: 0 0 auto;
  justify-content: center;
  margin: 0;
}

.pm-pip-browser.is-list-collapsed .pm-pip-browser-list__title {
  display: none;
}

.pm-pip-browser.is-list-collapsed .pm-pip-browser-list__toggle {
  left: -4px;
}

.pm-pip-browser-detail {
  background: var(--app-surface, #ffffff);
  display: grid;
  gap: 14px;
  padding: 18px;
}

.pm-pip-browser-detail > .pm-section-header {
  margin-bottom: 0;
}

.pm-pip-detail-header {
  align-items: center;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--app-border-soft, #eaecf0);
  border-radius: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  justify-content: space-between;
  padding: 0 0 14px;
}

.pm-pip-detail-header__identity {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  min-width: 0;
}

.pm-pip-detail-avatar {
  flex: 0 0 auto;
}

.pm-pip-detail-header__copy {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.pm-pip-detail-kicker {
  color: #667085;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}

.pm-pip-detail-header h3 {
  color: #101828;
  font-size: 22px;
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin: 0;
}

.pm-pip-detail-header__action {
  flex: 0 0 auto;
  gap: 7px;
  min-height: 36px;
  padding-inline: 13px;
}

.pm-pip-list-item {
  border-radius: 10px;
  padding: 10px 12px 10px 14px;
  transition: background-color 140ms ease, border-color 140ms ease;
}

.pm-pip-list-item:hover,
.pm-pip-list-item:focus-visible {
  box-shadow: none;
  transform: none;
}

.pm-pip-list-item.is-selected {
  background: #eff8ff;
  border-color: #b2ddff;
  box-shadow: none;
}

.pm-pip-detail-meta {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}

.pm-pip-detail-meta > div {
  background: #f8fafc;
  border: 1px solid var(--app-border-soft, #eaecf0);
  border-radius: 12px;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px 12px;
}

.pm-pip-detail-meta dt {
  color: #667085;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.02em;
  margin: 0;
  text-transform: uppercase;
}

.pm-pip-detail-meta dd {
  color: #101828;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.35;
  margin: 0;
}

.pm-pip-detail-summary {
  grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
}

.pm-pip-detail-summary > div {
  background: color-mix(in srgb, var(--app-surface, #ffffff) 92%, #f2f4f7 8%);
  border-color: var(--app-border-soft, #eaecf0);
  border-radius: 10px;
  min-height: 66px;
  padding: 12px;
}

.pm-pip-detail-section {
  background: transparent;
  border: 1px solid var(--app-border-soft, #eaecf0);
  border-radius: 12px;
  padding: 0;
}

.pm-pip-detail-section h4 {
  font-size: 15px;
  margin: 0;
}

.pm-pip-detail-badges {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
}

#pip-write-up,
#pip-development-plans,
#pip-check-ins {
  scroll-margin-top: 16px;
}

.pm-pip-detail-section--collapsible {
  display: block;
  overflow: hidden;
  padding: 0;
}

.pm-pip-detail-section__summary {
  align-items: center;
  background: #f8fafc;
  box-sizing: border-box;
  cursor: pointer;
  display: flex !important;
  flex-wrap: nowrap;
  justify-content: flex-start;
  list-style: none !important;
  list-style-type: none !important;
  min-height: var(--app-control-height, 38px);
  padding: 6px 12px;
}

.pm-pip-detail-section__summary::-webkit-details-marker {
  display: none !important;
}

.pm-pip-detail-section__summary::marker {
  content: "" !important;
  display: none;
}

.pm-pip-detail-section__summary:hover {
  background: #f2f4f7;
}

.pm-pip-detail-section__body {
  border-top: 1px solid var(--app-border-soft, #eaecf0);
  padding: 14px;
}

.pm-pip-detail-section__heading {
  align-items: center;
  display: inline-flex;
  gap: 10px;
  min-width: 0;
}

.pm-pip-detail-section__heading h4 {
  font-size: 14px;
  font-weight: 800;
  line-height: 1.25;
  margin: 0;
}
.pm-pip-detail-section__toggle {
  align-items: center;
  color: var(--app-disclosure-chevron-color, #475467);
  display: inline-flex;
  height: 18px;
  justify-content: center;
  width: 18px;
}

.pm-pip-detail-section--collapsible[open] .pm-pip-detail-section__toggle::before {
  transform: rotate(45deg);
}

.pm-pip-detail-grid > div,
.pm-pip-detail-checkin {
  background: var(--app-surface, #ffffff);
  border-color: var(--app-border-soft, #eaecf0);
  border-radius: 10px;
  padding: 12px;
}

.pm-pip-detail-checkin {
  border: 1px solid #98a2b3;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  overflow: hidden;
  padding: 0;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.pm-pip-detail-checkin[open] {
  border-color: #667085;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.09);
}

.pm-pip-detail-checkin summary {
  background: #f2f4f7;
  border-radius: 8px;
  box-sizing: border-box;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
  justify-content: stretch;
  list-style: none;
  min-height: var(--app-control-height, 38px);
  padding: 6px 12px;
  text-align: left;
  transition: background-color 150ms ease;
}

.pm-pip-detail-checkin summary::-webkit-details-marker {
  display: none;
}

.pm-pip-detail-checkin summary::marker {
  content: "";
}

.pm-pip-detail-checkin summary:hover {
  background: #eaecf0;
}

.pm-pip-detail-checkin[open] > summary {
  border-bottom: 1px solid #98a2b3;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.pm-pip-detail-checkin[open] > .pm-pip-detail-grid,
.pm-pip-detail-checkin[open] > .pm-pip-checkin-form {
  margin-top: 0;
  padding: 12px;
}

.pm-pip-admin-page .pm-pip-checkin-hidden-by-status {
  display: none !important;
}

.pm-pip-admin-page .pm-pip-checkin-form {
  background: var(--app-surface, #ffffff);
  border: 0;
  border-radius: 0;
  display: grid;
  gap: 0;
  margin: 0;
}

.pm-pip-admin-page .pm-pip-checkin-quick-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pm-pip-admin-page .pm-pip-checkin-quick-grid label {
  align-content: start;
  display: grid;
  gap: 6px;
}

.pm-pip-admin-page .pm-pip-checkin-quick-grid select,
.pm-pip-admin-page .pm-pip-checkin-quick-grid input,
.pm-pip-admin-page .pm-pip-checkin-quick-grid .keshero-date-format-field,
.pm-pip-admin-page .pm-pip-checkin-quick-grid .keshero-date-format-input,
.pm-pip-admin-page .pm-pip-checkin-quick-grid .keshero-date-format-calendar {
  min-height: var(--app-control-height, 38px);
}

.pm-pip-admin-page .pm-pip-checkin-notes {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  margin-top: 12px;
  overflow: hidden;
}

.pm-pip-admin-page .pm-pip-checkin-notes__title {
  background: #f2f4f7;
  border-bottom: 1px solid #e4e7ec;
  color: #101828;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
  margin: 0;
  padding: 10px 12px;
}

.pm-pip-admin-page .pm-pip-checkin-notes-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  padding: 12px;
}

.pm-pip-admin-page .pm-pip-checkin-notes-grid > label {
  align-content: start;
  display: grid;
  gap: 6px;
}

.pm-pip-admin-page .pm-pip-checkin-notes-grid textarea {
  min-height: 72px;
  resize: vertical;
}

.pm-pip-admin-page .pm-pip-checkin-notes-areas-heading {
  border-top: 1px solid #e4e7ec;
  color: #344054;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.01em;
  margin: 0;
  padding: 12px 12px 0;
}

.pm-pip-admin-page .pm-pip-checkin-notes > .pm-pip-checkin-area-grid {
  padding: 12px;
}

.pm-pip-admin-page .pm-pip-checkin-area-grid {
  display: grid;
  gap: 10px;
}

.pm-pip-admin-page .pm-pip-checkin-area-row {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 10px 12px;
}

.pm-pip-admin-page .pm-pip-checkin-area-row.is-achieved {
  background: #f9fafb;
  opacity: 0.92;
}

.pm-pip-admin-page .pm-pip-checkin-area-title {
  color: #101828;
  font-size: 13px;
  font-weight: 800;
}

.pm-pip-checkin-area-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pm-pip-checkin-area-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #e2e8f0;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.pm-pip-admin-page .pm-pip-checkin-area-fields {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(140px, 0.4fr) minmax(0, 1fr);
}

.pm-pip-admin-page .pm-pip-checkin-area-fields > label {
  align-content: start;
  display: grid;
  gap: 6px;
}

.pm-pip-admin-page .pm-pip-checkin-area-fields > label textarea[name="goal_update_notes"] {
  min-height: 56px;
  resize: vertical;
}

.pm-pip-admin-page .pm-pip-checkin-area-locked-note {
  color: #667085;
  font-size: 12px;
  margin: 0;
}

.pm-pip-admin-page .pm-pip-checkin-form > .button-save-small,
.pm-pip-admin-page .pm-pip-checkin-form > button[type="submit"],
.pm-pip-admin-page .pm-pip-checkin-form > .app-save-action-stack {
  justify-self: end;
  margin-top: 12px;
}

.pm-pip-admin-page .pm-pip-checkin-form > .app-save-action-stack {
  display: grid;
  justify-items: end;
}

.pm-pip-admin-page .pm-pip-checkin-form > .app-save-action-stack > .app-unsaved-indicator {
  left: auto;
  right: 0;
  transform: none;
}

.pm-pip-detail-checkin__heading {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  justify-self: start;
  min-width: 0;
  text-align: left;
}

.pm-pip-detail-checkin__sep {
  display: inline-block;
  margin: 0 0.35em;
  transform: translateY(-1px);
}

.pm-pip-detail-checkin__current-badge {
  flex: 0 0 auto;
}

.pm-pip-detail-checkin.is-current {
  border-color: #fdb022;
  box-shadow: 0 1px 2px rgba(181, 71, 8, 0.08);
}

.pm-pip-detail-checkin.is-current[open] {
  border-color: #f79009;
}

.pm-pip-detail-checkin.is-current > summary {
  background: #fffaeb;
}

.pm-pip-detail-checkin.is-current > summary:hover {
  background: #fef0c7;
}

.pm-pip-detail-checkin__toggle {
  align-items: center;
  color: #475467;
  display: inline-flex;
  justify-content: center;
  min-width: 18px;
}

.pm-pip-detail-checkin[open] .pm-pip-detail-checkin__toggle::before {
  transform: rotate(45deg);
}

@media (max-width: 1100px) {
  .pm-pip-detail-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 860px) {
  .pm-pip-browser,
  .pm-pip-browser.is-list-collapsed,
  .pm-pip-detail-summary,
  .pm-pip-detail-grid,
  .pm-pip-detail-meta,
  .pm-pip-admin-page .pm-pip-checkin-quick-grid,
  .pm-pip-admin-page .pm-pip-checkin-notes-grid,
  .pm-pip-admin-page .pm-pip-checkin-area-fields {
    grid-template-columns: 1fr;
  }

  .pm-pip-browser-list {
    position: relative;
    top: auto;
  }

  .pm-pip-browser.is-list-collapsed .pm-pip-browser-list {
    min-height: 64px;
    padding: 0;
    width: auto;
  }

  .pm-pip-browser.is-list-collapsed .pm-pip-browser-list__toggle {
    left: -22px;
  }
}

@media (max-width: 620px) {
  .pm-pip-admin-page {
    padding: 0 14px;
  }

  .pm-form.pm-pip-admin-filters {
    flex-wrap: wrap;
  }

  .pm-form.pm-pip-admin-filters > .ks-field,
  .pm-form.pm-pip-admin-filters > .pm-pip-admin-filter-status {
    flex: 1 1 180px;
    min-width: 160px;
  }

  .pm-pip-detail-header {
    align-items: stretch;
    flex-direction: column;
  }

  .pm-pip-detail-header__action {
    align-self: flex-start;
  }

}

.app-status-badge {
  align-items: center;
  border: 1px solid var(--app-border-soft);
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  min-height: 24px;
  padding: 4px 8px;
  white-space: nowrap;
}

.app-status-badge--success {
  background: var(--app-success-surface);
  border-color: var(--app-success-border);
  color: var(--app-success-fg);
}

.app-status-badge--warning {
  background: #fffaeb;
  border-color: #fedf89;
  color: #b54708;
}

.app-status-badge--danger {
  background: var(--app-danger-surface);
  border-color: #fecdca;
  color: var(--app-action-danger);
}

.app-status-badge--neutral {
  background: #f8fafc;
  color: #475467;
}

/* Unified button system. These selectors bring older one-off controls into the same visual family. */
.app-button,
.topbar button[type="submit"],
form button[type="submit"]:not([class]),
form button[type="button"]:not([class]),
.grid-col-toggle-btn,
.grid-filter-actions button,
.grid-filter-clear,
.grid-filter-dropdown-toggle,
.grid-promo-nom-filter-btn,
.comp-plan-tab,
.home-sv-toggle-btn,
.da-expand-btn,
.db-move-btn,
.heatmap-people-toggle,
.succession-org-size-toggle,
.succession-link-button,
.login-panel button[type="submit"] {
  align-items: center;
  border: 1px solid var(--app-border-soft);
  border-radius: var(--app-radius-control);
  display: inline-flex;
  font-family: inherit;
  font-weight: 800;
  justify-content: center;
  line-height: 1.1;
  text-decoration: none;
  transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, color 0.14s ease, transform 0.14s ease;
  user-select: none;
}

.app-button,
.topbar button[type="submit"],
form button[type="submit"]:not([class]),
form button[type="button"]:not([class]),
.grid-col-toggle-btn,
.grid-filter-actions button,
.grid-filter-clear,
.grid-promo-nom-filter-btn,
.comp-plan-tab,
.succession-link-button {
  background: var(--app-action-secondary);
  color: #344054;
  min-height: 34px;
  padding: 7px 12px;
}

.grid-filter-dropdown-toggle {
  background: var(--app-action-secondary);
  color: #344054;
  min-height: 34px;
}

.app-button:hover,
.topbar button[type="submit"]:hover,
form button[type="submit"]:not([class]):hover,
form button[type="button"]:not([class]):hover,
.grid-col-toggle-btn:hover,
.grid-filter-actions button:hover,
.grid-filter-clear:hover,
.grid-filter-dropdown-toggle:hover,
.grid-promo-nom-filter-btn:hover,
.comp-plan-tab:hover,
.succession-link-button:hover {
  background: var(--app-action-secondary-hover);
  border-color: #cbd5e1;
  box-shadow: 0 8px 16px rgba(15, 23, 42, 0.08);
  color: var(--keshero-teal);
  transform: translateY(-1px);
}

.app-button--primary {
  background: var(--app-action-primary);
  border-color: var(--app-action-primary-border);
  color: #fff;
  min-height: 38px;
  padding: 8px 14px;
}

.login-panel button[type="submit"],
.login-form__submit {
  background: linear-gradient(105deg, var(--keshero-teal, #2ec5ff) 0%, var(--keshero-blue, #3a7bff) 100%);
  border: 0;
  box-shadow: 0 10px 24px rgba(46, 197, 255, 0.28);
  color: #fff;
  min-height: 44px;
  padding: 8px 14px;
  width: 100%;
}

.app-button--primary:hover {
  background: var(--app-action-primary-hover);
  box-shadow: 0 10px 20px rgba(46, 197, 255, 0.18);
  color: #fff;
  transform: translateY(-1px);
}

.login-panel button[type="submit"]:hover,
.login-form__submit:hover {
  background: linear-gradient(105deg, var(--keshero-cyan-glow, #6fe3ff) 0%, var(--keshero-blue, #3a7bff) 55%, var(--keshero-purple, #8a2be2) 140%);
  box-shadow: 0 14px 28px rgba(58, 123, 255, 0.32);
  color: #fff;
  filter: brightness(1.02);
  transform: translateY(-1px);
}

.app-button--danger {
  background: var(--app-danger-surface);
  border-color: var(--app-danger-border);
  color: var(--app-action-danger);
}

.app-button--danger:hover {
  background: #ffe8ea;
  border-color: var(--app-danger-border-strong);
  color: var(--app-action-danger-hover);
}

.app-button--icon,
.home-sv-toggle-btn,
.da-expand-btn,
.db-move-btn {
  aspect-ratio: 1;
  min-height: 30px;
  padding: 0;
  width: 30px;
}

.app-button:focus-visible,
.topbar button[type="submit"]:focus-visible,
form button[type="submit"]:not([class]):focus-visible,
form button[type="button"]:not([class]):focus-visible,
.grid-col-toggle-btn:focus-visible,
.grid-filter-actions button:focus-visible,
.grid-filter-clear:focus-visible,
.grid-filter-dropdown-toggle:focus-visible,
.grid-promo-nom-filter-btn:focus-visible,
.comp-plan-tab:focus-visible,
.home-sv-toggle-btn:focus-visible,
.da-expand-btn:focus-visible,
.db-move-btn:focus-visible,
.heatmap-people-toggle:focus-visible,
.succession-org-size-toggle:focus-visible,
.succession-link-button:focus-visible,
.login-panel button[type="submit"]:focus-visible {
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  outline: none;
}

.app-button:disabled,
form button[type="submit"]:not([class]):disabled,
form button[type="button"]:not([class]):disabled,
.grid-col-toggle-btn:disabled,
.grid-filter-actions button:disabled,
.grid-promo-nom-filter-btn:disabled,
.comp-plan-tab:disabled,
.home-sv-toggle-btn:disabled,
.da-expand-btn:disabled,
.db-move-btn:disabled {
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.52;
  transform: none;
}

.topbar-profile-menu__panel button,
.topbar-profile-menu__panel form button[type="submit"]:not([class]) {
  background: transparent;
  border: 0;
  border-radius: 7px;
  box-shadow: none;
  color: #344054;
  display: block;
  font-size: 14px;
  justify-content: flex-start;
  min-height: 0;
  padding: 9px 10px;
  text-align: left;
  transform: none;
  width: 100%;
}

.topbar-profile-menu__panel button:hover,
.topbar-profile-menu__panel form button[type="submit"]:not([class]):hover {
  background: #f2f4f7;
  box-shadow: none;
  color: #344054;
  transform: none;
}

/* Unified filters, forms, dashboards, and responsive polish. */
.app-filter-bar,
.grid-filters-bar,
.pm-home-filters,
.surveys-filter-bar,
.spotlight-dashboard-filters,
.spotlight-search,
.pm-assignment-board-toolbar,
.comp-plan-table-filter-row {
  align-items: end;
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding: 12px;
}

.grid-filters-bar-title,
.grid-filter-label,
.pm-home-filters label,
.surveys-filter-bar label,
.spotlight-dashboard-filters label,
.pm-assignment-board-toolbar__label,
.spotlight-form label,
.spotlight-form .spotlight-field,
.spotlight-form .spotlight-field__label,
.spotlight-form__field,
.spotlight-search label,
.pm-form label,
.comp-config-section label,
.succession-edit-form label {
  color: var(--app-table-header-text);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.app-form,
.pm-form,
.spotlight-form,
.succession-edit-form,
.comp-config-form,
form[id$="Form"] {
  display: grid;
  gap: 14px;
}

/* Exclude checkbox/radio so shared checked styles in design_system.css are not wiped
   by the `background` shorthand (which clears background-image checkmarks). */
.app-form input:not([type="checkbox"]):not([type="radio"]),
.app-form select,
.app-form textarea,
.pm-form input:not([type="checkbox"]):not([type="radio"]),
.pm-form select,
.pm-form textarea,
.pm-inline-form input:not([type="checkbox"]):not([type="radio"]),
.pm-inline-form select,
.spotlight-form input:not([type="checkbox"]):not([type="radio"]),
.spotlight-form select,
.spotlight-form textarea,
.spotlight-search input:not([type="checkbox"]):not([type="radio"]),
.spotlight-search select,
.surveys-filter-bar input:not([type="checkbox"]):not([type="radio"]),
.surveys-filter-bar select,
.spotlight-dashboard-filters input:not([type="checkbox"]):not([type="radio"]),
.spotlight-dashboard-filters select,
.pm-assignment-board-toolbar__select,
.spotlight-comment-form input:not([type="checkbox"]):not([type="radio"]),
.spotlight-comment-edit-form textarea,
.comp-config-table input:not([type="checkbox"]):not([type="radio"]),
.comp-config-table select,
.succession-edit-textarea,
.grid-filter-select,
.grid-filter-dropdown-toggle,
.login-panel input:not([type="checkbox"]):not([type="radio"]) {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: var(--app-radius-control);
  box-shadow: inset 0 1px 1px rgba(15, 23, 42, 0.025);
  box-sizing: border-box;
  color: var(--app-text);
  min-height: var(--app-control-height);
}

.app-form textarea,
.pm-form textarea,
.spotlight-form textarea,
.spotlight-comment-edit-form textarea,
.succession-edit-textarea {
  height: auto;
  min-height: var(--app-textarea-min-height, calc(var(--app-control-height, 38px) * 2));
  padding: 10px 12px;
  resize: vertical;
}

.app-form input:focus,
.app-form select:focus,
.app-form textarea:focus,
.pm-form input:focus,
.pm-form select:focus,
.pm-form textarea:focus,
.pm-inline-form input:focus,
.pm-inline-form select:focus,
.spotlight-form input:focus,
.spotlight-form select:focus,
.spotlight-form textarea:focus,
.spotlight-search input:focus,
.spotlight-search select:focus,
.surveys-filter-bar input:focus,
.surveys-filter-bar select:focus,
.spotlight-dashboard-filters input:focus,
.spotlight-dashboard-filters select:focus,
.pm-assignment-board-toolbar__select:focus,
.spotlight-comment-form input:focus,
.spotlight-comment-edit-form textarea:focus,
.comp-config-table input:focus,
.comp-config-table select:focus,
.succession-edit-textarea:focus,
.grid-filter-select:focus,
.grid-filter-dropdown-toggle:focus,
.login-panel input:not([type="checkbox"]):not([type="radio"]):focus {
  border-color: var(--app-action-primary);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  outline: none;
}

.spotlight-form .spotlight-tag-picker__option {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
}

.spotlight-form .spotlight-tag-picker__option input {
  box-shadow: none;
}

.pm-home-filters,
.surveys-filter-bar,
.spotlight-dashboard-filters,
.spotlight-search {
  align-items: end;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.pm-home-filters > *,
.surveys-filter-bar > *,
.spotlight-dashboard-filters > *,
.spotlight-search > * {
  min-width: 0;
}

.pm-home-filters label:first-child,
.surveys-filter-bar label:first-child,
.spotlight-dashboard-filters label:first-child,
.spotlight-search > input[type="search"]:first-child {
  grid-column: span 2;
}

.surveys-filter-bar--managed {
  align-items: stretch;
  grid-template-columns: minmax(0, 1fr);
}

.surveys-filter-bar--managed > * {
  min-width: 0;
}

.surveys-filter-bar--managed label:first-child {
  grid-column: auto;
}

/* Surveys workspace: keep filters/panel inside one shell (overrides unified filter chrome). */
.surveys-workspace__body > .surveys-filter-bar {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--app-border-soft, #eef2f6);
  border-radius: 0;
  box-shadow: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  padding: 14px 16px 12px;
}

.surveys-workspace__body > .surveys-panel,
.surveys-workspace__body > .surveys-panel.surveys-dashboard {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 16px;
}

.surveys-workspace .surveys-empty-state {
  background: transparent;
  border: 0;
}

.surveys-workspace .surveys-filter-primary.app-filter-bar {
  align-items: stretch;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  box-shadow: none;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr);
  padding: 10px 12px;
}

.spotlight-dashboard-filters > .button-small {
  align-self: end;
  justify-self: start;
  min-height: var(--app-control-height) !important;
  min-width: 96px;
  padding: 0 16px !important;
  width: auto !important;
}

.spotlight-dashboard-filter-actions {
  align-self: end;
  display: inline-flex;
  gap: 8px;
  justify-self: start;
}

.spotlight-dashboard-filter-actions > .button-primary,
.spotlight-dashboard-filter-actions > .button-small {
  min-height: var(--app-control-height) !important;
  min-width: 96px;
  padding: 0 16px !important;
  width: auto !important;
}

.pm-assignment-board-toolbar {
  align-items: end;
}

/* Admin planning edit pages: keep section containers aligned and prevent wide controls from pushing the page. */
.pm-cycle-edit-form,
.comp-config-form,
.succession-config-form,
.pr-edit-form {
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  min-width: 0;
  width: 100%;
}

/* Comp stays on the narrower edit-shell; cycle edit / talent planning use full content width. */
.comp-config-form {
  max-width: min(1180px, 100%);
}

.succession-config-form {
  max-width: none;
}

.cycle-edit-card,
.comp-config-section,
.succession-edit-section {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.cycle-edit-card > *,
.comp-config-section > *,
.succession-edit-section > * {
  max-width: 100%;
}

.pm-cycle-edit-table-wrap,
.comp-config-table-wrap {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  width: 100%;
}

.cycle-edit-card table,
.comp-config-section table,
.succession-edit-section table {
  max-width: 100%;
}

.cycle-edit-actions {
  box-sizing: border-box;
  max-width: 100%;
}

@media (max-width: 760px) {
  .succession-pop-filter-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

.app-sticky-actions,
.comp-config-actions,
.succession-edit-form > .button-primary:last-child {
  align-items: center;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.09);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  margin: 0 0 14px;
  padding: 10px 12px;
  position: sticky;
  top: 108px;
  z-index: 45;
}

.app-placeholder,
.admin-placeholder,
.home-empty,
.perf-da-empty,
.da-empty {
  background:
    linear-gradient(135deg, rgba(248, 250, 252, 0.95), rgba(239, 246, 255, 0.72));
  border: 1px dashed #b9c7d6;
  border-radius: var(--app-radius-card);
  color: var(--app-muted);
  line-height: 1.5;
}

.app-dashboard-grid,
.pm-metric-row,
.spotlight-dashboard-kpis,
.comp-analysis-grid,
.comp-stat-grid,
.succession-bench-kpis {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.pm-metric-card,
.spotlight-dashboard-kpis > div,
.comp-analysis-card,
.comp-stat-card,
.succession-kpi {
  background:
    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  box-shadow: var(--app-shadow-card);
  min-width: 0;
}

.pm-metric-card span,
.spotlight-dashboard-kpis span,
.comp-analysis-card span,
.comp-stat-card span,
.succession-kpi-label {
  color: var(--app-muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.pm-metric-card b,
.spotlight-dashboard-kpis b,
.comp-analysis-card b,
.comp-stat-card b,
.succession-kpi-value {
  color: var(--app-heading);
  font-size: clamp(20px, 3vw, 28px);
  font-weight: 850;
  letter-spacing: 0;
}

.home-cycles-table td a {
  border-radius: 999px;
  color: var(--keshero-teal);
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  margin: 2px 3px 2px 0;
  text-decoration: none;
}

.home-cycles-table td a:hover {
  color: #0b4ab3;
  text-decoration: underline;
}

.home-cycles-table td a.home-row-action-link:hover {
  text-decoration: none;
}

.home-row-action-link,
.home-row-action-button,
.home-cycles-table td a.home-row-action-link,
.home-row-actions .home-row-action-button.button-delete-small,
.home-row-actions .home-row-action-button.button-danger-small {
  align-items: center;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 6px !important;
  box-shadow: none !important;
  box-sizing: border-box;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-family: inherit;
  font-size: 12px !important;
  font-weight: 800 !important;
  height: 32px;
  justify-content: center;
  letter-spacing: 0.01em;
  line-height: 1.1 !important;
  margin: 0;
  max-height: 32px;
  min-height: 32px !important;
  min-width: 4.75rem;
  padding: 0 12px !important;
  text-decoration: none;
  white-space: nowrap;
}

.home-row-actions {
  align-items: center;
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 6px;
  justify-content: center;
  max-width: 100%;
}

.home-row-actions__form {
  display: inline-flex;
  flex: 0 0 auto;
  margin: 0;
}

.home-row-actions > .home-row-action-link,
.home-row-actions > .home-row-action-button,
.home-row-actions > .home-row-actions__form {
  align-items: center;
  display: inline-flex;
  position: relative;
}

.home-row-action-link:hover,
.home-row-action-button:hover {
  background: #f8fafc;
  text-decoration: none;
}

.home-row-action-link:focus-visible,
.home-row-action-button:focus-visible {
  outline: 2px solid #1d9bf0;
  outline-offset: 1px;
}

.home-row-action-link--open,
.home-row-action-link--review {
  background: #f0f9ff;
  border-color: #b2ddff;
  color: inherit;
}

.home-row-action-link--open:hover,
.home-row-action-link--review:hover {
  background: #e0f2fe;
}

.home-row-action-link--edit,
.home-row-action-button--edit {
  background: #eef2f6;
  border-color: #d0d5dd;
  color: inherit;
}

.home-row-action-link--edit:hover,
.home-row-action-button--edit:hover {
  background: #e4e9ef;
}

.home-row-action-link--delete,
.home-row-action-button--delete {
  background: #fef3f2;
  border-color: #fecdca;
  color: inherit;
}

.home-row-action-link--delete:hover,
.home-row-action-button--delete:hover {
  background: #fee4e2;
}

.home-cycles-table th.home-col-action,
.home-cycles-table td.home-col-action {
  min-width: 260px;
  white-space: nowrap;
  width: 1%;
}

.spotlight-page {
  align-items: stretch;
}

.spotlight-compose {
  position: sticky;
  top: 108px;
}

.spotlight-stream {
  background: var(--app-surface);
  border: 1px solid var(--app-container-border);
  border-radius: var(--app-radius-card);
  box-shadow: var(--app-container-shadow);
  box-sizing: border-box;
  align-content: start;
  display: grid;
  gap: 20px;
  grid-auto-rows: max-content;
  grid-template-rows: none;
  align-self: start;
  min-height: auto;
  padding: var(--app-card-padding);
  position: relative;
}

.spotlight-stream::before {
  background: linear-gradient(90deg, rgba(46, 197, 255, 0.72), rgba(90, 75, 255, 0.62), rgba(138, 43, 226, 0));
  border-radius: inherit;
  content: "";
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
}

.spotlight-stream-header {
  margin-bottom: 0;
}

.spotlight-stream .spotlight-search,
.spotlight-stream-list {
  box-sizing: border-box;
  width: 100%;
}

.spotlight-stream-list {
  align-self: stretch;
  max-height: min(42rem, calc(100vh - 290px));
  min-height: 220px;
  overflow-y: auto;
  padding-right: 0;
}

.spotlight-card {
  border-left: 1px solid #dbe5ef;
}

.spotlight-stream .spotlight-card {
  display: grid;
  padding: 0;
}

.spotlight-stream-link {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.spotlight-stream .spotlight-body,
.spotlight-stream .spotlight-tags,
.spotlight-stream .spotlight-mentions,
.spotlight-stream .spotlight-reactions {
  margin-left: 22px;
  margin-right: 20px;
}

.spotlight-stream .spotlight-body {
  margin-bottom: 12px;
  margin-top: 0;
}

.spotlight-dashboard-panel--recognition-list .spotlight-body,
.recognition-card .recognition-body {
  box-sizing: border-box;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  text-indent: 0;
  width: 100%;
}

.spotlight-stream .spotlight-reactions {
  margin-bottom: 18px;
  margin-top: 12px;
}

.spotlight-subject {
  font-size: 16px;
  font-weight: 850;
}

/* Spotlight wall and scoped recognition list. */
.spotlight-stream-title-row,
.spotlight-recognition-header,
.spotlight-card-footer,
.spotlight-pagination {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.spotlight-stream-title-row h3,
.spotlight-recognition-header h3 {
  margin: 0;
}

.spotlight-compose {
  position: static;
}

.spotlight-compose[hidden] {
  display: none !important;
}

.spotlight-compose.is-open {
  align-content: start;
  background: linear-gradient(180deg, #f8fbff 0, #fff 160px);
  border: 1px solid #d7e5f3;
  border-radius: 20px 0 0 20px;
  box-shadow: -20px 0 56px rgba(15, 23, 42, 0.18);
  box-sizing: border-box;
  display: grid;
  gap: 22px;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: max-content max-content;
  height: 100dvh;
  margin: 0;
  max-height: 100dvh;
  max-width: min(600px, 100vw);
  overflow: auto;
  overscroll-behavior: contain;
  padding: max(28px, env(safe-area-inset-top)) 30px max(28px, env(safe-area-inset-bottom));
  position: fixed;
  right: 0;
  top: 0;
  width: min(600px, 100vw);
}

dialog.spotlight-compose::backdrop {
  background: rgba(16, 24, 40, 0.48);
  backdrop-filter: blur(3px);
}

.spotlight-compose.is-open::before {
  background: linear-gradient(90deg, rgba(46, 197, 255, 0.75), rgba(37, 99, 235, 0.55), rgba(138, 43, 226, 0));
  border-radius: inherit;
  content: "";
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
}

.spotlight-compose-heading {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.spotlight-compose-heading__copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.spotlight-compose-heading h3 {
  color: var(--app-container-title-color, #101828);
  font-size: var(--app-container-title-size, 17px);
  font-weight: var(--app-container-title-weight, 700);
  line-height: var(--app-container-title-line-height, 1.25);
  margin: 0;
}

.spotlight-compose-lede {
  color: var(--app-field-placeholder, #667085);
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
  max-width: 52rem;
}

.spotlight-compose .spotlight-form {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr);
  max-width: none;
}

.spotlight-compose .spotlight-form__row {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(160px, 200px) minmax(0, 1fr);
  min-width: 0;
}

.spotlight-compose .spotlight-form__field--full,
.spotlight-compose .spotlight-inline-fields,
.spotlight-compose .spotlight-form__actions {
  grid-column: 1 / -1;
}

.spotlight-compose .spotlight-inline-fields {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
}

.spotlight-compose .spotlight-tag-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.spotlight-compose .pm-recipient-chip {
  border-radius: 10px;
}

.spotlight-compose .spotlight-form .ks-field {
  min-width: 0;
  width: 100%;
}

.spotlight-compose .spotlight-form textarea.ks-field__control {
  min-height: 104px;
  resize: vertical;
}

.spotlight-compose .spotlight-form__actions {
  align-items: center;
  border-top: 1px solid var(--app-border, #e4e7ec);
  display: flex;
  gap: 10px;
  justify-content: flex-start;
  margin-top: 2px;
  padding-top: 14px;
}

.spotlight-stream > .spotlight-search {
  border-top: 1px solid var(--app-border, #e4e7ec);
  padding-top: 18px;
}

@media (max-width: 720px) {
  .spotlight-compose.is-open {
    border-radius: 18px 0 0 18px;
    padding: max(20px, env(safe-area-inset-top)) 20px max(20px, env(safe-area-inset-bottom));
  }

  .spotlight-compose .spotlight-inline-fields,
  .spotlight-compose .spotlight-form__row {
    grid-template-columns: minmax(0, 1fr);
  }
}

.spotlight-notice {
  background: var(--app-surface-muted);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  color: var(--app-heading);
  padding: 12px 14px;
}

.spotlight-notice--success {
  border-color: var(--app-success-border);
}

.spotlight-stream-list {
  max-height: none;
  overflow: visible;
}

.spotlight-stream .spotlight-card {
  margin-bottom: 10px;
}

.spotlight-stream .spotlight-stream-link {
  display: block;
  padding: 14px 18px 0;
}

.spotlight-stream .spotlight-meta {
  line-height: 1.35;
  margin-top: 2px;
}

.spotlight-stream .spotlight-body,
.spotlight-stream .spotlight-tags,
.spotlight-stream .spotlight-mentions {
  margin-left: 18px;
  margin-right: 18px;
}

.spotlight-stream .spotlight-body {
  display: -webkit-box;
  line-height: 1.4;
  margin-bottom: 8px;
  margin-top: 8px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.spotlight-stream .spotlight-tags,
.spotlight-stream .spotlight-mentions {
  gap: 6px;
}

.spotlight-stream .spotlight-tags span,
.spotlight-stream .spotlight-mentions span {
  padding: 3px 7px;
}

.spotlight-card-footer {
  align-items: flex-end;
  margin: 8px 18px 14px;
}

.spotlight-card-footer .spotlight-reactions {
  margin: 0;
}

.spotlight-comment-count {
  color: var(--app-muted);
  font-weight: 700;
  text-decoration: none;
}

.spotlight-comment-count:hover {
  text-decoration: underline;
}

.spotlight-recognition {
  background: var(--app-surface);
  border: 1px solid var(--app-container-border);
  border-radius: var(--app-radius-card);
  box-shadow: var(--app-container-shadow);
  box-sizing: border-box;
  display: grid;
  gap: 16px;
  grid-column: 1 / -1;
  min-width: 0;
  padding: var(--app-card-padding);
  width: 100%;
}

.spotlight-stream {
  grid-column: 1 / -1;
  width: 100%;
}

.spotlight-recognition-header p {
  color: var(--app-muted);
  margin: 4px 0 0;
}

.spotlight-recognition-top-tags {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.spotlight-recognition-top-tags span {
  background: var(--app-surface-muted);
  border: 1px solid var(--app-border);
  border-radius: 999px;
  padding: 5px 9px;
}

.spotlight-pagination {
  flex-wrap: wrap;
}

.spotlight-pagination__size {
  align-items: center;
  display: flex;
}

@media (max-width: 760px) {
  .spotlight-stream-title-row,
  .spotlight-recognition-header {
    align-items: stretch;
    flex-direction: column;
  }
}

.spotlight-open-indicator {
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  color: var(--keshero-teal);
  font-size: 12px;
  font-weight: 800;
  padding: 5px 9px;
}

/* People Directory ? sortable column headers */
.home-cycles-table .home-cycles-table__th--sortable {
  white-space: nowrap;
}

.home-cycles-table .people-directory-sort {
  color: inherit;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px dashed rgba(52, 64, 84, 0.35);
}

.home-cycles-table .people-directory-sort:hover {
  color: var(--app-action-primary);
  border-bottom-color: rgba(46, 197, 255, 0.45);
}

.home-cycles-table .people-directory-sort--active {
  color: var(--app-action-primary);
  border-bottom-style: solid;
  border-bottom-color: rgba(46, 197, 255, 0.55);
}

.home-cycles-table .people-directory-sort__ind {
  font-size: 11px;
  opacity: 0.85;
}

/* People Directory: left-align all cells (overrides global .home-cycles-table nth-child centering). */
.home-cycles-table.people-directory-table thead th,
.home-cycles-table.people-directory-table tbody td {
  text-align: left;
  padding-left: 10px;
  padding-right: 14px;
}

.home-cycles-table.people-directory-main-table {
  min-width: 2220px;
  table-layout: auto;
}

.admin-access-layout .people-directory-main-table-wrap {
  box-sizing: border-box;
  height: clamp(320px, min(62vh, calc(100dvh - 280px)), 680px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 0;
  scrollbar-gutter: stable;
}

.home-cycles-table.people-directory-main-table thead th,
.home-cycles-table.people-directory-main-table tbody td {
  padding-left: 12px;
  padding-right: 16px;
}

.home-cycles-table.people-directory-main-table thead th:first-child,
.home-cycles-table.people-directory-main-table tbody td:first-child {
  text-align: center;
  vertical-align: middle;
}

.home-cycles-table.people-directory-main-table .person-row-check {
  --app-checkbox-radius: 4px;
  --app-checkbox-checked-bg: var(--keshero-blue, #2ec5ff);
  --app-checkbox-checked-border: var(--keshero-blue, #2ec5ff);
  accent-color: var(--app-checkbox-checked-bg);
  display: inline-block;
  height: 16px;
  margin-left: 0;
  margin-bottom: 0;
  margin-top: 6px;
  width: 16px;
}

/* Job Catalog bulk-select: blue rounded square + white check (selection chrome). */
.home-cycles-table .job-catalog-row-check {
  --app-checkbox-radius: var(--app-dropdown-option-checkbox-radius, 4px);
  --app-checkbox-checked-bg: var(--app-dropdown-option-checkbox-checked-bg, var(--keshero-blue, #3a7bff));
  --app-checkbox-checked-border: var(--app-dropdown-option-checkbox-checked-border, var(--keshero-blue, #3a7bff));
  accent-color: var(--app-checkbox-checked-bg);
  border-radius: var(--app-checkbox-radius);
  display: inline-block;
  height: var(--app-checkbox-size, 16px);
  margin: 0;
  vertical-align: middle;
  width: var(--app-checkbox-size, 16px);
}

.home-cycles-table .job-catalog-row-check:checked {
  background-color: var(--app-checkbox-checked-bg);
  background-image: var(--app-checkbox-mark-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--app-checkbox-mark-size, 12px) var(--app-checkbox-mark-size, 12px);
  border-color: var(--app-checkbox-checked-border);
}

.home-cycles-table.people-directory-main-table thead th:nth-child(1),
.home-cycles-table.people-directory-main-table tbody td:nth-child(1) {
  min-width: 118px;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(3),
.home-cycles-table.people-directory-main-table tbody td:nth-child(3),
.home-cycles-table.people-directory-main-table thead th:nth-child(4),
.home-cycles-table.people-directory-main-table tbody td:nth-child(4) {
  text-align: center;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(4),
.home-cycles-table.people-directory-main-table tbody td:nth-child(4) {
  min-width: 150px;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(7),
.home-cycles-table.people-directory-main-table tbody td:nth-child(7) {
  min-width: 190px;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(8),
.home-cycles-table.people-directory-main-table tbody td:nth-child(8) {
  min-width: 230px;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(9),
.home-cycles-table.people-directory-main-table tbody td:nth-child(9) {
  min-width: 180px;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(10),
.home-cycles-table.people-directory-main-table tbody td:nth-child(10) {
  min-width: 220px;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(11),
.home-cycles-table.people-directory-main-table tbody td:nth-child(11) {
  min-width: 220px;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(12),
.home-cycles-table.people-directory-main-table tbody td:nth-child(12),
.home-cycles-table.people-directory-main-table thead th:nth-child(13),
.home-cycles-table.people-directory-main-table tbody td:nth-child(13),
.home-cycles-table.people-directory-main-table thead th:nth-child(14),
.home-cycles-table.people-directory-main-table tbody td:nth-child(14) {
  min-width: 160px;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(15),
.home-cycles-table.people-directory-main-table tbody td:nth-child(15) {
  min-width: 130px;
  text-align: center;
}

.home-cycles-table.people-directory-main-table thead th:nth-child(16),
.home-cycles-table.people-directory-main-table tbody td:nth-child(16) {
  min-width: 440px;
}

/* Field & Filter Management matrix: centered headers (except Field Name), compact centered checkboxes. */
.home-cycles-table.people-directory-table.field-management-matrix thead th {
  font-size: 12px;
  line-height: 1.25;
  max-width: 7.5rem;
  padding-left: 8px;
  padding-right: 8px;
  text-align: center;
  vertical-align: bottom;
  white-space: normal;
}

.home-cycles-table.people-directory-table.field-management-matrix thead th:first-child {
  max-width: none;
  text-align: left;
}

.home-cycles-table.people-directory-table.field-management-matrix thead th:last-child {
  max-width: none;
}

.home-cycles-table.people-directory-table.field-management-matrix tbody td:nth-child(n + 2):not(:last-child) {
  text-align: center;
  vertical-align: middle;
}

.home-cycles-table.people-directory-table.field-management-matrix tbody td:last-child {
  text-align: right;
  vertical-align: middle;
  white-space: nowrap;
}

.home-cycles-table.people-directory-table.field-management-matrix tbody td:last-child .field-management-actions {
  box-sizing: border-box;
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 4px;
  justify-content: flex-end;
  width: auto;
}

.home-cycles-table.people-directory-table.field-management-matrix .field-management-check {
  --app-checkbox-size: 19px;
  --app-checkbox-radius: 4px;
  --app-checkbox-checked-bg: var(--keshero-blue, #3a7bff);
  --app-checkbox-checked-border: var(--keshero-blue, #3a7bff);
  accent-color: var(--app-checkbox-checked-bg, var(--keshero-blue, #3a7bff));
  -webkit-tap-highlight-color: transparent;
  border-radius: var(--app-checkbox-radius, 4px);
  box-sizing: border-box !important;
  box-shadow: none !important;
  height: 19px !important;
  margin: 0;
  max-height: 19px !important;
  max-width: 19px !important;
  min-height: 19px !important;
  min-width: 19px !important;
  outline: 0;
  user-select: none;
  vertical-align: middle;
  width: 19px !important;
}

.home-cycles-table.people-directory-table.field-management-matrix .field-management-check:checked {
  background-color: var(--app-checkbox-checked-bg, var(--keshero-blue, #3a7bff));
  background-size: var(--app-checkbox-mark-size, 12px) var(--app-checkbox-mark-size, 12px);
  border-color: var(--app-checkbox-checked-border, var(--keshero-blue, #3a7bff));
}

.home-cycles-table.people-directory-table.field-management-matrix .field-management-check:focus,
.home-cycles-table.people-directory-table.field-management-matrix .field-management-check:focus-visible,
.home-cycles-table.people-directory-table.field-management-matrix .field-management-check:active {
  /* Keep checked fill/mark visible; only suppress focus chrome in the matrix. */
  box-shadow: none !important;
  outline: 0 !important;
}

.home-cycles-table.people-directory-table.field-management-matrix tbody td:has(.field-management-check:focus),
.home-cycles-table.people-directory-table.field-management-matrix tbody td:has(.field-management-check:focus-visible),
.home-cycles-table.people-directory-table.field-management-matrix tbody td:has(.field-management-check:active) {
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.home-cycles-table.people-directory-table.field-management-matrix tbody td.field-management-module-cell--locked {
  background: rgba(148, 163, 184, 0.08) !important;
}

.home-cycles-table.people-directory-table.field-management-matrix input.field-management-check--locked,
.home-cycles-table.people-directory-table.field-management-matrix input.field-management-check--locked:disabled {
  --app-checkbox-bg: #98a2b3;
  --app-checkbox-border: #7a8798;
  --app-checkbox-checked-bg: #98a2b3;
  --app-checkbox-checked-border: #7a8798;
  aspect-ratio: 1 !important;
  background-color: #98a2b3;
  background-image: none;
  border-color: #7a8798;
  box-sizing: border-box !important;
  box-shadow: none !important;
  cursor: not-allowed;
  flex: 0 0 19px !important;
  height: 19px !important;
  max-height: 19px !important;
  max-width: 19px !important;
  min-height: 19px !important;
  min-width: 19px !important;
  opacity: 1;
  width: 19px !important;
}

.home-cycles-table.people-directory-table.field-management-matrix input.field-management-check--locked::after {
  background: #fff;
  border: 0;
  content: "";
  display: block;
  height: 2px;
  width: 8px;
}

/* Module Access: keep the Name column left-aligned. */
.home-cycles-table.module-access-table thead th:nth-child(3),
.home-cycles-table.module-access-table tbody td:nth-child(3) {
  text-align: left;
}

.home-cycles-table.table-sticky-head thead th {
  position: sticky;
  top: 0;
  z-index: 3;
}

@media (max-width: 980px) {
  .spotlight-page,
  .spotlight-dashboard-panels {
    grid-template-columns: minmax(0, 1fr);
  }

  .spotlight-compose {
    position: static;
  }

  .app-sticky-actions,
  .comp-config-actions,
  .succession-edit-form > .button-primary:last-child {
    bottom: 12px;
    top: auto;
  }
}

@media (max-width: 640px) {
  body {
    padding: 12px 10px max(5rem, calc(76px + env(safe-area-inset-bottom, 0px)));
  }

  .app-filter-bar,
  .grid-filters-bar,
  .pm-home-filters,
  .surveys-filter-bar,
  .spotlight-dashboard-filters,
  .spotlight-search,
  .pm-assignment-board-toolbar,
  .comp-plan-table-filter-row {
    align-items: stretch;
    flex-direction: column;
  }

  .pm-home-filters,
  .surveys-filter-bar,
  .spotlight-dashboard-filters,
  .spotlight-search {
    grid-template-columns: minmax(0, 1fr);
  }

  .pm-home-filters label:first-child,
  .surveys-filter-bar label:first-child,
  .spotlight-dashboard-filters label:first-child,
  .spotlight-search > input[type="search"]:first-child {
    grid-column: auto;
  }

  .button-primary,
  .button-small,
  .button-danger-small,
  .button-add-small,
  .app-button,
  .grid-col-toggle-btn,
  .grid-filter-actions button,
  .grid-filter-clear,
  .comp-plan-tab {
    width: 100%;
  }

  .spotlight-stream-link {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 720px) {
  .profile-appearance-options {
    grid-template-columns: 1fr;
  }

  .profile-time-zone-options {
    grid-template-columns: 1fr;
  }

  .inbox-toolbar .button-small,
  .inbox-toolbar select {
    flex: 0 0 auto;
    width: auto !important;
  }

  .inbox-toolbar__actions,
  .inbox-toolbar__pager {
    align-items: center;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    min-width: max-content;
  }

  .inbox-toolbar__actions {
    display: grid !important;
    grid-template-columns: max-content minmax(132px, 160px) max-content max-content;
  }

  .inbox-toolbar__pager {
    display: inline-flex !important;
  }

  .inbox-toolbar__actions select {
    max-width: 132px;
  }
}
.pm-callout {
  background: rgba(58, 123, 255, 0.08);
  border: 1px solid rgba(58, 123, 255, 0.28);
  border-radius: 8px;
  color: #1e3a8a;
  margin: 8px 0;
  padding: 8px 12px;
}

.pm-callout strong {
  display: block;
  font-size: 13px;
  line-height: 1.3;
}

.pm-callout p {
  font-size: 12px;
  line-height: 1.35;
  margin: 3px 0 0;
}

.pm-inline-panel {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  margin-top: 14px;
  padding: 14px;
}

/* App-wide tab navigation: shared height + light-blue active across folder strips and scope pills. */
:root {
  --app-tab-divider: #b8c4d4;
  --app-tab-idle-bg: transparent;
  --app-tab-idle-border: #cbd5e1;
  --app-tab-idle-text: #344054;
  --app-tab-hover-bg: #f8fafc;
  --app-tab-hover-text: var(--app-action-primary-hover, #20b5e8);
  --app-tab-active-bg: var(--app-action-primary, var(--keshero-teal, #2ec5ff));
  --app-tab-active-border: var(--app-action-primary-border, #14a8d4);
  --app-tab-active-text: #ffffff;
  --app-tab-radius: 8px 8px 0 0;
  --app-tab-gap: 4px;
  --app-pill-bg: #ffffff;
  --app-pill-border: #dbe5ef;
  --app-pill-text: #344054;
  --app-pill-hover-bg: #f0fcff;
  --app-pill-hover-border: var(--keshero-cyan-glow, #6fe3ff);
  --app-pill-active-bg: var(--app-tab-active-bg);
  --app-pill-active-border: var(--app-tab-active-border);
  --app-pill-active-text: #ffffff;
  --app-pill-radius: 999px;
  --app-compact-panel-padding: 12px;
}

:where(
  .admin-access-tabs,
  .settings-section-nav,
  .spotlight-tabs,
  .pm-tabs,
  .pm-subtabs,
  .pm-manage-view-tabs,
  .pm-segmented-tabs,
  .checkin-tabbar,
  .checkin-hub-tabs,
  .development-plan-tabs,
  .surveys-section-tabs,
  .succession-tabs,
  .er-tabs,
  .keshboard-drawer__view-tabs,
  .org-map-view-toggle--tabs,
  .comp-plan-tabs,
  .psr-workspace-tabs
) {
  align-items: flex-end !important;
  border-bottom: 3px solid var(--app-tab-divider) !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: var(--app-tab-gap) !important;
  padding-bottom: 0 !important;
}

:where(
  .spotlight-dashboard-scopes,
  .keshboard-drawer__board-picker .keshboard-drawer__picker-row,
  .keshboard-drawer__team-view
) {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

/* Folder / underline strip tabs */
:where(
  .admin-access-tab,
  .settings-section-nav__pill,
  .spotlight-tabs a,
  .pm-tabs a,
  .pm-subtabs a,
  .pm-manage-view-tabs a,
  .pm-segmented-tabs a,
  .pm-segmented-tabs button,
  .checkin-tabbar button,
  .checkin-hub-tab,
  .development-plan-tab,
  .surveys-section-tabs a,
  .succession-tab,
  .er-tab,
  .keshboard-drawer__view-tabs button,
  .org-map-view-toggle--tabs .button-small,
  .comp-plan-tab,
  .psr-workspace-tab
) {
  align-items: center !important;
  background: var(--app-tab-idle-bg) !important;
  border: 1px solid var(--app-tab-idle-border) !important;
  border-bottom: 0 !important;
  border-radius: var(--app-tab-radius) !important;
  box-sizing: border-box !important;
  color: var(--app-tab-idle-text) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  justify-content: center !important;
  line-height: 1.15 !important;
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 14px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

:where(
  .admin-access-tab:hover,
  .settings-section-nav__pill:hover,
  .spotlight-tabs a:hover,
  .pm-tabs a:hover,
  .pm-subtabs a:hover,
  .pm-manage-view-tabs a:hover,
  .pm-segmented-tabs a:hover,
  .pm-segmented-tabs button:hover,
  .checkin-tabbar button:hover,
  .checkin-hub-tab:hover,
  .development-plan-tab:hover,
  .surveys-section-tabs a:hover,
  .succession-tab:hover,
  .er-tab:hover,
  .keshboard-drawer__view-tabs button:hover,
  .org-map-view-toggle--tabs .button-small:hover,
  .comp-plan-tab:hover,
  .psr-workspace-tab:hover
) {
  background: var(--app-tab-hover-bg) !important;
  color: var(--app-tab-hover-text) !important;
}

:where(
  .admin-access-tab.is-active,
  .settings-section-nav__pill.is-active,
  .spotlight-tabs a.is-active,
  .pm-tabs a.is-active,
  .pm-subtabs a.is-active,
  .pm-manage-view-tabs a.is-active,
  .pm-segmented-tabs a.is-active,
  .pm-segmented-tabs button.is-active,
  .checkin-tabbar button.is-active,
  .checkin-hub-tab.is-active,
  .development-plan-tab.is-active,
  .surveys-section-tabs a.is-active,
  .succession-tab.is-active,
  .succession-tab--active,
  .er-tab.is-active,
  .keshboard-drawer__view-tabs button.is-active,
  .org-map-view-toggle--tabs .button-small.is-active,
  .comp-plan-tab.is-active,
  .psr-workspace-tab.is-active
) {
  background: var(--app-tab-active-bg) !important;
  border-color: var(--app-tab-active-border) !important;
  color: var(--app-tab-active-text) !important;
}

/* Scope / filter pills (same height + teal active, fully rounded) */
:where(
  .spotlight-dashboard-scopes a,
  .keshboard-drawer__board-picker button,
  .keshboard-drawer__team-view button
) {
  align-items: center !important;
  background: var(--app-pill-bg) !important;
  border: 1px solid var(--app-pill-border) !important;
  border-radius: var(--app-pill-radius) !important;
  box-sizing: border-box !important;
  color: var(--app-pill-text) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  justify-content: center !important;
  line-height: 1.15 !important;
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 14px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

:where(
  .spotlight-dashboard-scopes a:hover,
  .keshboard-drawer__board-picker button:hover,
  .keshboard-drawer__team-view button:hover
) {
  background: var(--app-pill-hover-bg) !important;
  border-color: var(--app-pill-hover-border) !important;
  color: var(--app-action-primary-hover, #20b5e8) !important;
}

:where(
  .spotlight-dashboard-scopes a.is-active
) {
  background: var(--app-pill-active-bg) !important;
  border-color: var(--app-pill-active-border) !important;
  color: var(--app-pill-active-text) !important;
}

/* Match KeshBoard page picker active chip (#175cd3), not teal tab pills. */
:where(
  .keshboard-drawer__board-picker button.is-active,
  .keshboard-drawer__team-view button.is-active
) {
  background: #175cd3 !important;
  border-color: #175cd3 !important;
  color: #fff !important;
}

.admin-access-tab[href="/admin/access/field-management"] {
  max-width: 160px;
  text-align: center;
  white-space: normal !important;
}

.panel,
.home-table-wrap,
.inbox-panel,
.spotlight-compose,
.spotlight-dashboard,
.spotlight-card,
.recognition-hero,
.recognition-panel,
.recognition-card,
.checkin-hero,
.checkin-card,
.checkin-row,
.pm-card,
.pm-soft-panel,
.pm-inline-panel,
.succession-edit-section,
.comp-config-section,
.comp-analysis-card,
.comp-stat-card,
.perf-da-card,
.grid-top-legend-panel,
.grid-charts-panel,
.succession-bench-card,
  .succession-bench-container-card,
.pm-metric-card,
.spotlight-dashboard-kpis > div,
.recognition-kpi {
  border-color: var(--app-border) !important;
  border-radius: var(--app-radius-card) !important;
}

.panel,
.home-table-wrap,
.spotlight-compose,
.spotlight-dashboard,
.recognition-panel,
.checkin-card,
.pm-card,
.succession-edit-section,
.comp-config-section {
  padding: var(--app-card-padding);
}

/* Compact action standard: keep repeated controls crisp instead of bulky. */
.button-primary,
.button-small,
.button-add-small,
.button-danger-small,
.button-delete-small,
.button-save-small,
.button-archive {
  box-sizing: border-box;
  min-height: var(--app-control-height, 38px);
  padding: 0 12px;
}

.app-card,
.panel,
.home-table-wrap,
.inbox-panel,
.spotlight-compose,
.spotlight-card,
.spotlight-dashboard,
.pm-card,
.pm-soft-panel,
.pm-inline-panel,
.succession-edit-section,
.comp-config-section,
.comp-analysis-card,
.comp-stat-card,
.perf-da-card,
.grid-top-legend-panel,
.grid-charts-panel,
.checkin-card,
.recognition-panel {
  padding: var(--app-card-padding);
}

/* Stronger shared section definition for scanability across dense pages. */
:where(
  .app-card,
  .panel,
  .page-intro,
  .home-table-wrap,
  .inbox-panel,
  .inbox-card,
  .spotlight-compose,
  .spotlight-card,
  .spotlight-dashboard,
  .pm-card,
  .pm-soft-panel,
  .pm-inline-panel,
  .succession-edit-section,
  .comp-config-section,
  .comp-analysis-card,
  .comp-stat-card,
  .perf-da-card,
  .grid-top-legend-panel,
  .grid-charts-panel,
  .checkin-card,
  .recognition-panel,
  .profile-card,
  .profile-summary-card,
  .profile-editor-card,
  .profile-section-card,
  .settings-page-shell,
  .settings-general-panel,
  .settings-general-card,
  .settings-checkin-agenda-card,
  .admin-access-tabs,
  .succession-bench-card,
  .succession-bench-container-card
) {
  border-color: var(--app-container-border) !important;
  box-sizing: border-box;
  box-shadow: var(--app-container-shadow) !important;
  max-width: 100%;
  min-width: 0;
  position: relative;
}

/* App-wide overflow guard: dense tables and controls should scroll inside their
   nearest card/panel instead of pushing the whole page sideways. */
:where(
  .app-card,
  .panel,
  .page-intro,
  .home-table-wrap,
  .inbox-panel,
  .inbox-card,
  .spotlight-compose,
  .spotlight-card,
  .spotlight-dashboard,
  .pm-card,
  .pm-soft-panel,
  .pm-inline-panel,
  .succession-edit-section,
  .comp-config-section,
  .comp-analysis-card,
  .comp-stat-card,
  .perf-da-card,
  .grid-top-legend-panel,
  .grid-charts-panel,
  .checkin-card,
  .recognition-panel,
  .profile-card,
  .profile-summary-card,
  .profile-editor-card,
  .profile-section-card,
  .settings-page-shell,
  .settings-general-panel,
  .settings-general-card,
  .settings-checkin-agenda-card,
  .admin-access-tabs,
  .succession-bench-card,
  .succession-bench-container-card,
  .activity-panel,
  .activity-intro,
  .surveys-panel,
  .surveys-sentiment-card,
  .surveys-filter-bar,
  .split-screen-workspace,
  .split-screen-pane
),
:where(
  .app-card,
  .panel,
  .page-intro,
  .home-table-wrap,
  .inbox-panel,
  .inbox-card,
  .spotlight-compose,
  .spotlight-card,
  .spotlight-dashboard,
  .pm-card,
  .pm-soft-panel,
  .pm-inline-panel,
  .succession-edit-section,
  .comp-config-section,
  .comp-analysis-card,
  .comp-stat-card,
  .perf-da-card,
  .grid-top-legend-panel,
  .grid-charts-panel,
  .checkin-card,
  .recognition-panel,
  .profile-card,
  .profile-summary-card,
  .profile-editor-card,
  .profile-section-card,
  .settings-page-shell,
  .settings-general-panel,
  .settings-general-card,
  .settings-checkin-agenda-card,
  .admin-access-tabs,
  .succession-bench-card,
  .succession-bench-container-card,
  .activity-panel,
  .activity-intro,
  .surveys-panel,
  .surveys-sentiment-card,
  .surveys-filter-bar,
  .split-screen-workspace,
  .split-screen-pane
) > * {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
}

:where(
  .home-table-wrap,
  .pm-table-scroll,
  .grid-table-scroll,
  .reporting-table-scroll,
  .activity-table-scroll,
  .activity-table-wrap,
  .comp-config-table-wrap,
  .perf-da-table-wrap,
  .admin-notifications-table-wrap,
  .admin-access-table-wrap,
  .admin-access-audit-table-wrap,
  .module-access-table-wrap,
  .da-table-wrap,
  .pm-cycle-edit-table-wrap,
  .succession-table-scroll,
  .field-management-impact-guide-wrap
) {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
}

/* Keep scrollable panels visually rounded when native scrollbars appear. */
:where(
  .panel,
  .home-table-wrap,
  .pm-card,
  .pm-table-scroll,
  .grid-table-scroll,
  .reporting-table-scroll,
  .activity-table-scroll,
  .comp-config-table-wrap,
  .perf-da-card,
  .perf-da-table-wrap,
  .checkin-session-shared-editor,
  .checkin-session-history,
  .home-sv-filter-options
) {
  background-clip: padding-box;
  overflow-clip-margin: 0;
  scrollbar-color: rgba(100, 116, 139, 0.52) transparent;
  scrollbar-width: thin;
}

:where(
  .pm-table-scroll,
  .grid-table-scroll,
  .reporting-table-scroll,
  .activity-table-scroll,
  .comp-config-table-wrap,
  .perf-da-table-wrap,
  .checkin-session-history,
  .home-sv-filter-options
) {
  clip-path: inset(0 round var(--app-radius-card));
}

:where(
  .panel,
  .home-table-wrap,
  .pm-card,
  .pm-table-scroll,
  .grid-table-scroll,
  .reporting-table-scroll,
  .activity-table-scroll,
  .comp-config-table-wrap,
  .perf-da-card,
  .perf-da-table-wrap,
  .checkin-session-shared-editor,
  .checkin-session-history,
  .home-sv-filter-options
)::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}

:where(
  .panel,
  .home-table-wrap,
  .pm-card,
  .pm-table-scroll,
  .grid-table-scroll,
  .reporting-table-scroll,
  .activity-table-scroll,
  .comp-config-table-wrap,
  .perf-da-card,
  .perf-da-table-wrap,
  .checkin-session-shared-editor,
  .checkin-session-history,
  .home-sv-filter-options
)::-webkit-scrollbar-track,
:where(
  .panel,
  .home-table-wrap,
  .pm-card,
  .pm-table-scroll,
  .grid-table-scroll,
  .reporting-table-scroll,
  .activity-table-scroll,
  .comp-config-table-wrap,
  .perf-da-card,
  .perf-da-table-wrap,
  .checkin-session-shared-editor,
  .checkin-session-history,
  .home-sv-filter-options
)::-webkit-scrollbar-corner {
  background: transparent;
}

:where(
  .panel,
  .home-table-wrap,
  .pm-card,
  .pm-table-scroll,
  .grid-table-scroll,
  .reporting-table-scroll,
  .activity-table-scroll,
  .comp-config-table-wrap,
  .perf-da-card,
  .perf-da-table-wrap,
  .checkin-session-shared-editor,
  .checkin-session-history,
  .home-sv-filter-options
)::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, 0.44);
  background-clip: padding-box;
  border: 2px solid transparent;
  border-radius: 999px;
}

:where(
  .app-card,
  .panel,
  .page-intro,
  .home-table-wrap,
  .inbox-panel,
  .spotlight-compose,
  .spotlight-card,
  .spotlight-dashboard,
  .pm-card,
  .pm-soft-panel,
  .pm-inline-panel,
  .succession-edit-section,
  .comp-config-section,
  .comp-analysis-card,
  .comp-stat-card,
  .perf-da-card,
  .grid-top-legend-panel,
  .grid-charts-panel,
  .checkin-card,
  .recognition-panel,
  .profile-card,
  .settings-page-shell,
  .settings-general-panel,
  .settings-checkin-agenda-card,
  .succession-bench-card,
  .succession-bench-container-card
)::before {
  background: var(--app-container-accent-line-custom, linear-gradient(90deg, #2EC5FF 0%, #8B5CF6 100%)) top left / 100% 3px no-repeat;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  content: "";
  height: var(--app-container-accent-line-clip-height, 14px);
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
}

:where(
  .app-card,
  .home-table-wrap,
  .inbox-panel,
  .spotlight-card,
  .pm-card,
  .succession-edit-section,
  .comp-config-section,
  .perf-da-card,
  .checkin-card,
  .recognition-panel,
  .profile-card,
  .settings-general-card,
  .succession-bench-card
):hover {
  box-shadow: var(--app-container-shadow-hover) !important;
}

.settings-section-nav {
  display: none !important;
}

/* Admin Access + Settings: grouped left sidebar shell */
.admin-section-sidebar.settings-sidebar,
.admin-section-sidebar.admin-access-sidebar {
  align-self: flex-start;
  background: #f8fafc;
  border-right: 1px solid #e4e7ec;
  box-sizing: border-box;
  flex-shrink: 0;
  max-height: calc(100vh - 96px);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 12px 10px;
  position: sticky;
  top: 88px;
  width: 220px;
  z-index: 40;
}
.admin-section-sidebar__group,
.settings-sidebar__group,
.admin-access-sidebar__group {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  padding: 6px 4px 4px;
}
.admin-section-sidebar__group + .admin-section-sidebar__group,
.settings-sidebar__group + .settings-sidebar__group,
.admin-access-sidebar__group + .admin-access-sidebar__group {
  margin-top: 16px;
}
.admin-section-sidebar__group-title,
.settings-sidebar__group-title,
.admin-access-sidebar__group-title {
  --app-disclosure-chevron-size: 7px;
  --app-disclosure-chevron-thickness: 2px;
  --app-disclosure-chevron-color: #475467;
  align-items: center;
  background: #e8edf3;
  border-radius: 4px;
  color: #1d2939;
  cursor: pointer;
  display: flex;
  font-size: 11px;
  font-weight: 800;
  gap: 8px;
  letter-spacing: 0.07em;
  line-height: 1.3;
  list-style: none;
  margin: 0 0 4px;
  padding: 7px 10px 6px;
  text-transform: uppercase;
  user-select: none;
}
.admin-section-sidebar__group-title::-webkit-details-marker,
.settings-sidebar__group-title::-webkit-details-marker,
.admin-access-sidebar__group-title::-webkit-details-marker {
  display: none;
}
.admin-section-sidebar__group:not([open]) > .admin-section-sidebar__group-title,
.settings-sidebar__group:not([open]) > .settings-sidebar__group-title,
.admin-access-sidebar__group:not([open]) > .admin-access-sidebar__group-title {
  margin-bottom: 0;
}
.admin-section-sidebar__link,
.settings-sidebar__link,
.admin-access-sidebar__link {
  border-radius: 6px;
  color: #344054;
  display: block;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  margin: 1px 0;
  padding: 7px 10px;
  text-decoration: none;
}
.admin-section-sidebar__link:hover,
.settings-sidebar__link:hover,
.admin-access-sidebar__link:hover {
  background: #eef4ff;
  color: #1aa6d6;
}
.admin-section-sidebar__link.is-active,
.settings-sidebar__link.is-active,
.admin-access-sidebar__link.is-active {
  background: #2ec5ff;
  color: #fff;
  font-weight: 600;
}
.admin-access-layout {
  align-items: stretch;
  box-sizing: border-box;
  display: flex;
  gap: 0;
  margin: 12px 0 0;
  min-height: calc(100vh - 120px);
  position: relative;
  width: 100%;
}
.admin-access-main {
  box-sizing: border-box;
  flex: 1;
  min-width: 0;
  padding-left: 0;
  padding-right: clamp(16px, 3vw, 28px);
}
.admin-access-main > .panel {
  margin-top: 0;
}
.admin-section-sidebar-toggle {
  display: none;
}
@media (min-width: 900px) {
  .settings-layout > .admin-section-sidebar-toggle,
  .admin-access-layout > .admin-section-sidebar-toggle {
    order: 1;
  }
  .settings-layout > .admin-section-sidebar,
  .admin-access-layout > .admin-section-sidebar {
    order: 2;
  }
  .settings-layout > .settings-main,
  .admin-access-layout > .admin-access-main {
    order: 3;
  }
  .settings-sidebar-toggle,
  .admin-section-sidebar-toggle {
    align-items: center;
    align-self: flex-start;
    background: #f8fafc;
    border: 1px solid #e4e7ec;
    border-right: 0;
    border-radius: 10px 0 0 10px;
    box-shadow: -1px 0 0 rgba(15, 23, 42, 0.02);
    color: #475467;
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    flex-shrink: 0;
    gap: 8px;
    justify-content: center;
    margin: 0;
    min-height: 52px;
    padding: 10px 5px;
    position: sticky;
    top: 100px;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
    width: 22px;
    z-index: 41;
  }
  .admin-section-sidebar-toggle__glyph {
    border-bottom: 1.5px solid currentColor;
    border-left: 1.5px solid currentColor;
    display: block;
    flex-shrink: 0;
    height: 7px;
    transform: rotate(45deg);
    width: 7px;
  }
  .admin-section-sidebar-toggle.is-collapsed .admin-section-sidebar-toggle__glyph {
    transform: rotate(-135deg);
  }
  .admin-section-sidebar-toggle__label {
    color: inherit;
    display: none;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.1;
    text-transform: uppercase;
    writing-mode: vertical-rl;
  }
  .settings-layout.is-sidebar-collapsed .admin-section-sidebar-toggle,
  .admin-access-layout.is-sidebar-collapsed .admin-section-sidebar-toggle {
    background: #fff;
    border: 1px solid #d0d5dd;
    border-radius: 10px;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
    gap: 10px;
    min-height: 132px;
    padding: 14px 8px;
    width: 36px;
  }
  .settings-layout.is-sidebar-collapsed .admin-section-sidebar-toggle .admin-section-sidebar-toggle__label,
  .admin-access-layout.is-sidebar-collapsed .admin-section-sidebar-toggle .admin-section-sidebar-toggle__label {
    display: inline-block;
  }
  .settings-layout.is-sidebar-collapsed .admin-section-sidebar.settings-sidebar,
  .admin-access-layout.is-sidebar-collapsed .admin-section-sidebar.settings-sidebar,
  .admin-access-layout.is-sidebar-collapsed .admin-section-sidebar.admin-access-sidebar {
    display: none;
  }
  .settings-layout.is-sidebar-collapsed .settings-main.settings-page-shell,
  .admin-access-layout.is-sidebar-collapsed .admin-access-main {
    padding-left: clamp(8px, 1.5vw, 16px);
  }
}
@media (max-width: 899px) {
  .settings-sidebar-toggle,
  .admin-section-sidebar-toggle {
    background: #fff;
    border: 1px solid #d0d5dd;
    border-radius: 8px;
    color: #344054;
    cursor: pointer;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    margin: 0 0 10px;
    padding: 8px 12px;
  }
  .settings-layout,
  .admin-access-layout {
    flex-direction: column;
    min-height: 0;
    padding-left: clamp(16px, 3vw, 40px);
    padding-right: clamp(16px, 3vw, 40px);
  }
  .settings-layout .settings-main.settings-page-shell,
  .admin-access-layout .admin-access-main {
    padding-left: 0;
    padding-right: 0;
  }
  .admin-section-sidebar.settings-sidebar,
  .admin-section-sidebar.admin-access-sidebar {
    align-self: auto;
    background: #fff;
    border: 1px solid #e4e7ec;
    border-radius: 8px;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
    display: none;
    left: clamp(16px, 3vw, 40px);
    max-height: min(70vh, 520px);
    position: fixed;
    top: 108px;
    width: min(280px, calc(100vw - 32px));
    z-index: 120;
  }
  .settings-layout.is-sidebar-open .admin-section-sidebar.settings-sidebar,
  .admin-access-layout.is-sidebar-open .admin-section-sidebar.settings-sidebar,
  .admin-access-layout.is-sidebar-open .admin-section-sidebar.admin-access-sidebar {
    display: block;
  }
  .admin-section-sidebar-overlay {
    background: rgba(15, 23, 42, 0.42);
    border: 0;
    cursor: pointer;
    display: block;
    inset: 0;
    position: fixed;
    z-index: 110;
  }
  .admin-section-sidebar-overlay[hidden] {
    display: none !important;
  }
  body.admin-section-sidebar-body-lock {
    overflow: hidden;
  }
}
body:has(.admin-access-layout) .app-back-nav,
body:has(.settings-layout) .app-back-nav {
  margin-left: 0;
  margin-right: 0;
  max-width: none;
  padding: 0;
  width: 100%;
}
body:has(.admin-access-layout) .app-back-nav--with-settings-search,
body:has(.settings-layout) .app-back-nav--with-settings-search {
  box-sizing: border-box;
  padding: 0 18px;
}
body:has(.admin-access-layout) .admin-access-main > .panel {
  --app-container-accent-line-clip-height: 3px;
  background: var(--app-surface) !important;
  border: 1px solid var(--app-container-border) !important;
  border-radius: var(--app-radius-card) !important;
  box-shadow: var(--app-container-shadow) !important;
  box-sizing: border-box;
  margin-bottom: 16px;
  padding: 14px !important;
  position: relative;
}
@media (min-width: 900px) {
  .admin-access-layout:not(.is-sidebar-collapsed) .admin-access-main > .panel {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
  }
}
body:has(.admin-access-layout) .admin-access-main > .panel::before {
  background: linear-gradient(90deg, rgba(46, 197, 255, 0.72), rgba(90, 75, 255, 0.62), rgba(138, 43, 226, 0));
  border-radius: inherit;
  content: "";
  display: block !important;
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
}
body:has(.admin-access-layout) .admin-access-intro.admin-access-intro--spaced {
  margin-top: 0;
}

.admin-access-tabs-panel,
.admin-access-tabs {
  display: none !important;
}

body:has(.admin-access-tabs) > .panel {
  --app-container-accent-line-clip-height: 3px;
  margin-left: auto;
  margin-right: auto;
  max-width: 1480px;
  width: calc(100% - 56px);
}

body:has(.admin-access-tabs) > .panel:has(> .admin-access-tabs) {
  background: var(--app-surface) !important;
  border: 1px solid var(--app-container-border) !important;
  border-radius: var(--app-radius-card) !important;
  box-shadow: var(--app-container-shadow) !important;
  box-sizing: border-box;
  padding: 14px !important;
}

body:has(.admin-access-tabs) > .panel:has(> .admin-access-tabs)::before {
  background: linear-gradient(90deg, rgba(46, 197, 255, 0.72), rgba(90, 75, 255, 0.62), rgba(138, 43, 226, 0));
  border-radius: inherit;
  content: "";
  display: block !important;
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
}

body:has(.admin-access-tabs) .admin-access-tabs {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box;
  display: grid !important;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
}

body:has(.admin-access-tabs) .admin-access-tabs::before {
  display: none !important;
}

body:has(.admin-access-tabs) .admin-access-tab {
  box-sizing: border-box;
  min-height: 34px !important;
  min-width: 0;
  padding: 7px 10px !important;
  width: 100%;
}

body:has(.admin-access-tabs) .admin-access-tab[href="/admin/access/field-management"] {
  line-height: 1.12;
  min-height: 42px !important;
  text-align: center;
  text-wrap: balance;
  white-space: normal !important;
}

body:has(.admin-access-tabs) .admin-access-tab[href="/admin/access/unmapped-performance"],
body:has(.admin-access-tabs) .admin-access-tab[href="/admin/access/manager-hierarchy-issues"] {
  align-items: center;
  flex-direction: column;
  justify-content: center;
  line-height: 1.12;
  min-height: 42px !important;
  text-align: center;
  text-wrap: balance;
  white-space: normal !important;
}

body:has(.admin-access-tabs) .admin-access-tab[href="/admin/access/unmapped-performance"] span,
body:has(.admin-access-tabs) .admin-access-tab[href="/admin/access/manager-hierarchy-issues"] span {
  display: block;
  text-align: center;
  width: 100%;
}

body:has(.admin-access-tabs) > .panel:not(:has(> .admin-access-tabs)) {
  background:
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border-color: var(--app-container-border) !important;
  box-shadow: var(--app-container-shadow) !important;
  display: grid;
  gap: 14px;
  margin-top: 14px;
  padding: 18px !important;
}

body:has(.admin-access-tabs) > .panel:not(:has(> .admin-access-tabs))::before {
  background: linear-gradient(90deg, rgba(46, 197, 255, 0.7), rgba(90, 75, 255, 0.54), rgba(138, 43, 226, 0)) top left / 100% 3px no-repeat;
  height: 3px;
}

body:has(.admin-access-tabs) .admin-access-intro {
  background:
    linear-gradient(135deg, rgba(240, 251, 255, 0.92), rgba(248, 250, 252, 0.98));
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  color: #475467;
  line-height: 1.5;
  margin: 0;
  max-width: none;
  padding: 13px 14px;
  white-space: normal;
}

body:has(.admin-access-tabs) .admin-access-intro strong {
  color: #101828;
  font-weight: 850;
}

body:has(.admin-access-tabs) .admin-access-intro.admin-access-intro--spaced {
  margin-bottom: 16px;
}

body:has(.admin-access-tabs) .pm-form,
body:has(.admin-access-tabs) .pm-compact-form,
body:has(.admin-access-tabs) .admin-module-access-setup,
body:has(.admin-access-tabs) .module-access-guide > div,
body:has(.admin-access-tabs) #fieldManagementForm > div[style*="border"],
body:has(.admin-access-tabs) .panel > div[style*="display:grid"] > form.pm-form,
body:has(.admin-access-tabs) .panel > form.pm-form,
body:has(.admin-access-tabs) .panel > div[style*="border:1px solid"] {
  background: #ffffff !important;
  border: 1px solid var(--app-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.045) !important;
  padding: 14px !important;
}

body:has(.admin-access-tabs) .pm-form > div[style*="display:flex"],
body:has(.admin-access-tabs) .pm-compact-form > div[style*="display:flex"],
body:has(.admin-access-tabs) form[method="get"][style*="display:flex"],
body:has(.admin-access-tabs) form[id$="BulkForm"] > div,
body:has(.admin-access-tabs) .panel > div[style*="justify-content:space-between"] {
  gap: 10px !important;
}

body:has(.admin-access-tabs) .pm-form label,
body:has(.admin-access-tabs) .pm-compact-form label,
body:has(.admin-access-tabs) form[method="get"] label,
body:has(.admin-access-tabs) form[method="post"] label {
  color: var(--app-table-header-text);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
}

body:has(.admin-access-tabs) input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not(.topbar-search__input),
body:has(.admin-access-tabs) select,
body:has(.admin-access-tabs) textarea {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: var(--app-radius-control);
  box-shadow: inset 0 1px 1px rgba(15, 23, 42, 0.025);
  color: var(--app-text);
  min-height: var(--app-control-height);
}

body:has(.admin-access-tabs) input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not(.topbar-search__input):focus,
body:has(.admin-access-tabs) select:focus,
body:has(.admin-access-tabs) textarea:focus {
  border-color: var(--app-action-primary);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  outline: none;
}

body:has(.admin-access-tabs) .people-directory-more-filters {
  background: #fbfdff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 10px 12px;
}

body:has(.admin-access-tabs) .people-directory-more-filters summary {
  color: #344054 !important;
  cursor: pointer;
  font-weight: 850 !important;
}

body:has(.admin-access-tabs) .home-table-wrap {
  border: 1px solid var(--app-table-border) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78), 0 8px 20px rgba(15, 23, 42, 0.045) !important;
  margin-top: 0;
  overflow: auto;
  padding: 0 !important;
}

body:has(.admin-access-tabs) .home-table-wrap::before {
  display: none !important;
}

body:has(.admin-access-tabs) #fieldManagementForm,
body:has(.admin-access-tabs) #fieldManagementForm > *,
body:has(.admin-access-tabs) .field-management-section-card {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
}

body:has(.admin-access-tabs) .field-management-section-card .home-table-wrap {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: visible;
}

body:has(.admin-access-tabs) .home-cycles-table th,
body:has(.admin-access-tabs) .home-cycles-table td {
  padding: 10px 11px;
}

body:has(.admin-access-tabs) .home-cycles-table.admin-field-mapping-table th,
body:has(.admin-access-tabs) .home-cycles-table.admin-field-mapping-table td {
  padding: 14px 11px;
}

body:has(.admin-access-tabs) .home-cycles-table thead th {
  background: #f8fafc;
  color: #344054;
  position: sticky;
  top: 0;
  z-index: 2;
}

body:has(.admin-access-tabs) .home-cycles-table tbody tr:hover td {
  background: #f2fcff;
}

body:has(.admin-access-tabs) .people-directory-sort {
  align-items: center;
  border-radius: 6px;
  color: #344054 !important;
  display: inline-flex;
  font-weight: 900;
  justify-content: center;
  min-height: 26px;
  padding: 3px 7px;
  text-decoration: none;
}

body:has(.admin-access-tabs) .people-directory-sort:hover,
body:has(.admin-access-tabs) .people-directory-sort--active {
  background: rgba(46, 197, 255, 0.12);
  color: #0477a6 !important;
}

body:has(.admin-access-tabs) .people-directory-pagination {
  background: #fbfdff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  margin: 0;
  padding: 10px 12px;
}

body:has(.admin-access-tabs) .home-table-wrap {
  height: var(--app-table-scroll-height);
  max-height: var(--app-table-scroll-height);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

body:has(.admin-access-tabs) .people-directory-pagination input[type="number"] {
  min-height: 30px;
  width: 76px;
}

body:has(.admin-access-tabs) .people-directory-page-size-form {
  align-items: center;
  display: flex;
  gap: 8px;
  margin: 0 0 0 auto;
}

body:has(.admin-access-tabs) .people-directory-page-size-summary {
  color: #475467;
  font-size: 13px;
  font-weight: 600;
}

body:has(.admin-access-tabs) .people-directory-page-size-label {
  align-items: flex-start;
  color: #344054;
  display: inline-flex;
  flex-direction: column;
  font-size: 12px;
  font-weight: 800;
  gap: 4px;
  line-height: 1.1;
}

body:has(.admin-access-tabs) .people-directory-page-size-form select,
body:has(.admin-access-tabs) .people-directory-page-size-form .app-rounded-select,
body:has(.admin-access-tabs) .people-directory-page-size-apply {
  box-sizing: border-box;
  min-height: 34px;
}

body:has(.admin-access-tabs) .people-directory-page-size-form .app-rounded-select__button {
  min-height: 34px;
}

body:has(.admin-access-tabs) .people-directory-page-jump-form {
  align-items: center;
  display: inline-flex;
  gap: 6px;
}

.people-directory-filter-grid,
.people-directory-more-filter-grid {
  align-items: end;
  display: grid;
  gap: 10px 12px;
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
  margin-top: 0;
  width: 100%;
}

.people-directory-more-filter-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
  margin-top: 12px;
}

.people-directory-filter-grid > label,
.people-directory-more-filter-grid > label {
  display: grid;
  gap: 5px;
  min-width: 0;
  width: auto;
}

.people-directory-filter-grid input,
.people-directory-filter-grid select,
.people-directory-more-filter-grid select {
  min-width: 0;
  width: 100%;
}

.people-directory-filter-actions {
  align-items: end;
  align-self: end;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.people-directory-filter-card:has(.people-directory-more-filters[open])
  .people-directory-filter-grid
  > .people-directory-filter-actions {
  display: none;
}

.people-directory-more-filters > .people-directory-filter-actions {
  margin-top: 12px;
}

.people-directory-filter-actions .admin-access-filter-action {
  box-sizing: border-box;
  height: var(--app-control-height);
  min-height: var(--app-control-height) !important;
  padding: 0 14px !important;
  width: auto;
}

.people-directory-toolbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  justify-content: space-between;
  margin-bottom: 10px;
  width: 100%;
}

.people-directory-toolbar form,
.people-directory-toolbar form[id$="Form"],
.people-directory-toolbar .admin-access-inline-form,
.people-directory-page-size-form {
  align-items: center;
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px !important;
  margin: 0;
  width: auto;
}

.people-directory-toolbar__bulk,
.people-directory-bulk-controls,
.people-directory-toolbar .admin-access-bulk-controls {
  align-items: center;
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.people-directory-toolbar__page {
  align-items: center;
  margin-left: auto;
}

.people-directory-toolbar__field,
.people-directory-toolbar label.people-directory-toolbar__field,
.people-directory-toolbar label.people-directory-toolbar__field:has(> .required-star) {
  align-items: center;
  display: inline-flex !important;
  flex-direction: row;
  gap: 8px;
  margin: 0;
  max-width: none;
  width: auto;
}

.people-directory-toolbar label.people-directory-toolbar__field:has(> .required-star) > select,
.people-directory-toolbar label.people-directory-toolbar__field:has(> .required-star) > .app-rounded-select {
  margin-top: 0;
}

.people-directory-toolbar__label {
  color: #344054;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.people-directory-toolbar #bulkActionSelect,
.people-directory-toolbar #bulkActionSelect + .app-rounded-select {
  flex: 0 0 210px;
  max-width: 210px;
  min-width: 210px;
  width: 210px;
}

.people-directory-toolbar #bulkActionSelect + .app-rounded-select .app-rounded-select__menu {
  min-width: 240px;
}

.people-directory-toolbar .people-directory-bulk-apply,
.people-directory-toolbar .admin-access-bulk-apply,
.people-directory-page-size-form .people-directory-page-size-apply,
.people-directory-toolbar select,
.people-directory-toolbar .app-rounded-select,
.people-directory-toolbar .app-rounded-select__button,
.people-directory-page-size-form select,
.people-directory-page-size-form .app-rounded-select,
.people-directory-page-size-form .app-rounded-select__button {
  box-sizing: border-box;
  min-height: 34px;
}

.app-page-size,
.people-directory-page-size-label.app-page-size {
  align-items: center;
  color: #344054;
  display: inline-flex !important;
  flex-direction: row;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  letter-spacing: 0.01em;
  margin: 0;
  max-width: none;
  white-space: nowrap;
  width: auto;
}

.app-page-size__label {
  color: inherit;
  font: inherit;
}

.app-page-size select,
.app-page-size .app-rounded-select,
.app-page-size .app-rounded-select__button {
  box-sizing: border-box;
  min-height: 34px;
}

.app-page-size .app-rounded-select,
.people-directory-page-size-form .app-rounded-select {
  flex: 0 0 96px;
  min-width: 96px;
  width: 96px;
}

.people-directory-page-size-summary,
.people-directory-selected-count,
.people-directory-toolbar .admin-access-bulk-count {
  color: #475467;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

.people-directory-toolbar .admin-access-bulk-status {
  color: #b42318;
  font-size: 12px;
  font-weight: 700;
}

.people-directory-toolbar .admin-access-bulk-status[hidden] {
  display: none;
}

@media (max-width: 700px) {
  .people-directory-filter-actions {
    width: 100%;
  }

  .people-directory-filter-actions .admin-access-filter-action {
    flex: 1 1 auto;
  }
}

body:has(.admin-access-tabs) .people-directory-bulk-controls {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
}

body:has(.admin-access-tabs) .admin-access-bulk-controls {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body:has(.admin-access-tabs) .people-directory-bulk-controls #bulkActionSelect,
body:has(.admin-access-tabs) .people-directory-bulk-controls #bulkActionSelect + .app-rounded-select {
  flex: 0 0 160px;
  min-width: 160px;
  width: 160px;
}

body:has(.admin-access-tabs) .people-directory-bulk-controls #bulkActionSelect + .app-rounded-select .app-rounded-select__menu {
  min-width: 300px;
}

body:has(.admin-access-tabs) .people-directory-bulk-controls select,
body:has(.admin-access-tabs) .people-directory-bulk-apply,
body:has(.admin-access-tabs) .admin-access-bulk-apply {
  box-sizing: border-box;
  min-height: 34px;
}

body:has(.admin-access-tabs) .admin-access-bulk-count,
body:has(.admin-access-tabs) .people-directory-selected-count {
  color: #475467;
  display: inline-flex;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  min-width: 72px;
  white-space: nowrap;
}

body:has(.admin-access-tabs) .admin-access-bulk-status {
  color: #b42318;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  min-width: 180px;
}

body:has(.admin-access-tabs) .admin-access-bulk-status[hidden] {
  display: none;
}

body:has(.admin-access-tabs) .people-directory-page-nav--disabled {
  opacity: 0.5;
}

.admin-access-layout .people-directory-actions-cell {
  position: relative;
  vertical-align: top;
  white-space: nowrap;
}

.admin-access-layout .people-directory-actions-cell:has(.people-directory-schedule-details[open]) {
  z-index: 8;
}

.admin-access-layout .people-directory-row-actions {
  align-items: center;
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 6px;
  position: relative;
  white-space: nowrap;
  width: 100%;
}

.admin-access-layout .people-directory-row-actions form {
  margin: 0;
}

.admin-access-layout .people-directory-row-actions .button-small {
  flex: 0 0 auto;
}

.admin-access-layout .people-directory-deactivate-form {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 6px;
  max-width: none;
}

.admin-access-layout .people-directory-schedule-details {
  display: inline-grid;
  justify-items: start;
}

.admin-access-layout .people-directory-schedule-summary {
  align-items: center;
  background: var(--app-action-secondary, #fff);
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 7px;
  line-height: 1;
  list-style: none;
  min-height: 32px;
  padding: 0 10px;
  white-space: nowrap;
}

.admin-access-layout .people-directory-schedule-summary::-webkit-details-marker,
.admin-access-layout .people-directory-schedule-summary::marker {
  display: none;
  content: "";
}

.admin-access-layout .people-directory-schedule-summary.is-pending {
  background: #eff8ff;
  border-color: #b2ddff;
  color: #175cd3;
}

.admin-access-layout .people-directory-schedule-panel {
  background: #f8fbff;
  border: 1px solid #bfd7f0;
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(16, 24, 40, 0.14);
  box-sizing: border-box;
  display: grid;
  gap: 10px 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 360px;
  padding: 12px;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  white-space: normal;
  width: max(100%, 360px);
  z-index: 9;
}

.admin-access-layout .people-directory-schedule-panel label {
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 4px;
  min-width: 0;
  width: 100%;
}

.admin-access-layout .people-directory-schedule-hint {
  color: #667085;
  font-size: 12px;
  font-weight: 600;
  grid-column: 1 / -1;
  line-height: 1.4;
  margin: 0;
}

.admin-access-layout .people-directory-schedule-panel .button-small {
  grid-column: 1 / -1;
  justify-self: stretch;
  width: 100%;
}

.admin-access-layout .people-directory-deactivate-form input[type="date"] {
  flex: 0 0 auto;
  min-width: 142px;
  width: 100%;
}

.admin-access-layout .people-directory-deactivate-form input[type="time"] {
  flex: 0 0 auto;
  min-width: 116px;
  width: 100%;
}

.admin-access-layout .people-directory-deactivate-form .keshero-date-format-field {
  flex: 0 0 auto;
  max-width: none;
  min-width: 0;
  width: 100%;
}

.admin-access-layout .people-directory-deactivate-form .keshero-date-format-input {
  min-width: 0;
}

body:has(.admin-access-tabs) .module-access-guide {
  gap: 12px !important;
}

body:has(.admin-access-tabs) .module-access-guide > div > div:first-child,
body:has(.admin-access-tabs) #fieldManagementForm > div[style*="border"] > div:first-child,
body:has(.admin-access-tabs) .panel > div[style*="display:grid"] > form.pm-form > h3:first-child {
  color: #101828;
}

/* Module Access page: denser, cleaner permission-management layout. */
.module-access-page {
  gap: 12px !important;
}

.module-access-page .admin-module-access-setup {
  background:
    linear-gradient(135deg, rgba(239, 250, 255, 0.98), rgba(255, 255, 255, 0.96)) !important;
  border-color: #b9e6fe !important;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.06) !important;
  margin-bottom: 0 !important;
  overflow: hidden;
  position: relative;
}

.admin-module-access-setup {
  background: var(--app-surface-muted, #f8fafc);
  border: 1px solid var(--app-border, #dbe5ef);
  border-radius: 8px;
  margin-bottom: 18px;
  padding: 16px 18px;
}

.module-access-page .admin-module-access-setup::before {
  background: linear-gradient(180deg, #2ec5ff, #5a4bff);
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  top: 0;
  width: 4px;
}

.module-access-page .admin-module-access-setup > div {
  position: relative;
  z-index: 1;
}

.module-access-setup-header {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
}

.module-access-setup-title {
  font-size: 15px;
  font-weight: 700;
  margin: 0;
}

.module-access-setup-help {
  display: none;
  margin-top: 12px;
}

.module-access-setup-help.is-open,
.module-access-guide-body.is-open {
  display: block;
}

.module-access-setup-copy {
  color: #475467;
  font-size: 14px;
  line-height: 1.5;
  margin: 0 0 12px;
}

.module-access-setup-list {
  color: #344054;
  font-size: 14px;
  line-height: 1.55;
  margin: 0 0 14px;
  padding-left: 1.25rem;
}

.module-access-setup-list li:not(:last-child) {
  margin-bottom: 6px;
}

.module-access-setup-note {
  color: #667085;
  font-size: 13px;
  margin: 0 0 10px;
}

.module-access-setup-link {
  display: inline-block;
  margin-top: 4px;
}

.module-access-page .admin-module-access-setup p:first-child,
.module-access-section-title {
  color: #101828;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: 0;
}

.module-access-page .module-access-guide {
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  margin-bottom: 0 !important;
}

.module-access-guide-card {
  background:
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  border-color: #dbe5ef !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.045) !important;
  overflow: hidden;
}

.module-access-guide-header {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding: 12px;
}

.module-access-guide-card > div:first-child {
  background: #fbfdff;
  border-bottom: 1px solid #eef2f6;
  min-height: 48px;
}

.module-access-guide-card > div:first-child strong {
  color: #101828;
  font-size: 13px;
  font-weight: 900;
}

.module-access-guide-card [id^="moduleAccessGuide"] {
  color: #475467 !important;
  line-height: 1.45;
}

.module-access-guide-body {
  color: #344054;
  display: none;
  font-size: 13px;
  padding: 0 12px 12px;
}

.module-access-guide-copy {
  margin: 0 0 12px;
}

.module-access-guide-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.module-access-guide-card [id^="moduleAccessGuide"] > div {
  gap: 8px !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
}

.module-access-guide-item {
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 10px 12px;
}

.module-access-guide-card [id^="moduleAccessGuide"] > div > div {
  background: #fbfdff;
  border-color: #e4e7ec !important;
  box-shadow: none;
  color: #475467;
  font-size: 12px;
  line-height: 1.4;
}

.module-access-guide-card [id^="moduleAccessGuide"] > div > div > div:first-child {
  color: #101828;
  font-size: 12px;
  font-weight: 900 !important;
}

.module-access-guide-item-title {
  font-weight: 700;
  margin-bottom: 6px;
}

.module-access-guide-toggle {
  min-width: 58px;
}

.module-access-add-card,
.module-access-filter-form,
.module-access-table-toolbar {
  margin-bottom: 0 !important;
}

.module-access-add-card {
  background:
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  border-color: #dbe5ef !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.055) !important;
  margin-bottom: 14px;
  padding: 14px !important;
}

.module-access-section-title {
  margin-bottom: 8px;
}

.module-access-employee-field {
  min-width: 120px;
}

.module-access-add-form {
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: repeat(5, minmax(150px, 1fr)) repeat(4, auto) auto;
  align-items: end !important;
}

.module-access-add-form label:has(input[type="checkbox"]) {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #344054 !important;
  display: inline-flex;
  gap: 6px;
  justify-content: center;
  min-height: 34px;
  padding: 6px 10px;
  white-space: nowrap;
}

.module-access-filter-form > div:first-of-type {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  width: 100%;
}

.module-access-filter-form .button-primary,
.module-access-filter-form .button-small {
  align-self: end !important;
}

.module-access-table-toolbar {
  background: #fbfdff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 10px 12px;
}

.module-access-table-toolbar form {
  flex-wrap: wrap;
}

.module-access-table-wrap {
  max-height: 680px;
}

.module-access-table {
  min-width: 1180px;
}

.module-access-table td {
  vertical-align: middle;
}

.module-access-table td:nth-child(2) strong {
  color: #101828;
}

.module-access-table td:nth-child(4) form {
  display: grid !important;
  gap: 6px !important;
  grid-template-columns: minmax(120px, 1fr) auto;
}

.module-access-account-role-form {
  align-items: center;
  display: flex;
  gap: 6px;
}

.module-access-employee-boundary {
  border-top: 2px solid #d0d5dd;
}

.module-access-table select {
  max-width: 210px;
  min-height: 32px !important;
}

.module-access-table input[type="checkbox"],
.module-access-add-form input[type="checkbox"] {
  accent-color: var(--app-action-primary);
}

.module-access-table td:last-child,
.module-access-actions-cell {
  white-space: nowrap;
}

@media (max-width: 1280px) {
  .module-access-page .module-access-guide {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .module-access-add-form {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }
}

@media (max-width: 760px) {
  .module-access-page .module-access-guide,
  .module-access-add-form {
    grid-template-columns: 1fr !important;
  }

  .module-access-add-form label:has(input[type="checkbox"]) {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  body:has(.admin-access-tabs) .app-back-nav {
    padding: 0 14px;
  }

  body:has(.admin-access-tabs) > .panel {
    width: calc(100% - 28px);
  }

  body:has(.admin-access-tabs) .admin-access-tabs {
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  }
}

.pm-section-header,
.spotlight-stream-header,
.spotlight-dashboard-header,
.checkin-card .pm-section-header,
.recognition-panel .pm-section-header {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  justify-content: space-between;
}

.spotlight-stream-header {
  align-items: flex-start;
  background: transparent;
  border: 0;
  box-shadow: none;
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr;
  justify-content: stretch;
  margin-bottom: 14px;
  padding: 0;
}

.spotlight-stream-header h3 {
  font-size: 22px;
  margin: 0;
}

.spotlight-stream-header .spotlight-search {
  align-items: end;
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  padding: 12px;
  width: 100%;
}

@media (max-width: 900px) {
  .spotlight-stream-header .spotlight-search {
    grid-template-columns: 1fr;
  }
}

.pm-detail-back-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-start;
  margin: 0 0 14px;
  width: 100%;
}

.app-back-nav {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
  padding: 0 18px;
}

.app-back-nav--bottom {
  margin: 18px 0 8px;
}

.app-back-nav__link {
  text-decoration: none;
}

/* Left arrow + "Back to ?" (shared by back_nav macro and back_link) */
.app-back-link {
  align-items: center;
  color: #2563eb;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  gap: 0.4em;
  line-height: 1.2;
  text-decoration: none;
  width: max-content;
}

.app-back-link:hover {
  color: #1d4ed8;
  text-decoration: none;
}

.app-back-link__arrow {
  color: inherit;
  flex-shrink: 0;
  margin-top: 1px;
  opacity: 0.88;
  transition: transform 0.15s ease, opacity 0.15s ease;
}

.app-back-link:hover .app-back-link__arrow {
  opacity: 1;
  transform: translateX(-1px);
}

.app-back-link__text {
  white-space: nowrap;
}

.candidate-audit-page > .app-back-link,
.tn-vault > .app-back-link,
.promotion-nomination-packet-page > .app-back-link {
  margin: 0 0 14px;
}

.login-panel__links .app-back-link {
  font-weight: 600;
  gap: 0.45em;
}

.login-panel__links .app-back-link:hover {
  text-decoration: underline;
}

.login-panel__links .app-back-link__arrow {
  opacity: 0.9;
}

@media (max-width: 640px) {
  .admin-access-tab,
  .settings-section-nav__pill,
  .spotlight-tabs a,
  .spotlight-dashboard-scopes a,
  .pm-tabs a,
  .pm-manage-view-tabs a,
  .pm-segmented-tabs a,
  .pm-segmented-tabs button,
  .checkin-tabbar button {
    flex: 1 1 auto;
  }
}

.reporting-page {
  display: grid;
  gap: 16px;
  margin: 0 0 32px;
  padding: 0;
  width: 100%;
}

.reporting-page:not(.app-page-shell) {
  padding: 0 18px;
}

.reporting-hero {
  align-items: end;
  background: transparent;
  border: 0;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin: 0;
  padding: 0;
}

.reporting-hero .app-page-title,
.reporting-hero h1 {
  color: var(--app-page-title-color, #101828);
  font-size: var(--app-page-title-size, 22px);
  font-weight: var(--app-page-title-weight, 700);
  line-height: var(--app-page-title-line-height, 1.2);
  margin: 0;
}

.reporting-eyebrow {
  color: var(--app-muted, #667085);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin: 0 0 4px;
  text-transform: uppercase;
}

.reporting-subtitle {
  color: var(--app-muted, #667085);
  font-size: 14px;
  line-height: 1.45;
  margin: 6px 0 0;
  max-width: 720px;
}

.reporting-hero__status {
  background: transparent;
  border: 0;
  display: grid;
  gap: 2px;
  margin: 0;
  min-width: 0;
  padding: 0;
  text-align: right;
}

.reporting-hero__status span,
.reporting-kpi span,
.reporting-stat-grid span,
.reporting-field span,
.reporting-search span {
  color: var(--app-muted);
  display: block;
  font-size: 12px;
  font-weight: 700;
}

.reporting-hero__status strong {
  color: var(--app-page-title-color, #101828);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
}

.reporting-panel,
.reporting-empty {
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  box-shadow: var(--app-shadow-card);
  padding: 16px;
}

.reporting-filter-form {
  align-items: end;
  display: grid;
  grid-template-columns: minmax(280px, 2fr) minmax(240px, 1fr) auto auto;
  gap: 12px;
  width: 100%;
}

.reporting-filter-form--cycle {
  grid-template-columns: minmax(220px, 1.4fr) minmax(200px, 1fr) auto auto;
}

.reporting-page--cycle .reporting-run-button.button-primary {
  background: var(--app-action-primary, #3a7bff);
  border: 1px solid var(--app-action-primary-border, #3a7bff);
  border-radius: var(--app-radius-control, 8px);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  min-height: var(--app-control-height, 38px);
  padding: 0 14px;
}

.reporting-empty-state {
  margin: 0;
  padding: 28px 16px;
  text-align: center;
}

.reporting-empty-state h3 {
  color: var(--app-page-title-color, #101828);
  font-size: 16px;
  font-weight: 800;
  margin: 0 0 6px;
}

.reporting-empty-state p {
  color: var(--app-muted, #667085);
  font-size: 14px;
  margin: 0;
}

.reporting-toolbar-panel {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  justify-content: space-between;
  padding: 0;
}

.reporting-toolbar-panel__copy h3 {
  color: var(--app-page-title-color, #101828);
  font-size: 14px;
  font-weight: 800;
  margin: 0;
}

.reporting-toolbar-panel__copy p {
  color: var(--app-muted, #667085);
  font-size: 13px;
  margin: 4px 0 0;
}

.reporting-notice {
  align-items: center;
  background: #fff7ed;
  border: 1px solid #fdba74;
  border-radius: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  justify-content: space-between;
  padding: 12px 14px;
}

.reporting-notice h3 {
  color: #9a3412;
  font-size: 14px;
  font-weight: 800;
  margin: 0;
}

.reporting-notice p {
  color: #7a2e0e;
  font-size: 13px;
  margin: 4px 0 0;
}

.reporting-field,
.reporting-search {
  display: grid;
  gap: 6px;
  min-width: 220px;
}

.reporting-field--cycle {
  min-width: 0;
}

.reporting-field select,
.reporting-search input {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-radius: var(--app-radius-control);
  color: var(--app-text);
  min-height: 38px;
  padding: 8px 10px;
  width: 100%;
}

.reporting-field select:focus,
.reporting-search input:focus {
  border-color: var(--app-action-primary);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  outline: none;
}

.reporting-check {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-radius: 999px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  gap: 7px;
  min-height: 38px;
  padding: 8px 12px;
}

.reporting-check input {
  margin: 0;
}
#showExpectedCounts {
  --app-checkbox-radius: 4px;
  --app-checkbox-checked-bg: #3a7bff;
  --app-checkbox-checked-border: #3a7bff;
  --app-checkbox-mark: #fff;
  border-radius: 4px;
}

.reporting-run-button,
.reporting-action {
  align-items: center;
  border-radius: 7px;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  justify-content: center;
  min-height: 38px;
  padding: 8px 13px;
  text-decoration: none;
}

.reporting-run-button {
  background: var(--app-action-primary);
  border: 1px solid var(--app-action-primary-border);
  color: #fff;
}

.reporting-run-button:hover {
  background: var(--app-action-primary-hover);
}

.reporting-summary-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.reporting-kpi {
  background: #fff;
  border: 1px solid var(--app-border);
  border-radius: 10px;
  box-shadow: none;
  display: grid;
  gap: 6px;
  min-height: 0;
  padding: 12px 14px;
}

.reporting-kpi strong {
  color: var(--app-page-title-color, #101828);
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
}

.reporting-actions,
.reporting-section-header {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.reporting-actions h3,
.reporting-section-header h3 {
  margin: 0;
}

.reporting-actions p,
.reporting-section-header p {
  color: var(--app-muted);
  font-size: 13px;
  margin: 4px 0 0;
}

.reporting-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.reporting-action {
  background: #fff;
  border: 1px solid #cfd8e3;
  color: #344054;
}

.reporting-action:hover {
  background: #f8fafc;
  border-color: #b8c4d3;
}

.reporting-test-pill {
  background: #eff4ff;
  border: 1px solid #bfd3f6;
  border-radius: 999px;
  color: var(--keshero-teal);
  font-size: 12px;
  font-weight: 800;
  padding: 7px 10px;
  text-align: center;
}

.reporting-breakout-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 14px;
}

.reporting-breakout-card {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 12px;
}

.reporting-breakout-card h4 {
  color: var(--app-heading);
  font-size: 13px;
  margin: 0 0 9px;
}

.reporting-breakout-card p {
  color: var(--app-muted);
  font-size: 13px;
  margin: 0;
}

.reporting-breakout-row {
  align-items: center;
  border-top: 1px solid #e4e7ec;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding: 8px 0;
}

.reporting-breakout-row:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.reporting-breakout-row:last-child {
  padding-bottom: 0;
}

.reporting-breakout-row span {
  color: #344054;
  font-size: 13px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.reporting-breakout-row strong {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 999px;
  color: var(--app-heading);
  flex: 0 0 auto;
  font-size: 12px;
  min-width: 34px;
  padding: 4px 8px;
  text-align: center;
}

.reporting-stat-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 14px;
}

.reporting-stat-grid div {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 5px;
  padding: 12px;
}

.reporting-stat-grid strong {
  color: var(--app-heading);
  font-size: 18px;
}

.reporting-warning {
  background: #fffbeb;
  border: 1px solid #f6c453;
  border-radius: 8px;
  color: #92400e;
  font-size: 13px;
  font-weight: 700;
  margin-top: 12px;
  padding: 10px 12px;
}

.reporting-table-scroll {
  border: 1px solid var(--app-table-border);
  border-radius: 8px;
  margin-top: 14px;
  max-height: 660px;
  overflow: auto;
}

.reporting-table-scroll--compact {
  max-height: 320px;
}

.reporting-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 820px;
  width: 100%;
}

.reporting-table th,
.reporting-table td {
  border-bottom: 1px solid var(--app-table-border);
  color: var(--app-text);
  font-size: 13px;
  padding: 10px 11px;
  text-align: left;
  vertical-align: top;
}

.reporting-table th {
  background: var(--app-table-header-bg);
  color: var(--app-table-header-text);
  font-size: 12px;
  font-weight: 800;
  position: sticky;
  top: 0;
  z-index: 2;
}

.reporting-table tbody tr:nth-child(even) {
  background: var(--app-table-stripe);
}

.reporting-table tbody tr:hover {
  background: var(--app-table-row-hover);
}

.reporting-table tbody tr:last-child td {
  border-bottom: 0;
}

.reporting-data-table th:first-child,
.reporting-data-table td:first-child {
  background: inherit;
  left: 0;
  min-width: 190px;
  position: sticky;
  z-index: 1;
}

.reporting-data-table th:first-child {
  background: var(--app-table-header-bg);
  z-index: 3;
}

.reporting-data-table tbody tr:nth-child(even) td:first-child {
  background: var(--app-table-stripe);
}

.reporting-data-table tbody tr:hover td:first-child {
  background: var(--app-table-row-hover);
}

.reporting-muted,
.reporting-empty p {
  color: var(--app-muted);
}

.reporting-empty,
.reporting-empty-inline {
  color: var(--app-muted);
}

.reporting-empty h3 {
  color: var(--app-heading);
  margin: 0 0 6px;
}

.reporting-empty p,
.reporting-empty-inline {
  margin: 0;
}

@media (max-width: 900px) {
  .reporting-filter-form,
  .reporting-filter-form--cycle {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .reporting-hero,
  .reporting-actions,
  .reporting-section-header,
  .reporting-toolbar-panel,
  .reporting-notice {
    align-items: stretch;
    flex-direction: column;
  }

  .reporting-hero__status {
    text-align: left;
  }

  .reporting-summary-grid,
  .reporting-breakout-grid,
  .reporting-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .reporting-action-row {
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .reporting-page {
    padding: 0 12px;
  }

  .reporting-filter-form,
  .reporting-filter-form--cycle {
    grid-template-columns: 1fr;
  }

  .reporting-field,
  .reporting-search,
  .reporting-run-button {
    width: 100%;
  }

  .reporting-summary-grid,
  .reporting-breakout-grid,
  .reporting-stat-grid {
    grid-template-columns: 1fr;
  }
}

.activity-page {
  display: grid;
  gap: 16px;
  margin: 0 0 32px;
  padding: 0 18px;
  width: 100%;
}

.activity-intro,
.activity-panel {
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  box-shadow: var(--app-shadow-card);
  padding: 18px;
}

.activity-intro h1 {
  color: var(--app-heading);
  font-size: 28px;
  margin: 0;
}

.activity-intro p,
.activity-section-header p {
  color: var(--app-muted);
  font-size: 13px;
  line-height: 1.45;
  margin: 6px 0 0;
  max-width: 880px;
}

.activity-summary-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.activity-kpi {
  background: #fff;
  border: 1px solid var(--app-border);
  border-radius: 8px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
  display: grid;
  gap: 8px;
  min-height: 92px;
  padding: 14px;
}

.activity-kpi span {
  color: var(--app-muted);
  font-size: 12px;
  font-weight: 700;
}

.activity-kpi strong {
  color: var(--app-heading);
  font-size: 26px;
  line-height: 1;
}

.activity-section-header {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.activity-section-header h3 {
  color: var(--app-heading);
  margin: 0;
}

.activity-breakout-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 14px;
}

.activity-breakout-card {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 12px;
}

.activity-breakout-card h4 {
  color: var(--app-heading);
  font-size: 13px;
  margin: 0 0 9px;
}

.activity-breakout-card p {
  color: var(--app-muted);
  font-size: 13px;
  margin: 0;
}

.activity-breakout-row {
  align-items: center;
  border-top: 1px solid #e4e7ec;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding: 8px 0;
}

.activity-breakout-row:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.activity-breakout-row:last-child {
  padding-bottom: 0;
}

.activity-breakout-row span {
  color: #344054;
  font-size: 13px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.activity-breakout-row strong {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 999px;
  color: var(--app-heading);
  flex: 0 0 auto;
  font-size: 12px;
  min-width: 34px;
  padding: 4px 8px;
  text-align: center;
}

.activity-table-wrap {
  border: 1px solid var(--app-table-border);
  border-radius: 8px;
  margin-top: 14px;
  max-height: 720px;
  overflow: auto;
}

.activity-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 960px;
  width: 100%;
}

.activity-table th,
.activity-table td {
  border-bottom: 1px solid var(--app-table-border);
  color: var(--app-text);
  font-size: 13px;
  padding: 10px 11px;
  text-align: left;
  vertical-align: top;
}

.activity-table th {
  background: var(--app-table-header-bg);
  color: var(--app-table-header-text);
  font-size: 12px;
  font-weight: 800;
  position: sticky;
  top: 0;
  z-index: 2;
}

.activity-table tbody tr:nth-child(even) {
  background: var(--app-table-stripe);
}

.activity-table tbody tr:hover {
  background: var(--app-table-row-hover);
}

.activity-table tbody tr:last-child td {
  border-bottom: 0;
}

.cycle-person-activity-panel {
  max-width: 1100px;
}

.cycle-person-activity-panel--scroll {
  max-width: 1100px;
  overflow-x: auto;
}

.cycle-person-activity-table {
  border-collapse: collapse;
  font-size: 13px;
  width: 100%;
}

.cycle-person-activity-table__head-row {
  border-bottom: 2px solid #ccc;
  text-align: left;
}

.cycle-person-activity-table__row {
  border-bottom: 1px solid #eee;
  vertical-align: top;
}

.cycle-person-activity-table__cell {
  padding: 8px 6px;
}

.cycle-person-activity-table__cell--nowrap {
  white-space: nowrap;
}

.cycle-person-activity-table__cell--muted {
  color: #444;
}

.cycle-person-activity-table__cell--break-all {
  word-break: break-all;
}

.cycle-person-activity-heading {
  margin-top: 0;
}

.cycle-person-activity-note {
  color: #444;
}

.cycle-person-activity-note--flush {
  margin: 0;
}

.activity-when {
  white-space: nowrap;
}

.activity-when strong,
.activity-target strong {
  color: var(--app-heading);
  display: block;
}

.activity-when span,
.activity-target span,
.activity-muted {
  color: var(--app-muted);
  display: block;
  font-size: 12px;
  margin-top: 2px;
}

.activity-actor {
  overflow-wrap: anywhere;
}

.activity-category {
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-radius: 999px;
  color: #344054;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  padding: 5px 9px;
  white-space: nowrap;
}

.activity-category--placement {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: var(--keshero-teal);
}

.activity-category--cycle,
.activity-category--performance-management {
  background: var(--app-success-surface);
  border-color: var(--app-success-border);
  color: var(--app-success-fg);
}

.activity-category--compensation-planning {
  background: #fdf2fa;
  border-color: #fcceee;
  color: #c11574;
}

.activity-category--user,
.activity-category--access {
  background: #fffbeb;
  border-color: #fedf89;
  color: #92400e;
}

.activity-action {
  color: var(--app-heading);
  font-weight: 800;
}

.activity-detail-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.activity-detail-list span {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #475467;
  font-size: 12px;
  padding: 5px 8px;
}

.activity-detail-list b {
  color: #344054;
}

.activity-empty {
  border: 1px dashed #cfd8e3;
  border-radius: 8px;
  color: var(--app-muted);
  margin-top: 14px;
  padding: 16px;
}

@media (max-width: 900px) {
  .activity-summary-grid,
  .activity-breakout-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .activity-page {
    padding: 0 12px;
  }

  .activity-summary-grid,
  .activity-breakout-grid {
    grid-template-columns: 1fr;
  }
}

/* Shared dropdown indicators: keep native selects and custom dropdown buttons visually consistent. */
:root {
  --app-dropdown-arrow-size: 16px;
  --app-dropdown-arrow-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23667085' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --app-dropdown-arrow-icon-inverse: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --app-dropdown-popup-radius: 12px;
}

.grid-filter-dropdown-chevron,
.app-topnav-apps-menu__chevron,
.topbar-profile-menu__chevron,
.pm-manage-filter-dd-summary__chev,
.keshboard-drawer__multiselect-summary__chev {
  align-items: center;
  background-image: var(--app-dropdown-arrow-icon) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: var(--app-dropdown-arrow-size) var(--app-dropdown-arrow-size) !important;
  color: transparent !important;
  display: inline-flex;
  flex-shrink: 0;
  font-size: 0 !important;
  height: var(--app-dropdown-arrow-size);
  justify-content: center;
  line-height: 1;
  width: var(--app-dropdown-arrow-size);
}

.grid-filter-dropdown-chevron::before,
.app-topnav-apps-menu__chevron::before,
.topbar-profile-menu__chevron::before,
.pm-manage-filter-dd-summary__chev::before,
.keshboard-drawer__multiselect-summary__chev::before {
  content: "" !important;
  display: none !important;
}

.admin-cycle-type-menu summary::after {
  background-image: var(--app-dropdown-arrow-icon) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: var(--app-dropdown-arrow-size) var(--app-dropdown-arrow-size) !important;
  color: transparent !important;
  content: "" !important;
  display: inline-block;
  flex: 0 0 auto;
  font-size: 0 !important;
  height: var(--app-dropdown-arrow-size);
  margin-left: auto;
  width: var(--app-dropdown-arrow-size);
}

:where(.app-rounded-select__chevron,
  .grid-filter-dropdown-chevron,
  .app-topnav-apps-menu__chevron,
  .topbar-profile-menu__chevron,
  .pm-manage-filter-dd-summary__chev,
  .keshboard-drawer__multiselect-summary__chev) {
  background-image: var(--app-dropdown-arrow-icon) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: var(--app-dropdown-arrow-size) var(--app-dropdown-arrow-size) !important;
  border: 0 !important;
  color: transparent !important;
  flex: 0 0 var(--app-dropdown-arrow-size) !important;
  font-size: 0 !important;
  height: var(--app-dropdown-arrow-size) !important;
  transition: transform 0.12s ease !important;
  width: var(--app-dropdown-arrow-size) !important;
}

:where(.app-rounded-select__chevron) {
  right: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

.app-topnav .app-topnav-apps-menu__chevron {
  display: none !important;
}

.topbar-profile-menu__chevron {
  display: none !important;
}

:where(.app-rounded-select.is-open .app-rounded-select__chevron) {
  transform: translateY(-50%) rotate(180deg) !important;
}

:where(details[class*="multiselect"] > summary::after,
  .keshboard-drawer__multiselect summary::after,
  .admin-cycle-type-menu summary::after) {
  background-image: var(--app-dropdown-arrow-icon) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: var(--app-dropdown-arrow-size) var(--app-dropdown-arrow-size) !important;
  color: transparent !important;
  content: "" !important;
  height: var(--app-dropdown-arrow-size) !important;
  position: absolute !important;
  right: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: var(--app-dropdown-arrow-size) !important;
}

:where(details[class*="multiselect"][open] > summary::after,
  .keshboard-drawer__multiselect[open] summary::after,
  .admin-cycle-type-menu[open] summary::after) {
  transform: translateY(-50%) rotate(180deg) !important;
}

.app-truncated-text-tooltip {
  background: #101828;
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.22);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  max-width: min(520px, calc(100vw - 32px));
  overflow-wrap: anywhere;
  padding: 8px 10px;
  pointer-events: none;
  position: fixed;
  transform: translate(-50%, -100%);
  white-space: normal;
  z-index: 100000;
}

.app-truncated-text-tooltip::after {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #101828;
  bottom: -6px;
  content: "";
  left: 50%;
  position: absolute;
  transform: translateX(-50%);
}

/* Final compact button standard. Keep action controls sleek across pages, drawers, tables, and cards. */
.button-primary,
a.button-primary,
button.button-primary,
.button-small,
a.button-small,
button.button-small,
.button-add-small,
a.button-add-small,
button.button-add-small,
.button-danger-small,
a.button-danger-small,
button.button-danger-small,
.app-button,
button.app-button,
a.app-button {
  border-radius: 6px !important;
  box-sizing: border-box !important;
  font-size: 12px !important;
  gap: 5px !important;
  line-height: 1.05 !important;
}

/* Icon-only remove controls: keep × optically centered across the app. */
button.pm-development-plan-step-remove,
button.development-plan-step-remove,
button.pm-readiness-action-step-remove,
button[data-development-plan-step-remove],
button[data-readiness-action-step-remove],
button.button-danger-small[aria-label="Remove step"],
button.button-small[aria-label="Remove step"],
.app-icon-btn--danger,
.todo-subitem-row__icon-btn--danger {
  align-items: center !important;
  display: inline-flex !important;
  font-size: var(--app-remove-icon-font-size, 20px) !important;
  font-weight: 700 !important;
  height: 28px !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-height: 28px !important;
  min-width: 28px !important;
  padding: 0 !important;
  text-align: center !important;
}

.button-primary,
a.button-primary,
button.button-primary,
.app-button,
button.app-button,
a.app-button {
  box-sizing: border-box !important;
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 12px !important;
}

.spotlight-tabs {
  align-items: flex-end;
  border-bottom: 3px solid #b8c4d4;
  display: flex;
  gap: 4px;
  grid-column: 1 / -1;
  padding-bottom: 0;
}

.spotlight-tabs a {
  background: transparent !important;
  border: 1px solid var(--app-tab-idle-border, #cbd5e1) !important;
  border-bottom: 0 !important;
  border-radius: var(--app-tab-radius, 8px 8px 0 0) !important;
  color: var(--app-tab-idle-text, #344054) !important;
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 14px !important;
}

.spotlight-tabs a:hover {
  background: #f8fafc !important;
  color: var(--app-action-primary-hover) !important;
}

.spotlight-tabs a.is-active,
.spotlight-page .spotlight-tabs a.is-active {
  background: var(--app-action-primary) !important;
  border-color: var(--app-action-primary-border) !important;
  color: #ffffff !important;
}

/* Talent Notebook: reminder chip must not inherit folder-tab chrome. */
.tn-page .spotlight-tabs .tn-note-nav-actions {
  align-items: center;
  align-self: flex-end;
  display: flex;
  gap: 10px;
  margin: 0 0 8px auto;
  padding-left: 8px;
}

.tn-page .spotlight-tabs a.tn-upcoming-reminders {
  align-items: center !important;
  background: var(--app-surface-muted, #f2f4f7) !important;
  border: 1px solid var(--app-border, #d0d5dd) !important;
  border-radius: 999px !important;
  color: var(--app-label-color, #344054) !important;
  display: inline-flex !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  gap: 6px;
  min-height: 28px !important;
  padding: 0 12px !important;
  text-decoration: none !important;
}

.tn-page .spotlight-tabs a.tn-upcoming-reminders:hover {
  background: #eef2f6 !important;
  color: var(--app-label-color, #344054) !important;
}

.tn-page .spotlight-tabs .tn-note-launch.button-add-small {
  margin-bottom: 0;
}

.spotlight-compose .spotlight-form__actions .button-primary[type="submit"] {
  justify-self: start;
}

.button-small,
a.button-small,
button.button-small,
.button-add-small,
a.button-add-small,
button.button-add-small,
.button-danger-small,
a.button-danger-small,
button.button-danger-small,
.button-delete-small,
a.button-delete-small,
button.button-delete-small,
.button-save-small,
a.button-save-small,
button.button-save-small,
.button-archive,
a.button-archive,
button.button-archive {
  box-sizing: border-box !important;
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 12px !important;
}

/* Section Reset matches the change-count chip beside it (same height + radius). */
.settings-section-title-row .settings-section-reset.button-small,
.settings-section-title-row button.settings-section-reset.button-small {
  border-radius: var(--app-field-radius, 6px) !important;
  font-size: 12px !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 10px !important;
}

/* Icon-only + add controls: square (match width), not the taller text-button height. */
button.spotlight-reaction-add,
button.spotlight-reaction-add.button-add-small,
button.button-add-small.button-icon-only,
a.button-add-small.button-icon-only {
  align-items: center !important;
  aspect-ratio: 1 !important;
  box-sizing: border-box !important;
  display: inline-grid !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  height: 32px !important;
  justify-content: center !important;
  line-height: 1 !important;
  max-height: 32px !important;
  max-width: 32px !important;
  min-height: 32px !important;
  min-width: 32px !important;
  /* Optical center: bold + glyphs sit slightly left; slight lift for visual balance. */
  padding: 0 0 1px 1px !important;
  place-items: center !important;
  text-align: center !important;
  width: 32px !important;
}

button.spotlight-reaction-add:hover,
button.spotlight-reaction-add:focus,
button.spotlight-reaction-add:focus-visible,
button.button-add-small.button-icon-only:hover,
button.button-add-small.button-icon-only:focus,
button.button-add-small.button-icon-only:focus-visible,
a.button-add-small.button-icon-only:hover,
a.button-add-small.button-icon-only:focus,
a.button-add-small.button-icon-only:focus-visible {
  transform: none !important;
}

/* Keep Cancel / + Add Step sized with Save in development-plan editors. */
.pm-development-plan-detail-editor .pm-development-plan-editor-actions .button-small,
.pm-development-plan-detail-editor .pm-development-plan-editor-actions .button-primary,
.pm-development-plan-detail-editor .pm-development-plan-steps-editor__head .button-add-small,
.pm-development-plan-create-panel .pm-development-plan-editor-actions .button-small,
.pm-development-plan-create-panel .pm-development-plan-editor-actions .button-add-small,
.pm-development-plan-create-panel .pm-development-plan-editor-actions .button-primary,
.pm-development-plan-create-panel .pm-development-plan-steps-editor__head .button-add-small,
.pm-development-plan-compact-form .pm-development-plan-editor-actions .button-small,
.pm-development-plan-compact-form .pm-development-plan-editor-actions .button-primary,
.pm-development-plan-compact-form .pm-development-plan-editor-actions .button-add-small,
.pm-development-plan-compact-form .pm-development-plan-steps-editor__head .button-add-small {
  box-sizing: border-box !important;
  font-size: 12px !important;
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 12px !important;
}

.button-neutral-action,
a.button-neutral-action,
button.button-neutral-action,
.button-small.button-neutral-action,
a.button-small.button-neutral-action,
button.button-small.button-neutral-action,
.button-primary.button-neutral-action,
a.button-primary.button-neutral-action,
button.button-primary.button-neutral-action,
.button-add-small.button-neutral-action,
a.button-add-small.button-neutral-action,
button.button-add-small.button-neutral-action,
.app-button.button-neutral-action,
a.app-button.button-neutral-action,
button.app-button.button-neutral-action,
.grid-filter-clear.button-neutral-action {
  background: #e4e7ec !important;
  border-color: #98a2b3 !important;
  box-shadow: 0 1px 0 rgba(16, 24, 40, 0.04) !important;
  color: #1d2939 !important;
}

.button-neutral-action:hover,
a.button-neutral-action:hover,
button.button-neutral-action:hover,
.button-small.button-neutral-action:hover,
a.button-small.button-neutral-action:hover,
button.button-small.button-neutral-action:hover,
.button-primary.button-neutral-action:hover,
a.button-primary.button-neutral-action:hover,
button.button-primary.button-neutral-action:hover,
.button-add-small.button-neutral-action:hover,
a.button-add-small.button-neutral-action:hover,
button.button-add-small.button-neutral-action:hover,
.app-button.button-neutral-action:hover,
a.app-button.button-neutral-action:hover,
button.app-button.button-neutral-action:hover,
.grid-filter-clear.button-neutral-action:hover,
.button-neutral-action:focus-visible,
a.button-neutral-action:focus-visible,
button.button-neutral-action:focus-visible,
.grid-filter-clear.button-neutral-action:focus-visible {
  background: #d0d5dd !important;
  border-color: #667085 !important;
  color: #101828 !important;
}

.button-danger-small,
a.button-danger-small,
button.button-danger-small {
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 12px !important;
}

.button-save-small,
a.button-save-small,
button.button-save-small,
.button-delete-small,
a.button-delete-small,
button.button-delete-small {
  align-items: center !important;
  border-radius: 6px !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  display: inline-flex !important;
  font-size: max(11px, calc(var(--app-body-size) - 1px)) !important;
  font-weight: 800 !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 12px !important;
  text-decoration: none !important;
}

.button-save-small,
a.button-save-small,
button.button-save-small {
  background: #e0f2fe !important;
  border: 1px solid #38bdf8 !important;
  color: #075985 !important;
  box-shadow: none !important;
}

.button-save-small:hover,
.button-save-small:focus-visible,
a.button-save-small:hover,
a.button-save-small:focus-visible,
button.button-save-small:hover,
button.button-save-small:focus-visible {
  background: #bae6fd !important;
  border-color: #0284c7 !important;
  color: #0c4a6e !important;
}

.button-delete-small,
a.button-delete-small,
button.button-delete-small {
  background: var(--app-delete-surface) !important;
  border: 1px solid var(--keshero-light-burgundy) !important;
  color: var(--app-action-delete) !important;
  box-shadow: none !important;
}

.button-delete-small:hover,
.button-delete-small:focus-visible,
a.button-delete-small:hover,
a.button-delete-small:focus-visible,
button.button-delete-small:hover,
button.button-delete-small:focus-visible {
  background: #f3e4ea !important;
  border-color: var(--app-action-delete) !important;
  color: var(--app-action-delete-hover) !important;
}

[data-survey-lock-target] {
  transition: opacity 160ms ease, filter 160ms ease, background-color 160ms ease;
}

.survey-settings-locked {
  background-color: #f2f4f7 !important;
  filter: grayscale(0.75);
  opacity: 0.58;
}

section.survey-settings-locked {
  position: relative;
}

section.survey-settings-locked::after {
  background: #667085;
  border-radius: 999px;
  color: #fff;
  content: "Disabled";
  font-size: 11px;
  font-weight: 800;
  padding: 4px 8px;
  position: absolute;
  right: 12px;
  top: 12px;
}

.survey-settings-locked input,
.survey-settings-locked select,
.survey-settings-locked textarea,
.survey-settings-locked button {
  cursor: not-allowed !important;
}

.survey-settings-locked .settings-survey-enable-option,
.survey-settings-locked .settings-survey-enable-option input {
  cursor: pointer !important;
}

.shared-note-icon-button,
button.shared-note-icon-button {
  align-items: center;
  display: inline-flex;
  height: 28px !important;
  justify-content: center;
  min-height: 28px !important;
  padding: 0 !important;
  width: 30px;
}

.shared-note-icon-button svg {
  display: block;
  height: 16px;
  pointer-events: none;
  width: 16px;
}

.admin-access-tab,
.settings-section-nav__pill,
.spotlight-tabs a,
.spotlight-dashboard-scopes a,
.pm-tabs a,
.pm-manage-view-tabs a,
.pm-segmented-tabs a,
.pm-segmented-tabs button,
.checkin-tabbar button,
.checkin-hub-tab,
.development-plan-tab,
.er-tab,
.succession-tab,
.comp-plan-tab,
.keshboard-drawer__view-tabs button,
.keshboard-drawer__board-picker button,
.keshboard-drawer__team-view button,
.org-map-view-toggle--tabs .button-small {
  min-height: var(--app-control-height, 38px) !important;
  padding: 0 14px !important;
}

/* App-wide container title sizing: card/panel/section headings (not page titles).
   Keep real specificity (avoid :where) so these beat theme h2/h3 !important scales. */
.app-container-title,
.panel > h2,
.panel > h3,
.panel > h4,
.pm-card > h2,
.pm-card > h3,
.pm-card > h4,
.app-card > h2,
.app-card > h3,
.app-card > h4,
.home-table-wrap > h2,
.home-table-wrap > h3,
.spotlight-dashboard-panel > h2,
.spotlight-dashboard-panel > h3,
.spotlight-compose > h2,
.spotlight-compose > h3,
.spotlight-stream > h2,
.spotlight-stream > h3,
.inbox-panel > h2,
.inbox-panel > h3,
.surveys-panel > h2,
.surveys-panel > h3,
.surveys-sentiment-card > h2,
.surveys-sentiment-card > h3,
.succession-edit-section > h2,
.succession-edit-section > h3,
.comp-config-section > h2,
.comp-config-section > h3,
.perf-da-card > h2,
.perf-da-card > h3,
.recognition-panel > h2,
.recognition-panel > h3,
.checkin-card > h2,
.checkin-card > h3,
.settings-general-card > h2,
.settings-general-card > h3,
.reporting-breakout-card > h2,
.reporting-breakout-card > h3,
.activity-breakout-card > h2,
.activity-breakout-card > h3,
.recruiting-settings-card > h2,
.skills-gov-card > h2,
.admin-section-head h3,
.admin-cheat-sheet__head h3,
.user-access-card__head h4,
.user-access-help-guide__head h4,
.settings-general-panel__head h4,
.settings-performance-review-panel__head h4,
.settings-groupings-panel__head h4,
.settings-org-chart-panel__head h4,
.settings-surveys-panel__head h4,
.settings-survey-section-head h3,
.settings-checkin-panel__head h4,
.settings-spotlight-panel__head h4,
.settings-calendar-panel__head h4,
.settings-performance-progress-panel__head h4,
.settings-performance-rating-panel__head h4,
.settings-compensation-planning-panel__head h4,
.settings-talent-planning-panel__head h4,
.settings-pip-panel__head h4,
.settings-employee-relations-panel__head h4,
.employee-profile-panel__head h4,
.dl-panel > h2,
.dl-panel > h3,
.dl-panel__head h2,
.dl-panel__head h3,
.pm-section-header h2,
.pm-section-header h3,
.pm-section-header h4,
.pm-form-section > h3,
.pm-form-section > h4,
.spotlight-panel-heading h2,
.spotlight-panel-heading h3,
.spotlight-panel-heading h4,
.home-pm-detail-card__header h2,
.home-pm-detail-card__header h3,
.home-pm-detail-card__header h4,
.reporting-section-header h2,
.reporting-section-header h3,
.activity-section-header h2,
.activity-section-header h3,
.checkin-hub-section-head h2,
.checkin-hub-section-head h3,
.keshboard-drawer__column-head h2,
.keshboard-drawer__column-head h3,
.keshboard-drawer__detail-section h2,
.keshboard-drawer__detail-section h3,
.progress-summary-drawer__column-title h2,
.progress-summary-drawer__column-title h3,
.pm-calendar-agenda__header h2,
.pm-calendar-agenda__header h3,
.pm-card-section-summary__title {
  color: var(--app-container-title-color, #101828);
  font-size: var(--app-container-title-size, 17px) !important;
  font-weight: var(--app-container-title-weight, 700);
  line-height: var(--app-container-title-line-height, 1.25);
}

/* Collapsible card-section row titles (Filters, Extra Stages, Configure board, etc.). */
.pm-card-section-summary__title {
  color: var(--app-container-title-color, #101828);
  font-weight: 800;
}

a,
button,
summary,
label:has(input[type="checkbox"]),
label:has(input[type="radio"]),
select,
input[type="button"],
input[type="checkbox"],
input[type="color"],
input[type="file"],
input[type="radio"],
input[type="range"],
input[type="reset"],
input[type="submit"],
[role="button"],
[role="link"],
[role="menuitem"],
[role="option"],
[role="tab"],
[data-indirect-rollup-role-option],
[data-rollup-row-toggle],
.button,
.button-primary,
.button-small {
  cursor: var(--keshero-cursor-pointer) !important;
}

input:not([type]),
input[type="date"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
textarea,
[contenteditable="true"] {
  cursor: text !important;
}

[disabled],
[aria-disabled="true"],
.is-disabled {
  cursor: not-allowed !important;
}

/* App-wide search clear control: destructive/clear affordances use the shared red X. */
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none !important;
  appearance: none !important;
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 4l8 8M12 4l-8 8' fill='none' stroke='%23d92d20' stroke-linecap='round' stroke-width='2'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 14px 14px;
  border-radius: 5px;
  cursor: pointer !important;
  height: 20px;
  margin-left: 8px;
  opacity: .9;
  transition: background-color .15s ease, opacity .15s ease;
  width: 20px;
}

input[type="search"]::-webkit-search-cancel-button:hover {
  background-color: #fff1f0;
  opacity: 1;
}
/* Keshero Field System: shared inputs, selects, dates, search, chips, filters, and empty states.
   Token defaults live in design_system.css; this block keeps component rules. */
:root {
  /* Fallbacks only ? design_system.css is the source of truth when loaded. */
  --ks-field-bg: var(--app-field-bg, #ffffff);
  --ks-field-border: var(--app-field-border, #d0d5dd);
  --ks-field-text: var(--app-field-text, #101828);
  --ks-field-placeholder: var(--app-field-placeholder, #667085);
  --ks-field-focus: var(--app-field-focus, #1d9bf0);
  --ks-field-error: #d92d20;
  --ks-field-disabled-bg: #f2f4f7;
  --ks-field-disabled-text: #98a2b3;
  --ks-field-dropdown-bg: var(--app-field-bg, #ffffff);
  --ks-field-dropdown-hover: #f0f9ff;
  --ks-field-selected-bg: #e8f4ff;
  --ks-field-chip-bg: #eff6ff;
  --ks-field-chip-text: #1849a9;
  --ks-field-radius: var(--app-field-radius, 8px);
}

html[data-keshero-theme="dark"] {
  --ks-field-bg: #111827;
  --ks-field-border: #344054;
  --ks-field-text: #f8fafc;
  --ks-field-placeholder: #98a2b3;
  --ks-field-focus: #38bdf8;
  --ks-field-error: #f97066;
  --ks-field-disabled-bg: #1f2937;
  --ks-field-disabled-text: #667085;
  --ks-field-dropdown-bg: #101828;
  --ks-field-dropdown-hover: #1f2937;
  --ks-field-selected-bg: #0b4a6f;
  --ks-field-chip-bg: #0b4a6f;
  --ks-field-chip-text: #e0f2fe;
}

.ks-field,
.ks-search-field {
  align-content: start;
  align-self: start;
  color: var(--ks-field-text);
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ks-field__label {
  color: var(--app-label-color, var(--ks-field-text));
  font-size: var(--app-label-font-size, 12px);
  font-weight: var(--app-label-font-weight, 800);
  letter-spacing: normal;
  line-height: 1.3;
  text-transform: none;
}

.pm-label-text,
.pm-manage-filter-dd-label {
  color: var(--app-label-color, #344054);
  font-family: inherit;
  font-size: var(--app-label-font-size, 12px);
  font-weight: var(--app-label-font-weight, 800);
  letter-spacing: normal;
  text-transform: none;
}

.ks-field__required {
  color: var(--ks-field-error);
  margin-left: 3px;
}

.ks-field__control,
.ks-search-field__control input {
  background: var(--ks-field-bg);
  border: 1px solid var(--ks-field-border);
  border-radius: var(--ks-field-radius);
  color: var(--ks-field-text);
  font: inherit;
  font-size: var(--app-control-font-size, 13px);
  font-weight: var(--app-control-font-weight, 400);
  min-height: var(--app-control-height, 38px);
  outline: none;
  padding: 8px 10px;
  width: 100%;
}

.ks-field__control::placeholder,
.ks-search-field__control input::placeholder {
  color: var(--ks-field-placeholder);
}

.ks-field__control:focus,
.ks-search-field__control:focus-within {
  border-color: var(--ks-field-focus);
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.16);
}

.ks-field__control:disabled {
  background: var(--ks-field-disabled-bg);
  color: var(--ks-field-disabled-text);
  cursor: not-allowed;
}

.ks-field--error .ks-field__control,
.ks-field__control[aria-invalid="true"] {
  border-color: var(--ks-field-error);
}

.ks-field__message {
  color: var(--ks-field-placeholder);
  font-size: 12px;
  line-height: 1.4;
}

.ks-field__message--error {
  color: var(--ks-field-error);
  font-weight: 700;
}

.ks-field__select-wrap,
.ks-field__date-wrap,
.ks-search-field__control {
  align-items: center;
  display: flex;
  min-width: 0;
  position: relative;
}

.ks-field__date-icon,
.ks-search-field__icon {
  color: var(--ks-field-placeholder);
  font-size: 0;
  pointer-events: none;
  position: absolute;
}

.ks-field__date-icon {
  right: 10px;
}

.ks-field__date-icon::before {
  content: "Cal";
  font-size: 10px;
  font-weight: 900;
}

.ks-search-field--full {
  width: 100%;
}

.ks-search-field__icon {
  height: 14px;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 14px;
}

.ks-search-field__icon::before {
  border: 1.5px solid currentColor;
  border-radius: 50%;
  box-sizing: border-box;
  content: "";
  height: 10px;
  left: 0;
  position: absolute;
  top: 0;
  width: 10px;
}

.ks-search-field__icon::after {
  background: currentColor;
  border-radius: 999px;
  bottom: 1px;
  content: "";
  height: 1.5px;
  position: absolute;
  right: 0;
  transform: rotate(45deg);
  transform-origin: center;
  width: 6px;
}

.ks-search-field__control input {
  padding-left: 32px;
  padding-right: 10px;
}

.ks-chip__remove {
  align-items: center;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 900;
  justify-content: center;
}

.ks-chip,
.ks-filter-chip {
  align-items: center;
  background: var(--ks-field-chip-bg);
  border: 1px solid color-mix(in srgb, var(--ks-field-chip-bg) 70%, var(--ks-field-border));
  border-radius: 999px;
  color: var(--ks-field-chip-text);
  display: inline-flex;
  gap: 6px;
  max-width: 100%;
  min-height: 28px;
  padding: 4px 8px;
}

.ks-chip-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 0;
}

.ks-chip__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ks-chip__remove {
  border-radius: 999px;
  height: 20px;
  width: 20px;
}

.ks-chip__remove:hover,
.ks-chip__remove:focus-visible {
  background: rgba(29, 155, 240, 0.14);
  outline: 2px solid transparent;
}

.ks-empty-state {
  background: var(--ks-field-disabled-bg);
  border: 1px dashed var(--ks-field-border);
  border-radius: var(--ks-field-radius);
  color: var(--ks-field-placeholder);
  font-size: 13px;
  padding: 14px;
  text-align: center;
}

.ks-dropdown {
  position: relative;
  width: 100%;
}

.ks-dropdown.is-disabled {
  pointer-events: none;
}

.ks-dropdown__trigger {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  padding-right: 34px;
  position: relative;
  text-align: left;
  width: 100%;
}

.ks-dropdown__trigger::after {
  background-image: var(--app-dropdown-arrow-icon);
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--app-dropdown-arrow-size) var(--app-dropdown-arrow-size);
  content: "";
  flex: 0 0 var(--app-dropdown-arrow-size);
  height: var(--app-dropdown-arrow-size);
  pointer-events: none;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: var(--app-dropdown-arrow-size);
}

.ks-dropdown.is-open > .ks-dropdown__trigger::after {
  transform: translateY(-50%) rotate(180deg);
}

.ks-dropdown [data-ks-dropdown-label] {
  flex: 1 1 auto;
  line-height: 1.4;
  min-width: 0;
  overflow: hidden;
  padding: 2px 0 3px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ks-dropdown.is-placeholder > .ks-dropdown__trigger,
.ks-dropdown.is-placeholder [data-ks-dropdown-label] {
  color: var(--ks-field-placeholder, #667085);
}

.ks-dropdown__menu {
  background: var(--ks-field-dropdown-bg);
  border: 1px solid var(--ks-field-border);
  border-radius: var(--app-dropdown-popup-radius, 12px);
  box-shadow: 0 18px 38px rgba(16, 24, 40, 0.16);
  display: flex;
  flex-direction: column;
  gap: 2px;
  left: 0;
  max-height: min(70vh, 360px);
  overflow: auto;
  padding: 6px;
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  width: max(100%, 260px);
  z-index: 120;
}

.ks-dropdown__menu.is-floating {
  right: auto;
  z-index: 10050;
}

.ks-dropdown__menu[hidden] {
  display: none !important;
}

.ks-dropdown__menu [data-ks-dropdown-search] {
  margin-bottom: 2px;
  min-height: 34px;
  width: 100%;
}

.ks-dropdown__option {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  box-sizing: border-box;
  color: var(--ks-field-text);
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: 13px;
  font-weight: 400;
  gap: 8px;
  line-height: 1.25;
  min-height: 34px;
  padding: 8px 10px;
  text-align: left;
  width: 100%;
}

.ks-dropdown__option.is-filter-hidden,
.ks-dropdown__option[hidden] {
  display: none !important;
}

.ks-dropdown__option:hover,
.ks-dropdown__option:focus,
.ks-dropdown__option:focus-within,
.ks-dropdown__option.is-active {
  background: var(--ks-field-dropdown-hover);
  outline: none;
}

.ks-dropdown__option[aria-selected="true"],
.ks-dropdown__option:has(input[type="checkbox"]:checked),
.ks-dropdown__option:has(input[type="checkbox"][data-indeterminate="true"]) {
  background: var(--ks-field-selected-bg);
  font-weight: 400;
}

/* When All is fully selected, keep rows quiet — only checkmarks convey state. */
.ks-dropdown:has([data-value="all"] > input[type="checkbox"]:checked:not(:indeterminate):not([data-indeterminate="true"])) .ks-dropdown__option:not([data-value="all"]) {
  background: transparent;
}

.ks-dropdown:has([data-value="all"] > input[type="checkbox"]:checked:not(:indeterminate):not([data-indeterminate="true"])) .ks-dropdown__option:not([data-value="all"]):hover,
.ks-dropdown:has([data-value="all"] > input[type="checkbox"]:checked:not(:indeterminate):not([data-indeterminate="true"])) .ks-dropdown__option:not([data-value="all"]):focus,
.ks-dropdown:has([data-value="all"] > input[type="checkbox"]:checked:not(:indeterminate):not([data-indeterminate="true"])) .ks-dropdown__option:not([data-value="all"]):focus-within {
  background: var(--ks-field-dropdown-hover);
}

.ks-dropdown__option[data-value="all"] {
  border-bottom: var(--app-dropdown-select-all-divider-width, 2px) solid var(--app-dropdown-select-all-divider-color, var(--ks-field-border));
  border-radius: 6px 6px 0 0;
  margin-bottom: 3px;
}

.ks-dropdown__option input[type="checkbox"] {
  /* Color/radius: --app-dropdown-option-checkbox-* in design_system.css (blue rounded square). */
  flex: 0 0 auto;
  height: var(--app-checkbox-size, 16px);
  margin: 0;
  min-height: 0;
  width: var(--app-checkbox-size, 16px);
}

.ks-dropdown .ks-empty-state {
  margin-top: 2px;
  padding: 8px 10px;
}

input[type="date"]:not(.keshero-date-format-native),
input[type="datetime-local"]:not(.keshero-date-format-native) {
  background-color: #fff;
  border: 1px solid #cfd8e3 !important;
  border-radius: 8px !important;
  box-sizing: border-box;
  color: var(--app-text);
  min-height: var(--app-control-height);
  padding-right: 0 !important;
}

input[type="date"]:not(.keshero-date-format-native):focus,
input[type="datetime-local"]:not(.keshero-date-format-native):focus {
  border-color: var(--app-action-primary) !important;
  box-shadow: 0 0 0 4px var(--app-focus-ring) !important;
  outline: none;
}

input[type="date"]:not(.keshero-date-format-native)::-webkit-calendar-picker-indicator,
input[type="datetime-local"]:not(.keshero-date-format-native)::-webkit-calendar-picker-indicator,
input[type="time"]:not(.keshero-date-format-native)::-webkit-calendar-picker-indicator {
  background-color: transparent;
  border-left: 1px solid #cfd8e3;
  border-radius: 6px;
  box-sizing: content-box;
  cursor: pointer;
  height: 18px;
  margin: -8px 0 -8px 8px;
  opacity: 0.72;
  padding: 10px 10px;
  transition: background-color 0.14s ease, box-shadow 0.14s ease, opacity 0.14s ease, transform 0.08s ease;
  width: 18px;
}

input[type="date"]:not(.keshero-date-format-native):focus::-webkit-calendar-picker-indicator,
input[type="datetime-local"]:not(.keshero-date-format-native):focus::-webkit-calendar-picker-indicator,
input[type="time"]:not(.keshero-date-format-native):focus::-webkit-calendar-picker-indicator {
  border-left-color: var(--app-action-primary);
  opacity: 0.9;
}

input[type="date"]:not(.keshero-date-format-native)::-webkit-calendar-picker-indicator:hover,
input[type="datetime-local"]:not(.keshero-date-format-native)::-webkit-calendar-picker-indicator:hover,
input[type="time"]:not(.keshero-date-format-native)::-webkit-calendar-picker-indicator:hover {
  background-color: #e0f2fe;
  box-shadow: inset 0 0 0 2px var(--app-action-primary, #0ea5e9);
  opacity: 1;
}

input[type="date"]:not(.keshero-date-format-native)::-webkit-calendar-picker-indicator:active,
input[type="datetime-local"]:not(.keshero-date-format-native)::-webkit-calendar-picker-indicator:active,
input[type="time"]:not(.keshero-date-format-native)::-webkit-calendar-picker-indicator:active {
  background-color: #bae6fd;
  transform: scale(0.94);
}

/* App-wide dropdown field standard. Applies the current single-select and multi-select designs across native and custom dropdowns.
 * Canonical multi-select: .ks-dropdown / [data-ks-dropdown-trigger]. Legacy adapters remain listed until migrated. */
:where(select:not([multiple]),
  .grid-filter-select,
  .grid-filter-dropdown-toggle,
  .spotlight-tag-picker__toggle,
  .ks-dropdown [data-ks-dropdown-trigger],
  details[class*="multiselect"] > summary,
  .keshboard-drawer__multiselect summary,
  .pm-pip-filter-dropdown__toggle,
  .admin-cycle-type-menu summary) {
  align-items: center !important;
  background-color: var(--ks-field-bg) !important;
  border: 1px solid var(--ks-field-border) !important;
  border-radius: var(--ks-field-radius) !important;
  box-shadow: inset 0 1px 1px rgba(16, 24, 40, 0.025) !important;
  box-sizing: border-box !important;
  color: var(--ks-field-text) !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  min-height: var(--app-control-height) !important;
  padding: 8px 34px 8px 10px !important;
}

:where(label:has(> select),
  label:has(+ select),
  label:has(> .app-rounded-select),
  label:has(+ .app-rounded-select),
  label:has(> details[class*="multiselect"]),
  label:has(+ details[class*="multiselect"]),
  label:has(> input[type="date"]),
  label:has(+ input[type="date"]),
  label:has(> input[type="datetime-local"]),
  label:has(+ input[type="datetime-local"]),
  label:has(> .keshero-date-format-field),
  label:has(+ .keshero-date-format-field),
  .ks-field__label,
  .grid-filter-label,
  .pm-assignment-board-toolbar__label,
  .pm-home-filters label,
  .surveys-filter-bar label,
  .spotlight-dashboard-filters label,
  .home-pm-rollup-control label) {
  font-weight: 800 !important;
}

:where(select:not([multiple]),
  .grid-filter-select) {
  -webkit-appearance: none !important;
  appearance: none !important;
  background-image: var(--app-dropdown-arrow-icon) !important;
  background-position: right 10px center !important;
  background-repeat: no-repeat !important;
  background-size: var(--app-dropdown-arrow-size) var(--app-dropdown-arrow-size) !important;
}

:where(details[class*="multiselect"] > summary,
  .keshboard-drawer__multiselect summary) {
  padding-right: 42px !important;
  position: relative !important;
}

/* Custom grid dropdowns render their chevron as an inline element rather
   than a background image; let flex spacing place it at the far right. */
.grid-filter-dropdown-toggle {
  padding-right: 6px !important;
}

:where(.grid-filter-dropdown-toggle,
  .spotlight-tag-picker__toggle,
  .ks-dropdown [data-ks-dropdown-trigger],
  details[class*="multiselect"] > summary,
  .keshboard-drawer__multiselect summary,
  .pm-pip-filter-dropdown__toggle,
  .admin-cycle-type-menu summary) {
  display: flex !important;
  gap: 8px !important;
  justify-content: space-between !important;
  text-align: left !important;
  width: 100% !important;
}

:where(.keshboard-drawer__multiselect-summary,
  .pm-manage-filter-dd-summary,
  .pm-pip-filter-dropdown__summary,
  details[class*="multiselect"] > summary > span:first-child) {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  gap: 8px !important;
  justify-content: space-between !important;
  min-height: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

:where(.keshboard-drawer__multiselect-summary__text,
  .pm-manage-filter-dd-summary__text,
  .pm-pip-filter-dropdown__summary-text,
  details[class*="multiselect"] > summary > span:first-child > span:first-child) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

:where(.keshboard-drawer__multiselect-summary__chev,
  .pm-manage-filter-dd-summary__chev,
  .pm-pip-filter-dropdown__summary-chev,
  details[class*="multiselect"] > summary > span:first-child > span:last-child) {
  margin-left: auto !important;
}

:where(.pm-manage-filter-multiselect > summary,
  .pm-assignee-multiselect > summary,
  .keshboard-drawer__multiselect > summary,
  .user-access-pop-multiselect > summary) {
  overflow: hidden !important;
}

:where(.pm-manage-filter-dd-summary__chev,
  .keshboard-drawer__multiselect-summary__chev) {
  flex: 0 0 var(--app-dropdown-arrow-size) !important;
  height: var(--app-dropdown-arrow-size) !important;
  margin-left: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  right: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: var(--app-dropdown-arrow-size) !important;
}

:where(details.pm-manage-filter-multiselect[open] > summary .pm-manage-filter-dd-summary__chev,
  details.pm-assignee-multiselect[open] > summary .pm-manage-filter-dd-summary__chev,
  .keshboard-drawer__multiselect[open] > summary .keshboard-drawer__multiselect-summary__chev) {
  transform: translateY(-50%) rotate(180deg) !important;
}

:where(.pm-manage-filter-dd-summary__text,
  .keshboard-drawer__multiselect-summary__text) {
  max-width: calc(100% - 32px) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

:where(.keshboard-drawer__multiselect-summary__chev) {
  flex-basis: var(--app-dropdown-arrow-size) !important;
  height: var(--app-dropdown-arrow-size) !important;
  width: var(--app-dropdown-arrow-size) !important;
}

:where(select:not([multiple]),
  .grid-filter-select,
  .grid-filter-dropdown-toggle,
  .spotlight-tag-picker__toggle,
  .ks-dropdown [data-ks-dropdown-trigger],
  details[class*="multiselect"] > summary,
  .keshboard-drawer__multiselect summary,
  .pm-pip-filter-dropdown__toggle,
  .admin-cycle-type-menu summary):hover {
  border-color: #98a2b3 !important;
}

:where(select:not([multiple]),
  .grid-filter-select,
  .grid-filter-dropdown-toggle,
  .spotlight-tag-picker__toggle,
  .ks-dropdown [data-ks-dropdown-trigger],
  details[class*="multiselect"] > summary,
  .keshboard-drawer__multiselect summary,
  .pm-pip-filter-dropdown__toggle,
  .admin-cycle-type-menu summary):focus,
:where(select:not([multiple]),
  .grid-filter-select,
  .grid-filter-dropdown-toggle,
  .spotlight-tag-picker__toggle,
  .ks-dropdown [data-ks-dropdown-trigger],
  details[class*="multiselect"] > summary,
  .keshboard-drawer__multiselect summary,
  .pm-pip-filter-dropdown__toggle,
  .admin-cycle-type-menu summary):focus-visible,
.ks-dropdown.is-open > [data-ks-dropdown-trigger] {
  border-color: var(--ks-field-focus) !important;
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.16) !important;
  outline: none !important;
}

:where(select[multiple]) {
  background: var(--ks-field-bg) !important;
  border: 1px solid var(--ks-field-border) !important;
  border-radius: var(--ks-field-radius) !important;
  box-shadow: inset 0 1px 1px rgba(16, 24, 40, 0.025) !important;
  box-sizing: border-box !important;
  color: var(--ks-field-text) !important;
  font: inherit !important;
  min-height: 118px !important;
  padding: 6px !important;
}

:where(select[multiple]):focus {
  border-color: var(--ks-field-focus) !important;
  box-shadow: 0 0 0 3px rgba(29, 155, 240, 0.16) !important;
  outline: none !important;
}

:where(select[multiple] option) {
  border-radius: 6px;
  font-weight: 400 !important;
  padding: 8px 10px;
}

:where(.grid-filter-dropdown-panel,
  .spotlight-tag-picker__menu,
  .home-pm-rollup-multiselect__menu,
  .pm-assignee-multiselect__list,
  .keshboard-drawer__multiselect-list,
  .ks-dropdown__menu,
  details[class*="multiselect"] > div[class*="list"],
  details[class*="multiselect"] > div[class*="menu"]) {
  background: var(--ks-field-dropdown-bg) !important;
  border: 1px solid var(--ks-field-border) !important;
  border-radius: var(--app-dropdown-popup-radius) !important;
  box-shadow: 0 18px 38px rgba(16, 24, 40, 0.16) !important;
  box-sizing: border-box !important;
  color: var(--ks-field-text) !important;
  overflow: auto !important;
  padding: 6px !important;
}

:where(.grid-filter-check-label,
  .spotlight-tag-picker__option,
  .home-pm-rollup-multiselect__option,
  .pm-manage-filter-option:not(.pm-manage-filter-option--section),
  .keshboard-drawer__multiselect-list label,
  .ks-dropdown__option) {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 6px !important;
  box-sizing: border-box !important;
  color: var(--ks-field-text) !important;
  cursor: pointer !important;
  display: flex !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  gap: 8px !important;
  line-height: 1.25 !important;
  min-height: 34px !important;
  padding: 8px 10px !important;
  text-align: left !important;
  width: 100% !important;
}

:where(.grid-filter-check-label:hover,
  .grid-filter-check-label:focus-within,
  .spotlight-tag-picker__option:hover,
  .spotlight-tag-picker__option:focus-within,
  .home-pm-rollup-multiselect__option:hover,
  .home-pm-rollup-multiselect__option:focus-within,
  .pm-manage-filter-option:not(.pm-manage-filter-option--section):hover,
  .pm-manage-filter-option:not(.pm-manage-filter-option--section):focus,
  .keshboard-drawer__multiselect-list label:hover,
  .keshboard-drawer__multiselect-list label:focus-within,
  .ks-dropdown__option:hover,
  .ks-dropdown__option:focus) {
  background: var(--ks-field-dropdown-hover) !important;
  outline: none !important;
}

:where(.grid-filter-check-label:has(input[data-select-all-checkbox]),
  .grid-filter-check-label:has(input[data-grid-filter-select-all]),
  .pm-manage-filter-option:has(input[type="checkbox"][value="all"]),
  .pm-manage-filter-option--choice[data-value="all"],
  .pm-manage-filter-option[data-filter-all],
  .home-pm-rollup-multiselect__option:has(input[value="all"]),
  .keshboard-drawer__multiselect-list label:has(input[type="checkbox"][value="all"]),
  .keshboard-drawer__filter-option--choice[data-value="all"],
  .ks-dropdown__option[data-value="all"]) {
  border-bottom: var(--app-dropdown-select-all-divider-width, 2px) solid var(--app-dropdown-select-all-divider-color, var(--ks-field-border)) !important;
  border-radius: 6px 6px 0 0 !important;
  color: var(--ks-field-chip-text) !important;
  font-weight: 400 !important;
  margin-bottom: 3px !important;
}

:where(.grid-filter-check-label input[type="checkbox"],
  .spotlight-tag-picker__option input[type="checkbox"],
  .home-pm-rollup-multiselect__option input[type="checkbox"],
  .pm-manage-filter-option input[type="checkbox"],
  .keshboard-drawer__multiselect-list input[type="checkbox"],
  .ks-dropdown__option input[type="checkbox"]) {
  flex: 0 0 auto !important;
  height: var(--app-checkbox-size, 16px) !important;
  margin: 0 !important;
  min-height: 0 !important;
  width: var(--app-checkbox-size, 16px) !important;
}

:where(.pm-manage-filter-option--choice.is-selected,
  .pm-manage-filter-option:has(input[type="checkbox"]:checked),
  .pm-manage-filter-option:has(input[type="checkbox"][data-indeterminate="true"]),
  .ks-dropdown__option[aria-selected="true"]) {
  background: var(--ks-field-selected-bg) !important;
  color: var(--ks-field-text) !important;
  font-weight: 400 !important;
}

/* KeshBoard-style lists: selection is the checkbox only — never a filled option row. */
:where(.keshboard-drawer__multiselect-list label:has(input[type="checkbox"]:checked),
  .keshboard-drawer__multiselect-list label:has(input[type="checkbox"][data-indeterminate="true"])) {
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

:where(.keshboard-drawer__multiselect-list label:hover,
  .keshboard-drawer__multiselect-list label:focus-within) {
  background: var(--ks-field-dropdown-hover) !important;
  box-shadow: none !important;
  outline: none !important;
}

/* When All is fully selected, keep other dropdown rows quiet — only checkmarks convey state. */
:where(.ks-dropdown:has([data-value="all"] > input[type="checkbox"]:checked:not(:indeterminate):not([data-indeterminate="true"])) .ks-dropdown__option:not([data-value="all"])) {
  background: transparent !important;
}

:where(.ks-dropdown:has([data-value="all"] > input[type="checkbox"]:checked:not(:indeterminate):not([data-indeterminate="true"])) .ks-dropdown__option:not([data-value="all"]):hover,
  .ks-dropdown:has([data-value="all"] > input[type="checkbox"]:checked:not(:indeterminate):not([data-indeterminate="true"])) .ks-dropdown__option:not([data-value="all"]):focus,
  .ks-dropdown:has([data-value="all"] > input[type="checkbox"]:checked:not(:indeterminate):not([data-indeterminate="true"])) .ks-dropdown__option:not([data-value="all"]):focus-within) {
  background: var(--ks-field-dropdown-hover) !important;
}

/* Ensure every controlled dropdown popup/list shell uses curved edges. */
:where(.topbar-search__dropdown,
  .app-topnav-favorites-menu__panel,
  .app-topnav-apps-menu__panel,
  .topbar-profile-menu__panel,
  .app-topnav__popover-preferences-panel,
  .admin-cycle-type-menu__panel,
  .pm-recipient-menu,
  .grid-filter-dropdown-panel,
  .spotlight-tag-picker__menu,
  .home-pm-rollup-multiselect__menu,
  .pm-assignee-multiselect__list,
  .keshboard-drawer__multiselect-list,
  .ks-dropdown__menu,
  details[class*="multiselect"] > div[class*="list"],
  details[class*="multiselect"] > div[class*="menu"]) {
  border-radius: var(--app-dropdown-popup-radius) !important;
}

:where(.topbar-search__option,
  .topbar-search__footer,
  .app-topnav-favorites-menu__item,
  .app-topnav-favorites-menu__manage,
  .app-topnav-apps-menu__link,
  .topbar-profile-menu__panel a,
  .topbar-profile-menu__panel button,
  .admin-cycle-type-menu__option,
  [data-person-picker-option],
  [data-recipient-option]) {
  border-radius: calc(var(--ks-field-radius) - 2px) !important;
}

:where(.pm-card,
  .profile-card,
  .settings-general-panel,
  .settings-general-card,
  .succession-edit-section,
  .user-access-card,
  .employee-field-container-card) {
  background-color: var(--app-container-surface-custom, #fff);
  border-color: var(--app-container-border-custom, #dbe5ef);
  color: var(--app-container-text-custom, inherit);
  position: relative;
}

:where(.pm-card,
  .profile-card,
  .settings-general-panel,
  .succession-edit-section) {
  border-top-color: var(--app-container-accent-custom, var(--app-action-primary-border));
}

:where(.pm-card,
  .profile-card,
  .settings-general-panel,
  .settings-general-card,
  .succession-edit-section,
  .user-access-card)::before {
  background: var(--app-container-accent-line-custom, var(--app-container-accent-custom, var(--app-action-primary-border))) top left / 100% 3px no-repeat;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  content: "";
  height: var(--app-container-accent-line-clip-height, 14px);
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}

/* Nested PM cards (Sub-Tasks, Comments, etc. inside edit shells): no accent gradient bar.
   Keep section separation via normal border + a quiet header hairline. */
.pm-card .pm-card {
  border-top-color: var(--app-container-border-custom, var(--app-border, #dbe5ef));
  box-shadow: none !important;
  margin-top: 2px;
}

.pm-card .pm-card:hover {
  box-shadow: none !important;
}

.pm-card .pm-card::before {
  background: none !important;
  content: none !important;
  display: none !important;
  height: 0 !important;
}

.pm-card .pm-card > .pm-section-header {
  border-bottom: 1px solid var(--app-container-border-custom, #e4e7ec);
  margin-bottom: 12px;
  padding-bottom: 8px;
}

/* Surface hierarchy: a colored accent introduces a primary workspace, not every
   card nested inside it. Nested containers retain their regular border and
   spacing, so dense screens read as one composed section instead of stripes. */
:where(
  .app-card,
  .page-intro,
  .home-table-wrap,
  .inbox-panel,
  .inbox-card,
  .spotlight-compose,
  .spotlight-card,
  .spotlight-dashboard,
  .pm-card,
  .pm-soft-panel,
  .pm-inline-panel,
  .succession-edit-section,
  .comp-config-section,
  .comp-analysis-card,
  .comp-stat-card,
  .perf-da-card,
  .grid-top-legend-panel,
  .grid-charts-panel,
  .checkin-card,
  .recognition-panel,
  .profile-card,
  .profile-summary-card,
  .profile-editor-card,
  .profile-section-card,
  .settings-general-panel,
  .settings-general-card,
  .settings-checkin-agenda-card,
  .succession-bench-card,
  .succession-bench-container-card,
  .activity-panel,
  .activity-intro,
  .surveys-panel,
  .surveys-sentiment-card,
  .surveys-filter-bar,
  .split-screen-pane,
  .user-access-card,
  .employee-field-container-card
) :where(
  .app-card,
  .panel,
  .page-intro,
  .home-table-wrap,
  .inbox-panel,
  .inbox-card,
  .spotlight-compose,
  .spotlight-card,
  .spotlight-dashboard,
  .pm-card,
  .pm-soft-panel,
  .pm-inline-panel,
  .succession-edit-section,
  .comp-config-section,
  .comp-analysis-card,
  .comp-stat-card,
  .perf-da-card,
  .grid-top-legend-panel,
  .grid-charts-panel,
  .checkin-card,
  .recognition-panel,
  .profile-card,
  .profile-summary-card,
  .profile-editor-card,
  .profile-section-card,
  .settings-page-shell,
  .settings-general-panel,
  .settings-general-card,
  .settings-checkin-agenda-card,
  .admin-access-tabs,
  .succession-bench-card,
  .succession-bench-container-card,
  .activity-panel,
  .activity-intro,
  .surveys-panel,
  .surveys-sentiment-card,
  .surveys-filter-bar,
  .split-screen-workspace,
  .split-screen-pane,
  .user-access-card,
  .employee-field-container-card
)::before {
  background: none !important;
  content: none !important;
  display: none !important;
  height: 0 !important;
}

.settings-general-panel .settings-general-card > .settings-general-card__head {
  border-bottom: 1px solid var(--app-container-border-custom, #e4e7ec);
  margin-bottom: 12px;
  padding-bottom: 8px;
}

:where(.topbar-search__dropdown,
  .app-topnav__popover,
  .app-topnav-favorites-menu__panel,
  .app-topnav-apps-menu__panel,
  .topbar-profile-menu__panel,
  .app-topnav__popover-preferences-panel,
  .admin-cycle-type-menu__panel,
  .pm-recipient-menu,
  .grid-filter-dropdown-panel,
  .spotlight-tag-picker__menu,
  .home-pm-rollup-multiselect__menu,
  .pm-assignee-multiselect__list,
  .keshboard-drawer__multiselect-list,
  .ks-dropdown__menu,
  .pm-task-drawer,
  .favorites-modal__dialog,
  .modal,
  .dialog) {
  background-color: var(--app-popup-surface-custom, #fff);
  border-color: var(--app-popup-border-custom, #d0d5dd);
  color: var(--app-popup-text-custom, inherit);
  position: relative;
}

:where(.app-topnav__popover,
  .app-topnav-favorites-menu__panel,
  .app-topnav-apps-menu__panel,
  .topbar-profile-menu__panel,
  .pm-task-drawer,
  .favorites-modal__dialog) {
  border-top-color: var(--app-popup-accent-custom, var(--app-action-primary-border));
}

:where(.app-topnav__popover,
  .app-topnav-favorites-menu__panel,
  .app-topnav-apps-menu__panel,
  .topbar-profile-menu__panel,
  .pm-task-drawer,
  .favorites-modal__dialog)::before {
  background: var(--app-popup-accent-line-custom, var(--app-popup-accent-custom, var(--app-action-primary-border)));
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  content: "";
  height: 3px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}

.topbar-profile-menu__panel::before {
  content: none;
  display: none;
}

/* Drawers/modals with solid header bands: no top accent bar. */
:where(
  .pm-task-drawer,
  .favorites-modal__dialog,
  .checkin-detail,
  .checkin-hub-drawer,
  .checkin-active-items-panel,
  .pm-checkin-detail-drawer,
  .pm-readiness-action-drawer,
  .progress-summary-drawer__panel,
  .progress-summary-detail-flyout,
  .todo-list-detail-flyout,
  .keshboard-drawer__panel,
  .keshboard-drawer__detail-flyout,
  .watchlist-drawer__panel,
  .todo-list-drawer__panel-main,
  .in-app-help-panel,
  .org-map-drawer,
  .psr-formula-drawer,
  .psr-analytics-drawer,
  .checkin-reference-modal,
  .checkin-session-comments-drawer
)::before {
  display: none;
}

:where(.app-topnav__popover,
  .app-topnav-favorites-menu__panel,
  .app-topnav-apps-menu__panel) {
  border-top-color: var(--app-popup-border-custom, #d0d5dd);
}

:where(.app-topnav__popover,
  .app-topnav-favorites-menu__panel,
  .app-topnav-apps-menu__panel)::before {
  display: none;
}

:where(.app-rounded-select__option,
  .grid-filter-check-label,
  .spotlight-tag-picker__option,
  .home-pm-rollup-multiselect__option,
  .user-access-pop-multiselect__option,
  .pm-manage-filter-option:not(.pm-manage-filter-option--section),
  .pm-pip-admin-filters .pm-manage-filter-option,
  .keshboard-drawer__multiselect-list label,
  .ks-dropdown__option,
  .admin-cycle-type-menu__option,
  .succession-workspace-filter__option,
  .succession-job-level-filter__option,
  [data-person-picker-option],
  [data-recipient-option]) {
  font-weight: 400 !important;
}

/* Form field values are body text; only their field titles and section headings are emphasized. */
:where(
  input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="image"]):not([type="color"]),
  textarea,
  select,
  [contenteditable="true"],
  .app-rounded-select__button,
  .app-rounded-select__label,
  .ks-dropdown__trigger,
  .ks-field__control
) {
  font-weight: var(--app-control-font-weight, 400) !important;
}

/* Dropdown values and choices are body text; only their field titles and section headings are emphasized. */
:where(
  .app-rounded-select__button,
  .app-rounded-select__label,
  .grid-filter-dropdown-toggle,
  .spotlight-tag-picker__toggle,
  details[class*="multiselect"] > summary,
  .keshboard-drawer__multiselect summary,
  .pm-pip-filter-dropdown__toggle,
  .admin-cycle-type-menu summary,
  .pm-manage-filter-dd-summary__text,
  .keshboard-drawer__multiselect-summary__text,
  .pm-pip-filter-dropdown__summary-text,
  .ks-dropdown__trigger
) {
  color: var(--app-heading) !important;
  font-family: inherit;
  font-size: var(--app-control-font-size, 13px) !important;
  font-weight: var(--app-control-font-weight, 400) !important;
}

.app-rounded-select.is-placeholder .app-rounded-select__button,
.app-rounded-select.is-placeholder .app-rounded-select__label,
.app-rounded-select__option.is-placeholder-option {
  color: var(--ks-field-placeholder, #98a2b3) !important;
}

:where(select option,
  select optgroup) {
  border-radius: calc(var(--ks-field-radius) - 2px);
  color: var(--app-heading);
  font-family: inherit;
  font-size: inherit;
  font-weight: 400 !important;
  padding: 8px 10px;
}

:where(label:has(> input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"])),
  label:has(> textarea),
  label:has(> .task-category-picker),
  label:has(> .keshero-date-format-field),
  label:has(+ input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"])),
  label:has(+ textarea),
  label:has(+ .task-category-picker),
  label:has(+ .keshero-date-format-field),
  .pm-form label,
  .pm-task-drawer__form label,
  .pm-task-drawer__side-editor label,
  .pm-kesh-alt-field > span:not(.keshero-date-format-field):not(.app-rounded-select),
  .pm-manage-filter-dd-label,
  .pm-label-text,
  .ks-field__label) {
  color: var(--app-label-color, #344054) !important;
  font-size: var(--app-label-font-size, 12px) !important;
  font-weight: var(--app-label-font-weight, 800) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

:where(fieldset legend) {
  font-weight: 800 !important;
}

:where(label input,
  label textarea,
  label select,
  label .app-rounded-select,
  label .task-category-picker,
  label .ks-dropdown,
  .pm-form input,
  .pm-form textarea,
  .pm-form select,
  .pm-task-drawer__form input,
  .pm-task-drawer__form textarea,
  .pm-task-drawer__form select,
  .pm-task-drawer__side-editor input,
  .pm-task-drawer__side-editor textarea,
  .pm-task-drawer__side-editor select) {
  font-weight: 400;
}

:where(.app-rounded-select__menu .app-rounded-select__option,
  .ks-dropdown__menu .ks-dropdown__option,
  [role="listbox"] [role="option"],
  [role="menu"] [role="menuitem"],
  .pm-assignee-multiselect__list label,
  .keshboard-drawer__multiselect-list label,
  .pm-manage-filter-option:not(.pm-manage-filter-option--section),
  .grid-filter-check-label,
  .spotlight-tag-picker__option,
  .home-pm-rollup-multiselect__option,
  .user-access-pop-multiselect__option,
  [data-person-picker-option],
  [data-recipient-option]) {
  color: var(--app-heading) !important;
  font-family: inherit;
  font-size: 1em;
  font-weight: 400 !important;
}

.app-rounded-select__option:disabled {
  color: var(--app-muted) !important;
}

/* Reorder controls: quiet stroke chevrons (not loud filled brand arrows). */
:root {
  --app-move-arrow-size: 14px;
  --app-move-arrow-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='m6 15 6-6 6 6' stroke='%23000' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

:where(button[aria-label^="Move"][aria-label$=" up" i],
  button[aria-label^="Move"][aria-label$=" down" i],
  button[title^="Move up" i],
  button[title^="Move down" i],
  button[data-move-line-up],
  button[data-move-line-down],
  button[data-move-task-status-up],
  button[data-move-task-status-down],
  button[data-milestone-move],
  button[data-subtask-move],
  button[data-pip-area-up],
  button[data-pip-area-down],
  button[data-favorite-move],
  button[data-calendar-note-reorder],
  button.pm-readiness-development-action-list__reorder-button,
  button[data-move-field-row],
  button[data-move-employee-profile-container-up],
  button[data-move-employee-profile-container-down],
  button[data-move-employee-profile-field-up],
  button[data-move-employee-profile-field-down],
  button[data-move-user-access-role-up],
  button[data-move-user-access-role-down],
  button[data-todo-action="up"],
  button[data-todo-action="down"]) {
  background-image: none !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 1 !important;
  min-height: 28px !important;
  min-width: 28px !important;
  overflow: hidden !important;
  position: relative !important;
  text-shadow: none !important;
  white-space: nowrap !important;
}

:where(button[aria-label^="Move"][aria-label$=" down" i],
  button[title^="Move down" i],
  button[data-move-line-down],
  button[data-move-task-status-down],
  button[data-milestone-move="down"],
  button[data-subtask-move="down"],
  button[data-pip-area-down],
  button[data-favorite-move="down"],
  button[data-calendar-note-direction="down"],
  button.pm-readiness-development-action-list__reorder-button[aria-label$=" down" i],
  button[data-move-field-row="down"],
  button[data-move-employee-profile-container-down],
  button[data-move-employee-profile-field-down],
  button[data-move-user-access-role-down],
  button[data-todo-action="down"]) {
  --app-move-arrow-rotation: 180deg;
}

:where(button[aria-label^="Move"][aria-label$=" up" i],
  button[title^="Move up" i],
  button[data-move-line-up],
  button[data-move-task-status-up],
  button[data-milestone-move="up"],
  button[data-subtask-move="up"],
  button[data-pip-area-up],
  button[data-favorite-move="up"],
  button[data-calendar-note-direction="up"],
  button.pm-readiness-development-action-list__reorder-button[aria-label$=" up" i],
  button[data-move-field-row="up"],
  button[data-move-employee-profile-container-up],
  button[data-move-employee-profile-field-up],
  button[data-move-user-access-role-up],
  button[data-todo-action="up"]) {
  --app-move-arrow-rotation: 0deg;
}

:where(button[aria-label^="Move"][aria-label$=" up" i],
  button[aria-label^="Move"][aria-label$=" down" i],
  button[title^="Move up" i],
  button[title^="Move down" i],
  button[data-move-line-up],
  button[data-move-line-down],
  button[data-move-task-status-up],
  button[data-move-task-status-down],
  button[data-milestone-move],
  button[data-subtask-move],
  button[data-pip-area-up],
  button[data-pip-area-down],
  button[data-favorite-move],
  button[data-calendar-note-reorder],
  button.pm-readiness-development-action-list__reorder-button,
  button[data-move-field-row],
  button[data-move-employee-profile-container-up],
  button[data-move-employee-profile-container-down],
  button[data-move-employee-profile-field-up],
  button[data-move-employee-profile-field-down],
  button[data-move-user-access-role-up],
  button[data-move-user-access-role-down],
  button[data-todo-action="up"],
  button[data-todo-action="down"])::before {
  background: var(--app-move-arrow-fill-custom, #64748b);
  content: "";
  height: var(--app-move-arrow-size, 14px);
  left: 50%;
  -webkit-mask: var(--app-move-arrow-mask) center / contain no-repeat;
  mask: var(--app-move-arrow-mask) center / contain no-repeat;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(var(--app-move-arrow-rotation, 0deg));
  width: var(--app-move-arrow-size, 14px);
}

:where(button[aria-label^="Move"][aria-label$=" up" i],
  button[aria-label^="Move"][aria-label$=" down" i],
  button[title^="Move up" i],
  button[title^="Move down" i],
  button[data-move-line-up],
  button[data-move-line-down],
  button[data-move-task-status-up],
  button[data-move-task-status-down],
  button[data-milestone-move],
  button[data-subtask-move],
  button[data-pip-area-up],
  button[data-pip-area-down],
  button[data-favorite-move],
  button[data-calendar-note-reorder],
  button.pm-readiness-development-action-list__reorder-button,
  button[data-move-field-row],
  button[data-move-employee-profile-container-up],
  button[data-move-employee-profile-container-down],
  button[data-move-employee-profile-field-up],
  button[data-move-employee-profile-field-down],
  button[data-move-user-access-role-up],
  button[data-move-user-access-role-down],
  button[data-todo-action="up"],
  button[data-todo-action="down"],
  button[value^="move_up_idx:"],
  button[value^="move_down_idx:"]):disabled {
  pointer-events: none !important;
  visibility: hidden !important;
}

:where(button[aria-label^="Move"][aria-label$=" up" i],
  button[aria-label^="Move"][aria-label$=" down" i],
  button[title^="Move up" i],
  button[title^="Move down" i],
  button[data-move-line-up],
  button[data-move-line-down],
  button[data-move-task-status-up],
  button[data-move-task-status-down],
  button[data-milestone-move],
  button[data-subtask-move],
  button[data-pip-area-up],
  button[data-pip-area-down],
  button[data-favorite-move],
  button[data-calendar-note-reorder],
  button.pm-readiness-development-action-list__reorder-button,
  button[data-move-field-row],
  button[data-move-employee-profile-container-up],
  button[data-move-employee-profile-container-down],
  button[data-move-employee-profile-field-up],
  button[data-move-employee-profile-field-down],
  button[data-move-user-access-role-up],
  button[data-move-user-access-role-down],
  button[data-todo-action="up"],
  button[data-todo-action="down"]) :where(svg, img, span) {
  visibility: hidden !important;
}

:where(button[aria-label^="Move"][aria-label$=" up" i],
  button[aria-label^="Move"][aria-label$=" down" i],
  button[title^="Move up" i],
  button[title^="Move down" i],
  button[data-todo-action="up"],
  button[data-todo-action="down"]):hover {
  --app-move-arrow-fill-custom: color-mix(
    in srgb,
    var(--app-move-arrow-primary-custom, #64748b) 70%,
    #0f172a
  );
}

/* Shared popup polish: apply the Link Existing Development Item modal language to dialogs, drawers, and flyouts. */
:root {
  /* Solid tinted header band — no blue→purple gradient on popup/drawer chrome. */
  --app-popup-header-bg: color-mix(
    in srgb,
    var(--app-popup-accent-custom, #2ec5ff) 22%,
    var(--app-popup-surface-custom, #ffffff)
  );
  --app-popup-header-border: var(--app-popup-accent-custom, #2ec5ff);
  --app-popup-shell-shadow: 0 24px 70px rgba(15, 23, 42, 0.26);
  --app-popup-side-shadow: -22px 0 58px rgba(15, 23, 42, 0.18);
  --app-popup-body-bg: linear-gradient(180deg, color-mix(in srgb, var(--app-popup-surface-custom, #ffffff) 92%, var(--app-popup-accent-custom, #2ec5ff)) 0%, var(--app-popup-surface-custom, #ffffff) 100%);
  --app-popup-card-bg: var(--app-popup-surface-custom, #ffffff);
  --app-popup-card-border: var(--app-popup-border-custom, #d0d5dd);
}

:where(
  .pm-readiness-assessment-modal-backdrop,
  .pm-readiness-action-create-backdrop,
  .favorites-modal,
  .person-avatar-modal,
  .grid-recognition-modal,
  .succession-modal,
  .recovery-modal
) :where(.favorites-modal__backdrop, .person-avatar-modal__backdrop, .grid-recognition-modal__backdrop, .succession-modal__backdrop) {
  background: rgba(15, 23, 42, 0.42) !important;
  backdrop-filter: blur(2px);
}

:where(
  .pm-readiness-assessment-modal-backdrop,
  .pm-readiness-action-create-backdrop
) {
  background: rgba(15, 23, 42, 0.42) !important;
  backdrop-filter: blur(2px);
}

:where(
  .pm-readiness-assessment-modal,
  .pm-readiness-action-create-modal,
  .favorites-manage-modal,
  .grid-recognition-modal__content,
  .succession-modal__dialog,
  .recovery-modal__dialog
) {
  background: var(--app-popup-surface-custom, #fff) !important;
  border: 1px solid var(--app-popup-border-custom, #d0d5dd) !important;
  border-radius: 12px !important;
  box-shadow: var(--app-popup-shell-shadow) !important;
  color: var(--app-popup-text-custom, inherit) !important;
  overflow: hidden !important;
}

:where(
  .pm-readiness-assessment-modal__head,
  .favorites-manage-modal__head,
  .grid-recognition-modal__header,
  .succession-modal__header,
  .recovery-modal__header,
  .skills-proficiency-modal__header
) {
  align-items: center;
  background: var(--app-popup-header-bg) !important;
  border-bottom: 1px solid var(--app-popup-header-border) !important;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 18px 20px !important;
}

:where(
  .pm-readiness-assessment-modal__head h3,
  .favorites-manage-modal__head h3,
  .grid-recognition-modal__header h3,
  .succession-modal__header h4,
  .recovery-modal__header h3
) {
  color: var(--app-popup-text-custom, #0f172a) !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  margin: 0 !important;
}

:where(
  .pm-readiness-assessment-modal__eyebrow,
  .favorites-manage-modal__eyebrow,
  .grid-recognition-modal__eyebrow,
  .succession-modal__eyebrow,
  .recovery-modal__eyebrow
) {
  color: var(--app-popup-text-custom, #0f172a) !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  margin: 0 0 4px !important;
  text-transform: uppercase !important;
}

:where(
  .pm-readiness-assessment-modal__body,
  .pm-development-plan-link-modal__body,
  .favorites-manage-modal__body,
  .grid-recognition-modal__body,
  .succession-modal__body,
  .recovery-modal__body
) {
  background: var(--app-popup-body-bg) !important;
  padding: 18px 20px 20px !important;
}

:where(
  .pm-readiness-action-create-modal .pm-readiness-action-create-form,
  .pm-readiness-assessment-modal__body > .pm-form,
  .pm-development-plan-link-modal .pm-development-plan-link-form,
  .favorites-manage-modal form,
  .grid-recognition-modal__panel,
  .succession-modal__form,
  .recovery-modal__panel
) {
  background: var(--app-popup-card-bg) !important;
  border: 1px solid var(--app-popup-card-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05) !important;
}

:where(
  .pm-task-drawer,
  .progress-summary-drawer__panel,
  .keshboard-drawer__panel,
  .watchlist-drawer__panel,
  .in-app-help-panel,
  .org-map-drawer
) {
  background: var(--app-popup-surface-custom, #fff) !important;
  border: 1px solid var(--app-popup-border-custom, #d0d5dd) !important;
  box-shadow: var(--app-popup-side-shadow) !important;
  color: var(--app-popup-text-custom, inherit) !important;
  overflow: hidden;
}

/* Side drawers sit flush to the viewport top — no top border/radius gap. */
:where(
  .pm-task-drawer,
  .progress-summary-drawer__panel,
  .progress-summary-detail-flyout,
  .todo-list-detail-flyout,
  .keshboard-drawer__panel,
  .keshboard-drawer__detail-flyout,
  .watchlist-drawer__panel,
  .todo-list-drawer__panel-main,
  .checkin-detail,
  .checkin-hub-drawer,
  .checkin-active-items-panel,
  .pm-checkin-detail-drawer,
  .pm-readiness-action-drawer,
  .in-app-help-panel,
  .org-map-drawer,
  .psr-formula-drawer,
  .psr-analytics-drawer,
  .checkin-reference-modal,
  .checkin-session-comments-drawer
) {
  border-top: 0 !important;
  border-radius: 0 !important;
}

:where(.pm-task-drawer) {
  border-radius: 0 !important;
}

:where(
  .pm-task-drawer__header,
  .pm-task-drawer__side-header,
  .progress-summary-drawer__header,
  .progress-summary-detail-flyout__top,
  .todo-list-detail-flyout__top,
  .keshboard-drawer__detail-header,
  .checkin-hub-drawer-head,
  .checkin-detail__header,
  .in-app-help-panel__header,
  .org-map-drawer__header
) {
  background: var(--app-popup-header-bg) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--app-popup-header-border) !important;
  padding: 18px 20px !important;
}
/* Popup banners sit flush against the shell; body spacing remains independent. */
:where(
  .pm-task-drawer,
  .favorites-manage-modal__dialog,
  .skills-proficiency-modal__dialog,
  .pm-calendar-modal__dialog
) {
  --app-popup-banner-inset-top: 0px;
  --app-popup-banner-inset-x: 0px;
}

:where(.pm-task-drawer) {
  --app-popup-banner-inset-top: 20px;
  --app-popup-banner-inset-x: 20px;
}

:where(.pm-task-drawer.is-wide) {
  --app-popup-banner-inset-top: 0px;
  --app-popup-banner-inset-x: 0px;
  column-gap: 0;
  gap: 0;
  row-gap: 0;
}

:where(.pm-task-drawer.is-wide > .pm-task-drawer__header) {
  align-self: start;
  height: auto;
  margin: 0 0 16px !important;
  width: 100% !important;
}

:where(.pm-task-drawer.is-wide > :not(.pm-task-drawer__side-panel)) {
  align-self: start;
  margin-bottom: 16px;
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
}

:where(.pm-task-drawer.is-wide > :not(.pm-task-drawer__side-panel):nth-last-child(2)) {
  margin-bottom: 0;
}

:where(.pm-task-drawer.is-wide .pm-task-drawer__side-panel) {
  bottom: 0;
  left: calc(100% * 1 / 1.72);
  position: absolute;
  right: 0;
  top: 0;
  width: auto;
  z-index: 2;
}

:where(.favorites-manage-modal__dialog) {
  --app-popup-banner-inset-top: 18px;
  --app-popup-banner-inset-x: 18px;
}

:where(.skills-proficiency-modal__dialog) {
  --app-popup-banner-inset-top: 0px;
  --app-popup-banner-inset-x: 0px;
}

:where(.grid-feedback-modal__dialog) {
  --app-popup-banner-inset-top: 0px;
  --app-popup-banner-inset-x: 0px;
}

:where(.pm-calendar-modal__dialog) {
  --app-popup-banner-inset-top: 18px;
  --app-popup-banner-inset-x: 20px;
}

:where(.pm-calendar-modal__header) {
  padding: 14px 24px 12px 20px !important;
}

:where(.skills-proficiency-modal__header) {
  gap: 12px !important;
  padding: 16px 22px !important;
}

:where(.pm-checkin-detail-drawer, .pm-readiness-action-drawer, .checkin-hub-drawer, .checkin-detail.checkin-hub-drawer) {
  --app-popup-banner-inset-top: 0px;
  --app-popup-banner-inset-x: 0px;
}

:where(
  .pm-task-drawer__header,
  .pm-task-drawer__side-header,
  .progress-summary-drawer__header,
  .progress-summary-detail-flyout__top,
  .todo-list-detail-flyout__top,
  .keshboard-drawer__detail-header,
  .checkin-hub-drawer-head,
  .checkin-detail__header,
  .in-app-help-panel__header,
  .org-map-drawer__header,
  .pm-readiness-assessment-modal__head,
  .favorites-manage-modal__head,
  .grid-recognition-modal__header,
  .succession-modal__header,
  .recovery-modal__header,
  .skills-proficiency-modal__header,
  .pm-calendar-modal__header,
  .psr-formula-drawer__header,
  .keshero-frame-drawer__header,
  .keshero-pinned-panel__header,
  .keshero-peek-preview__header,
  .keshero-context-panel__header,
  [role="dialog"] > header:first-child,
  [role="dialog"] > [class$="__header"]:first-child,
  [role="dialog"] > [class$="__head"]:first-child,
  [role="dialog"] > [class$="-header"]:first-child
) {
  background: var(--app-popup-header-bg) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--app-popup-header-border) !important;
  border-radius: 0 !important;
  box-sizing: border-box;
  margin: calc(0px - var(--app-popup-banner-inset-top, 0px))
    calc(0px - var(--app-popup-banner-inset-x, 0px)) 0 !important;
  width: calc(
    100% + var(--app-popup-banner-inset-x, 0px) +
      var(--app-popup-banner-inset-x, 0px)
  ) !important;
}

:where(
  .pm-task-drawer__header h4,
  .pm-task-drawer__side-header h5,
  .checkin-hub-drawer-head h3,
  .checkin-detail__header h3,
  .progress-summary-drawer__header h3,
  .progress-summary-detail-flyout__head strong,
  .in-app-help-panel__header h3,
  .org-map-drawer h3
) {
  color: var(--app-popup-text-custom, #0f172a) !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

:where(
  .pm-task-drawer__header .pm-count-line,
  .progress-summary-drawer__header .pm-count-line,
  .pm-readiness-action-drawer .pm-task-drawer__header .pm-count-line
) {
  color: var(--app-popup-text-custom, #0f172a) !important;
}

:where(
  .pm-task-drawer__close,
  .person-avatar-modal__close,
  .grid-recognition-modal__close,
  .in-app-help-panel__close
) {
  align-items: center !important;
  background: color-mix(in srgb, var(--app-popup-surface-custom, #ffffff) 88%, #ffffff) !important;
  border: 1px solid var(--app-popup-border-custom, #bfdbfe) !important;
  border-radius: 8px !important;
  color: var(--app-popup-text-custom, #1e3a8a) !important;
  display: inline-flex !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  height: 32px !important;
  justify-content: center !important;
  min-width: 32px !important;
  padding: 0 10px !important;
}

:where(
  .pm-task-drawer__close,
  .person-avatar-modal__close,
  .grid-recognition-modal__close,
  .in-app-help-panel__close
):hover {
  background: var(--app-popup-surface-custom, #ffffff) !important;
  border-color: var(--app-popup-accent-custom, #60a5fa) !important;
  color: var(--app-popup-text-custom, #0f172a) !important;
}

:where(
  .progress-summary-drawer__column,
  .keshboard-drawer__filters,
  .keshboard-drawer__timeline-filters
) {
  background: var(--app-popup-card-bg) !important;
  border: 1px solid var(--app-popup-card-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04) !important;
}

.progress-summary-drawer__filters {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--app-popup-divider, #dbe5ef) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 14px !important;
}

:where(
  .pm-task-drawer__meta,
  .pm-task-drawer__section,
  .pm-readiness-action-drawer__card,
  .progress-summary-detail-flyout__head,
  .progress-summary-detail-flyout__details,
  .keshboard-drawer__detail-section,
  .watchlist-drawer__section,
  .checkin-hub-drawer-section,
  .checkin-detail__section,
  .pm-checkin-detail-drawer .pm-task-drawer__section,
  .org-map-drawer-section,
  .succession-org-modal-section
) {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

:where(
  .pm-task-drawer__section,
  .pm-readiness-action-drawer__card,
  .progress-summary-detail-flyout__details,
  .keshboard-drawer__detail-section,
  .watchlist-drawer__section,
  .checkin-hub-drawer-section,
  .checkin-detail__section,
  .pm-checkin-detail-drawer .pm-task-drawer__section,
  .org-map-drawer-section,
  .succession-org-modal-section
) {
  border-top: 1px solid var(--app-popup-card-border, #e4e7ec) !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
}

:where(
  .progress-summary-detail-flyout__head,
  .pm-task-drawer__meta
) {
  margin: 0 !important;
  padding: 0 !important;
}

:where(
  .watchlist-drawer__section
) {
  margin-bottom: 0 !important;
  overflow: visible !important;
}

/* Unmapped reassign card must beat popup section resets / clipping. */
#taskPreviewPanel #taskPreviewUnmappedReassign:not([hidden]) {
  background: #fef3f2 !important;
  border: 1px solid #fecdca !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  display: grid !important;
  gap: 10px !important;
  height: auto !important;
  margin: 4px 0 14px !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 14px 16px 16px !important;
  visibility: visible !important;
  width: 100% !important;
}

#taskPreviewPanel #taskPreviewUnmappedReassign[hidden] {
  display: none !important;
}

#taskPreviewPanel #taskPreviewUnmappedReassign > h5 {
  color: #912018 !important;
  display: block !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  margin: 0 !important;
}

#taskPreviewPanel #taskPreviewUnmappedReassign > .pm-task-drawer__unmapped-reassign-lead {
  color: #b42318 !important;
  display: block !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  margin: 0 !important;
}

#taskPreviewPanel #taskPreviewUnmappedReassignForm {
  align-items: end;
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100% !important;
}

#taskPreviewPanel #taskPreviewUnmappedReassignForm .pm-task-drawer__unmapped-field:not([hidden]) {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}

#taskPreviewPanel #taskPreviewUnmappedReassignForm .pm-task-drawer__unmapped-field[hidden] {
  display: none !important;
}

#taskPreviewPanel #taskPreviewUnmappedReassignForm .pm-task-drawer__unmapped-field-label {
  color: #912018 !important;
  display: block !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em;
  margin: 0 !important;
  text-transform: uppercase;
}

#taskPreviewPanel #taskPreviewUnmappedReassignForm .pm-task-drawer__unmapped-field > .app-rounded-select,
#taskPreviewPanel #taskPreviewUnmappedReassignForm .pm-task-drawer__unmapped-field .app-rounded-select {
  display: block !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  width: 100% !important;
}

#taskPreviewPanel #taskPreviewUnmappedReassignForm .app-rounded-select__button {
  background: #fff !important;
  text-transform: none !important;
  width: 100% !important;
}

#taskPreviewPanel #taskPreviewUnmappedReassignForm > button {
  min-height: 38px !important;
  padding: 8px 16px !important;
  white-space: nowrap !important;
}

:where(
  .watchlist-drawer__section-head
) {
  background: transparent !important;
  border-bottom: 1px solid var(--app-popup-card-border, #e4e7ec) !important;
  padding: 0 0 10px !important;
}

:where(
  .watchlist-drawer__item,
  .watchlist-drawer__section-empty
) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

:where(
  .pm-task-drawer__section h5,
  .pm-task-drawer__section > h5,
  .pm-task-drawer__divider h5,
  .pm-task-drawer__subtask-header h5,
  .progress-summary-drawer__column-title h4,
  .keshboard-drawer__filters-title
) {
  color: var(--app-popup-text-custom, #0f172a) !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

:where(.pm-readiness-action-drawer__body) {
  background: var(--app-popup-body-bg) !important;
}

html[data-keshero-theme="dark"] {
  --app-popup-header-bg: color-mix(
    in srgb,
    var(--app-popup-accent-custom, #2ec5ff) 32%,
    var(--app-popup-surface-custom, #111827)
  );
  --app-popup-header-border: var(--app-popup-accent-custom, #2ec5ff);
  --app-popup-body-bg: linear-gradient(180deg, color-mix(in srgb, var(--app-popup-surface-custom, #111827) 86%, #0f172a) 0%, var(--app-popup-surface-custom, #111827) 100%);
  --app-popup-card-bg: var(--app-popup-surface-custom, #111827);
  --app-popup-card-border: var(--app-popup-border-custom, #334155);
}
/* Shared rich-text affordances */
.rich-text-font-size-icon {
  align-items: flex-end;
  color: #344054;
  display: inline-flex;
  font-weight: 900;
  gap: 3px;
  line-height: 1;
  min-width: 18px;
  position: relative;
}
.rich-text-font-size-icon > span:first-child {
  font-size: 15px;
}
.rich-text-font-size-icon--down > span:first-child {
  font-size: 12px;
}
.rich-text-font-size-icon > span:last-child {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  display: inline-block;
  height: 0;
  margin-bottom: 2px;
  width: 0;
}
.rich-text-font-size-icon--up > span:last-child {
  border-bottom: 6px solid #1d9bf0;
}
.rich-text-font-size-icon--down > span:last-child {
  border-top: 6px solid #1d9bf0;
}
[contenteditable="true"] a[href],
.pr-preview-info a[href],
.rich-text-link-readable a[href] {
  color: #1570ef;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
[contenteditable="true"] a[href]:hover,
.pr-preview-info a[href]:hover,
.rich-text-link-readable a[href]:hover {
  color: #175cd3;
}
.rich-text-link-dialog-backdrop[hidden],
.rich-text-link-popover[hidden] {
  display: none !important;
}
.rich-text-link-dialog-backdrop {
  align-items: center;
  background: rgba(15, 23, 42, 0.4);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 18px;
  position: fixed;
  z-index: 10020;
}
.rich-text-link-dialog {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
  color: #101828;
  display: grid;
  gap: 12px;
  max-width: 420px;
  padding: 14px;
  width: min(420px, 100%);
}
.rich-text-link-dialog__head,
.rich-text-link-dialog__actions {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}
.rich-text-link-dialog__head h3 {
  font-size: 16px;
  margin: 0;
}
.rich-text-link-dialog__close {
  align-items: center;
  background: #f8fbff;
  border: 1px solid #dbe5ef;
  border-radius: 7px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  font-weight: 900;
  height: 28px;
  justify-content: center;
  width: 28px;
}
.rich-text-link-dialog__body {
  display: grid;
  gap: 10px;
}
.rich-text-link-dialog__body label {
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 900;
  gap: 5px;
}
.rich-text-link-dialog__body input {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  font: inherit;
  min-height: 38px;
  padding: 8px 10px;
  width: 100%;
}
.rich-text-link-dialog__body input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.18);
  outline: none;
}
.rich-text-link-dialog__error {
  color: #b42318;
  font-size: 12px;
  font-weight: 800;
  margin: -4px 0 0;
}
.rich-text-link-dialog__actions {
  justify-content: flex-end;
}
.rich-text-link-popover {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 9px;
  box-shadow: 0 16px 42px rgba(15, 23, 42, 0.22);
  color: #101828;
  display: grid;
  gap: 8px;
  max-width: min(340px, calc(100vw - 16px));
  padding: 10px;
  position: fixed;
  z-index: 10021;
}
.rich-text-link-popover__url {
  color: #475467;
  font-size: 12px;
  font-weight: 700;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rich-text-link-popover__actions {
  display: flex;
  gap: 6px;
}
.rich-text-link-popover__actions button {
  background: #f8fbff;
  border: 1px solid #dbe5ef;
  border-radius: 7px;
  color: #101828;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  padding: 6px 8px;
}
.rich-text-link-popover__actions button:hover,
.rich-text-link-popover__actions button:focus-visible {
  border-color: #2ec5ff;
  color: #006aa6;
}

.split-screen-page {
  min-height: 100vh;
}
.split-screen-shell {
  min-height: 100vh;
  width: 100%;
}
.split-screen-context-menu {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.22);
  max-width: min(330px, calc(100vw - 24px));
  min-width: 230px;
  padding: 6px;
  position: fixed;
  z-index: 10080;
}
.split-screen-context-menu[hidden] {
  display: none;
}
.split-screen-context-menu button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: #344054;
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  gap: 10px;
  justify-content: flex-start;
  line-height: 1.3;
  min-height: 36px;
  padding: 8px 10px;
  text-align: left;
  width: 100%;
}
.keshero-context-menu__heading {
  border-bottom: 1px solid #eef2f6;
  display: grid;
  gap: 2px;
  margin: 0 0 5px;
  padding: 7px 8px 9px;
}
.keshero-context-menu__heading strong {
  color: #101828;
  font-size: 13px;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.keshero-context-menu__action-icon {
  fill: none;
  flex: 0 0 auto;
  height: 16px;
  margin-left: auto;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
  width: 16px;
}
.split-screen-context-menu button:hover,
.split-screen-context-menu button:focus-visible {
  background: #f2f4f7;
  color: #101828;
  outline: none;
}
.keshero-context-toast {
  background: #101828;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  bottom: 74px;
  box-shadow: 0 18px 46px rgba(15, 23, 42, 0.28);
  color: #ffffff;
  font-size: 13px;
  font-weight: 850;
  left: 50%;
  max-width: min(620px, calc(100vw - 32px));
  padding: 10px 14px;
  position: fixed;
  text-align: center;
  transform: translateX(-50%);
  z-index: 10120;
}
.keshero-context-toast[hidden] {
  display: none;
}
.keshero-workspace-tabs {
  --keshero-workspace-tabs-right-inset: max(16px, calc(var(--right-drawer-tab-reserve, 0px) - 16px));
  align-items: flex-end;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid #dbe5ef;
  border-radius: 0 0 8px 8px;
  border-top: 0;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
  box-sizing: border-box;
  display: flex;
  gap: 8px;
  /* Share the app-dropdown right edge while retaining a 16px gutter when no drawer rail is present. */
  margin: -18px var(--keshero-workspace-tabs-right-inset) 10px 16px;
  max-width: none;
  min-width: 0;
  overflow: visible;
  padding: 5px 8px;
  width: calc(100% - 16px - var(--keshero-workspace-tabs-right-inset));
}
.keshero-workspace-tabs[hidden] {
  display: none !important;
}
.keshero-workspace-tabs__label {
  align-self: center;
  color: #006aa6;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  padding-bottom: 5px;
}

/* ?? Stacked Ranking calibration workspace ??????????????????????????????? */
.stacked-ranking-workspace {
  box-sizing: border-box;
  margin: 0 auto 36px;
  max-width: 1680px;
  padding: 22px 24px 0;
}

.stacked-ranking-workspace__header,
.stacked-ranking-section-heading,
.stacked-ranking-controls {
  align-items: center;
  display: flex;
  gap: 18px;
  justify-content: space-between;
}

.stacked-ranking-workspace__header {
  align-items: flex-start;
  margin-bottom: 18px;
}

.stacked-ranking-workspace__header h1,
.stacked-ranking-section-heading h2 {
  color: var(--text-color, #101828);
  margin: 0;
}

.stacked-ranking-workspace__header h1 {
  font-size: clamp(22px, 2vw, 30px);
  letter-spacing: -0.025em;
  line-height: 1.15;
}

.stacked-ranking-workspace__header p:not(.stacked-ranking-workspace__eyebrow) {
  color: var(--muted-text, #667085);
  line-height: 1.5;
  margin: 7px 0 0;
  max-width: 780px;
}

.stacked-ranking-workspace__eyebrow {
  color: var(--accent-color, #2563eb);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  margin: 0 0 5px;
  text-transform: uppercase;
}

.stacked-ranking-notice,
.stacked-ranking-empty-state,
.stacked-ranking-rounds,
.stacked-ranking-distribution,
.stacked-ranking-results {
  background: var(--panel-bg, #fff);
  border: 1px solid var(--border-color, #e4e7ec);
  border-radius: 14px;
  box-shadow: 0 2px 5px rgba(16, 24, 40, 0.035);
}

.stacked-ranking-notice {
  margin: 0 0 14px;
  padding: 11px 14px;
}

.stacked-ranking-notice--success {
  background: #ecfdf3;
  border-color: #abefc6;
  color: #027a48;
}

.stacked-ranking-notice--warning {
  background: #fffaeb;
  border-color: #fedf89;
  color: #93370d;
}

.stacked-ranking-empty-state {
  color: var(--muted-text, #667085);
  margin-top: 18px;
  padding: 26px;
}

.stacked-ranking-empty-state h3 {
  color: var(--text-color, #101828);
  margin: 0;
}

.stacked-ranking-empty-state p {
  line-height: 1.5;
  margin: 7px 0 16px;
  max-width: 700px;
}

.stacked-ranking-summary {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0 0 16px;
}

.stacked-ranking-summary__card {
  background: var(--panel-bg, #fff);
  border: 1px solid var(--border-color, #e4e7ec);
  border-radius: 12px;
  display: grid;
  gap: 4px;
  padding: 14px 16px;
}

.stacked-ranking-summary__card span {
  color: var(--muted-text, #667085);
  font-size: 12px;
  font-weight: 700;
}

.stacked-ranking-summary__card strong {
  color: var(--text-color, #101828);
  font-size: 24px;
  font-variant-numeric: tabular-nums;
  line-height: 1.05;
}

.stacked-ranking-rounds,
.stacked-ranking-distribution,
.stacked-ranking-results {
  margin-top: 16px;
  padding: 18px;
}

.stacked-ranking-section-heading {
  align-items: flex-start;
  margin-bottom: 14px;
}

.stacked-ranking-section-heading h2 {
  font-size: 17px;
  line-height: 1.25;
}

.stacked-ranking-section-heading > p,
.stacked-ranking-rounds__hint {
  color: var(--muted-text, #667085);
  font-size: 12.5px;
  line-height: 1.4;
  margin: 2px 0 0;
  max-width: 520px;
}

.stacked-ranking-rounds__list {
  counter-reset: calibration;
  display: flex;
  gap: 0;
  list-style: none;
  margin: 0;
  overflow-x: auto;
  padding: 0;
}

.stacked-ranking-rounds__item {
  flex: 1 0 180px;
  min-width: 0;
  position: relative;
}

.stacked-ranking-rounds__item:not(:last-child)::after {
  background: var(--border-color, #d0d5dd);
  content: "";
  height: 2px;
  left: calc(50% + 27px);
  position: absolute;
  right: calc(-50% + 27px);
  top: 22px;
}

.stacked-ranking-rounds__item a {
  align-items: center;
  color: var(--muted-text, #667085);
  display: grid;
  gap: 6px 9px;
  grid-template-columns: 36px minmax(0, 1fr);
  min-height: 54px;
  position: relative;
  text-decoration: none;
  z-index: 1;
}

.stacked-ranking-rounds__number {
  align-items: center;
  background: var(--subtle-bg, #f2f4f7);
  border: 1px solid var(--border-color, #d0d5dd);
  border-radius: 50%;
  color: var(--muted-text, #667085);
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  height: 36px;
  justify-content: center;
  width: 36px;
}

.stacked-ranking-rounds__name {
  color: inherit;
  font-size: 13px;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stacked-ranking-rounds__role {
  color: var(--accent-color, #2563eb);
  font-size: 11px;
  font-weight: 800;
  grid-column: 2;
  margin-top: -7px;
}

.stacked-ranking-rounds__item.is-current a {
  color: var(--text-color, #101828);
}

.stacked-ranking-rounds__item.is-current .stacked-ranking-rounds__number {
  background: var(--accent-color, #2563eb);
  border-color: var(--accent-color, #2563eb);
  color: #fff;
}

.stacked-ranking-rounds__item.is-editable .stacked-ranking-rounds__number {
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent-color, #2563eb) 18%, transparent);
}

.stacked-ranking-controls {
  align-items: end;
  background: var(--subtle-bg, #f8fafc);
  border: 1px solid var(--border-color, #e4e7ec);
  border-radius: 12px;
  justify-content: flex-start;
  margin-top: 16px;
  padding: 12px;
}

.stacked-ranking-controls label {
  color: var(--muted-text, #475467);
  display: grid;
  font-size: 11px;
  font-weight: 800;
  gap: 5px;
  letter-spacing: 0.01em;
}

.stacked-ranking-controls select {
  background: var(--panel-bg, #fff);
  border: 1px solid var(--border-color, #d0d5dd);
  border-radius: 8px;
  color: var(--text-color, #101828);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  min-height: 36px;
  min-width: 180px;
  padding: 6px 30px 6px 10px;
}

.stacked-ranking-distribution__bands {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.stacked-ranking-distribution__band {
  align-items: center;
  background: var(--subtle-bg, #f8fafc);
  border: 1px solid var(--border-color, #e4e7ec);
  border-radius: 9px;
  display: grid;
  gap: 7px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  padding: 10px;
}

.stacked-ranking-distribution__dot {
  background: var(--ranking-category-color, #667085);
  border-radius: 50%;
  height: 9px;
  width: 9px;
}

.stacked-ranking-distribution__name {
  color: var(--text-color, #344054);
  font-size: 12.5px;
  font-weight: 700;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stacked-ranking-distribution__band strong {
  color: var(--text-color, #101828);
  font-size: 16px;
  font-variant-numeric: tabular-nums;
}

.stacked-ranking-distribution__target {
  color: var(--muted-text, #667085);
  font-size: 11px;
  font-weight: 650;
  grid-column: 2 / -1;
}

.stacked-ranking-results__scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.stacked-ranking-results__table {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12.5px;
  min-width: 1200px;
  width: 100%;
}

.stacked-ranking-results__table th {
  background: var(--subtle-bg, #f8fafc);
  border-bottom: 1px solid var(--border-color, #d0d5dd);
  border-top: 1px solid var(--border-color, #e4e7ec);
  color: var(--muted-text, #475467);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.01em;
  padding: 10px;
  text-align: left;
  text-transform: none;
  white-space: nowrap;
}

.stacked-ranking-results__table th:first-child {
  border-left: 1px solid var(--border-color, #e4e7ec);
  border-radius: 8px 0 0 0;
}

.stacked-ranking-results__table th:last-child {
  border-radius: 0 8px 0 0;
  border-right: 1px solid var(--border-color, #e4e7ec);
}

.stacked-ranking-results__table td {
  border-bottom: 1px solid var(--border-color, #eaecf0);
  color: var(--text-color, #344054);
  padding: 11px 10px;
  vertical-align: top;
}

.stacked-ranking-results__row:hover td {
  background: color-mix(in srgb, var(--accent-color, #2563eb) 3%, transparent);
}

.stacked-ranking-results__row.is-excluded td {
  color: var(--muted-text, #98a2b3);
}

.stacked-ranking-results__rank strong,
.stacked-ranking-results__score {
  color: var(--text-color, #101828);
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  white-space: nowrap;
}

.stacked-ranking-results__rank span {
  color: var(--muted-text, #667085);
  font-size: 11px;
  white-space: nowrap;
}

.stacked-ranking-results__employee {
  min-width: 160px;
}

.stacked-ranking-results__employee > strong {
  color: var(--text-color, #101828);
  display: block;
  font-size: 13px;
  line-height: 1.3;
}

.stacked-ranking-status,
.stacked-ranking-rating {
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.25;
  padding: 4px 7px;
}

.stacked-ranking-status {
  background: var(--subtle-bg, #f2f4f7);
  color: var(--muted-text, #667085);
  margin-top: 5px;
}

.stacked-ranking-status--excluded {
  background: #fef3f2;
  color: #b42318;
}

.stacked-ranking-rating {
  background: rgba(37, 99, 235, 0.1);
  color: #175cd3;
}

.stacked-ranking-rating--recommended {
  background: #eff8ff;
  color: #175cd3;
}

.stacked-ranking-rating--final {
  background: #ecfdf3;
  color: #027a48;
}

.stacked-ranking-score-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  max-width: 230px;
}

.stacked-ranking-score-chips span {
  background: var(--subtle-bg, #f2f4f7);
  border-radius: 5px;
  color: var(--text-color, #475467);
  font-size: 11px;
  padding: 3px 5px;
}

.stacked-ranking-score-chips b {
  font-weight: 800;
}

.stacked-ranking-results__decision {
  min-width: 260px;
}

.stacked-ranking-decision-form {
  display: grid;
  gap: 6px;
}

.stacked-ranking-decision-form select,
.stacked-ranking-decision-form textarea {
  background: var(--panel-bg, #fff);
  border: 1px solid var(--border-color, #d0d5dd);
  border-radius: 7px;
  box-sizing: border-box;
  color: var(--text-color, #101828);
  font: inherit;
  padding: 6px 8px;
  width: 100%;
}

.stacked-ranking-decision-form select {
  font-weight: 650;
  min-height: 34px;
}

.stacked-ranking-decision-form textarea {
  font-size: 12px;
  line-height: 1.35;
  min-height: 48px;
  resize: vertical;
}

.stacked-ranking-decision-form select:focus,
.stacked-ranking-decision-form textarea:focus {
  border-color: var(--accent-color, #2563eb);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-color, #2563eb) 16%, transparent);
  outline: none;
}

.stacked-ranking-decision-form .button-small {
  justify-self: start;
}

.stacked-ranking-decision-form__baseline {
  color: var(--muted-text, #667085);
  font-size: 11px;
  font-weight: 600;
}

.stacked-ranking-history {
  min-width: 92px;
}

.stacked-ranking-history summary {
  color: var(--accent-color, #175cd3);
  cursor: pointer;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.stacked-ranking-history__body {
  background: var(--subtle-bg, #f8fafc);
  border: 1px solid var(--border-color, #e4e7ec);
  border-radius: 8px;
  color: var(--text-color, #475467);
  font-size: 11.5px;
  line-height: 1.4;
  margin-top: 7px;
  min-width: 230px;
  padding: 9px;
}

.stacked-ranking-history__body p {
  margin: 0 0 7px;
}

.stacked-ranking-history__body ol {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 17px;
}

.stacked-ranking-history__body li.is-current {
  color: var(--accent-color, #175cd3);
}

html[data-keshero-theme="dark"] .stacked-ranking-notice--success,
html[data-keshero-theme="dark"] .stacked-ranking-rating--final {
  background: rgba(18, 183, 106, 0.15);
  color: #75e0a7;
}

html[data-keshero-theme="dark"] .stacked-ranking-notice--warning {
  background: rgba(254, 200, 75, 0.14);
  color: #fec84b;
}

html[data-keshero-theme="dark"] .stacked-ranking-rating,
html[data-keshero-theme="dark"] .stacked-ranking-rating--recommended {
  background: rgba(84, 138, 255, 0.18);
  color: #b2ccff;
}

html[data-keshero-theme="dark"] .stacked-ranking-status--excluded {
  background: rgba(240, 68, 56, 0.16);
  color: #fda29b;
}

@media (max-width: 900px) {
  .stacked-ranking-workspace {
    padding: 18px 14px 0;
  }

  .stacked-ranking-workspace__header,
  .stacked-ranking-section-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .stacked-ranking-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stacked-ranking-controls {
    align-items: stretch;
    flex-direction: column;
  }

  .stacked-ranking-controls label,
  .stacked-ranking-controls select {
    width: 100%;
  }
}

@media (max-width: 520px) {
  .stacked-ranking-summary {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .stacked-ranking-summary__card {
    padding: 11px;
  }

  .stacked-ranking-rounds,
  .stacked-ranking-distribution,
  .stacked-ranking-results {
    border-radius: 10px;
    padding: 12px;
  }
}
.keshero-workspace-tabs__list {
  align-items: flex-end;
  display: flex;
  flex: 1 1 auto;
  gap: 2px;
  min-width: 0;
  overflow: visible;
  position: relative;
}
.keshero-workspace-tabs.is-reordering .keshero-workspace-tabs__list {
  cursor: grabbing;
}
.keshero-workspace-tabs__tab {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-bottom: 3px solid transparent;
  border-radius: 8px 8px 0 0;
  color: #1e293b;
  cursor: grab;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 850;
  gap: 7px;
  max-width: 250px;
  min-height: 31px;
  padding: 0 7px 0 12px;
  text-decoration: none;
  touch-action: pan-y;
  transition: transform 0.12s ease, opacity 0.12s ease, box-shadow 0.12s ease;
  user-select: none;
}
.keshero-workspace-tabs__tab[hidden] {
  display: none !important;
}
.keshero-workspace-tabs__tab.is-dragging {
  cursor: grabbing;
  opacity: 0;
  pointer-events: none;
  position: fixed;
}
.keshero-workspace-tabs__tab.is-pointer-dragging {
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.22);
  cursor: grabbing;
  opacity: 0.96;
  transition: none;
  z-index: 10130;
}
.keshero-workspace-tabs__placeholder {
  background: rgba(46, 197, 255, 0.1);
  border: 1px solid rgba(26, 166, 214, 0.42);
  border-bottom: 3px solid var(--keshero-blue);
  border-radius: 8px 8px 0 0;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
  box-sizing: border-box;
  display: inline-flex;
  flex: 0 0 var(--workspace-tab-placeholder-width, 148px);
  min-height: 34px;
  opacity: 1;
}
.keshero-workspace-tabs__tab a {
  color: inherit;
  cursor: pointer;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.keshero-workspace-tabs__tab.is-active {
  background: #ffffff;
  border-color: #cbd5e1;
  border-bottom-color: #2563eb;
  color: #1e293b;
}
.keshero-workspace-tabs__tab.is-pinned {
  background: #ccfbf1;
  border-color: #5eead4;
  color: #115e59;
}
.reporting-expected-control { display:flex; align-items:center; gap:6px; }
.reporting-expected-info { border:0; background:transparent; color:#0284c7; padding:4px; cursor:pointer; font-size:18px; }
.reporting-expected-info:focus-visible { outline:2px solid #0284c7; outline-offset:2px; border-radius:4px; }
.reporting-expected-help { max-width:360px; padding:18px; border:1px solid #cbd5e1; border-radius:10px; color:#334155; background:#fff; box-shadow:0 10px 30px #0f172a26; font-size:13px; line-height:1.5; }
.keshero-workspace-tabs__tab.is-active.is-pinned {
  background: #ccfbf1;
  border-color: #5eead4;
  border-bottom-color: #2563eb;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab:not(.is-pinned) {
  background: #1e293b;
  border-color: #64748b;
  color: #f1f5f9;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab.is-active:not(.is-pinned) {
  border-bottom-color: #60a5fa;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab.is-pinned {
  background: #134e4a;
  border-color: #2dd4bf;
  color: #ccfbf1;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab.is-active.is-pinned {
  background: #134e4a;
  border-color: #2dd4bf;
  border-bottom-color: #60a5fa;
}
.keshero-workspace-tabs__tab button,
.keshero-context-icon-button {
  align-items: center;
  background: #eef2f6;
  border: 1px solid #98a2b3;
  border-radius: 999px;
  color: #475467;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 900;
  height: 19px;
  justify-content: center;
  padding: 0;
  position: relative;
  transition: background-color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
  width: 19px;
}
.keshero-workspace-tabs__tab button.keshero-workspace-tabs__pin,
.keshero-workspace-tabs__overflow-pin {
  /* Quiet circular chrome (same language as close); keep teal hover/pinned distinct */
  background: #eef2f6;
  border-color: #98a2b3;
  color: #475467;
  height: 21px;
  width: 21px;
}
.keshero-workspace-tabs__tab button.keshero-workspace-tabs__pin svg,
.keshero-workspace-tabs__overflow-pin svg {
  fill: currentColor;
  height: 13px;
  width: 13px;
}
.keshero-workspace-tabs__tab.is-pinned button.keshero-workspace-tabs__pin,
.keshero-workspace-tabs__tab button.keshero-workspace-tabs__pin[data-workspace-tab-pinned="true"],
.keshero-workspace-tabs__overflow-pin[data-workspace-tab-pinned="true"] {
  background: #14b8a6;
  border-color: #0f8f83;
  box-shadow: 0 1px 4px rgba(15, 143, 131, 0.32);
  color: #ffffff;
}
.keshero-workspace-tabs__tab button.keshero-workspace-tabs__pin:hover,
.keshero-workspace-tabs__tab button.keshero-workspace-tabs__pin:focus-visible,
.keshero-workspace-tabs__overflow-pin:hover,
.keshero-workspace-tabs__overflow-pin:focus-visible {
  background: #ccfbf1;
  border-color: #2dd4bf;
  box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.12);
  color: #34C38F;
  outline: none;
}
.keshero-context-icon-button {
  height: 24px;
  width: 24px;
}
.keshero-workspace-tabs__tab button span {
  display: block;
  height: 9px;
  position: relative;
  width: 9px;
}
.keshero-context-icon-button span {
  display: block;
  height: 10px;
  position: relative;
  width: 10px;
}
.keshero-workspace-tabs__tab button span::before,
.keshero-workspace-tabs__tab button span::after,
.keshero-context-icon-button span::before,
.keshero-context-icon-button span::after {
  background: currentColor;
  border-radius: 999px;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  top: 50%;
  width: 9px;
}
.keshero-context-icon-button span::before,
.keshero-context-icon-button span::after {
  width: 10px;
}
.keshero-workspace-tabs__tab button span::before,
.keshero-context-icon-button span::before {
  transform: translateY(-50%) rotate(45deg);
}
.keshero-workspace-tabs__tab button span::after,
.keshero-context-icon-button span::after {
  transform: translateY(-50%) rotate(-45deg);
}
.keshero-workspace-tabs__tab button:hover,
.keshero-workspace-tabs__tab button:focus-visible,
.keshero-context-icon-button:hover,
.keshero-context-icon-button:focus-visible {
  background: #fff1f0;
  border-color: #fda29b;
  box-shadow: 0 0 0 3px rgba(240, 68, 56, 0.1);
  color: #b42318;
  outline: none;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab button,
html[data-keshero-theme="dark"] .keshero-context-icon-button,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab button.keshero-workspace-tabs__pin,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-pin {
  background: #1f2937;
  border-color: #64748b;
  color: #cbd5e1;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab.is-pinned button.keshero-workspace-tabs__pin,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab button.keshero-workspace-tabs__pin[data-workspace-tab-pinned="true"],
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-pin[data-workspace-tab-pinned="true"] {
  background: #14b8a6;
  border-color: #5eead4;
  box-shadow: 0 1px 4px rgba(45, 212, 191, 0.4);
  color: #ffffff;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab button.keshero-workspace-tabs__pin:hover,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab button.keshero-workspace-tabs__pin:focus-visible,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-pin:hover,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-pin:focus-visible {
  background: #115e59;
  border-color: #2dd4bf;
  box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.22);
  color: #99f6e4;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab button:hover,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__tab button:focus-visible,
html[data-keshero-theme="dark"] .keshero-context-icon-button:hover,
html[data-keshero-theme="dark"] .keshero-context-icon-button:focus-visible {
  background: #3b1118;
  border-color: #f97066;
  box-shadow: 0 0 0 3px rgba(249, 112, 102, 0.2);
  color: #fda29b;
}
.keshero-workspace-tabs.is-empty {
  align-items: center;
  padding-bottom: 6px;
}
.keshero-workspace-tabs.is-empty .keshero-workspace-tabs__empty {
  padding-bottom: 0;
}
.keshero-workspace-tabs__empty {
  color: #667085;
  font-size: 12px;
  font-weight: 750;
  padding-bottom: 8px;
}
.keshero-workspace-tabs.is-empty .keshero-workspace-tabs__label {
  color: #667085;
}
.keshero-workspace-tabs__overflow {
  align-items: flex-end;
  display: inline-flex;
  flex: 0 0 auto;
  position: relative;
}
.keshero-workspace-tabs__overflow[hidden] {
  display: none !important;
}
.keshero-workspace-tabs__overflow-toggle {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  border-bottom: 3px solid transparent;
  border-radius: 8px 8px 0 0;
  box-sizing: border-box;
  color: #475467;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  gap: 7px;
  min-height: 31px;
  padding: 0 10px;
  transition: background-color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease, color 0.12s ease;
  white-space: nowrap;
}
.keshero-workspace-tabs__overflow-icon {
  display: block;
  fill: currentColor;
  flex: 0 0 auto;
  height: 15px;
  width: 15px;
}
.keshero-workspace-tabs__overflow-toggle em {
  align-items: center;
  background: #e8fbff;
  border: 1px solid #b9e6fe;
  border-radius: 999px;
  box-sizing: border-box;
  color: #0b7894;
  display: inline-flex;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  height: 18px;
  justify-content: center;
  letter-spacing: 0.01em;
  line-height: 1;
  min-width: 18px;
  padding: 0 5px;
}
.keshero-workspace-tabs__overflow.is-open .keshero-workspace-tabs__overflow-toggle,
.keshero-workspace-tabs__overflow-toggle:hover,
.keshero-workspace-tabs__overflow-toggle:focus-visible {
  background: #ffffff;
  border-color: #b9e6fe;
  border-bottom-color: #2ec5ff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
  color: #0b7894;
  outline: none;
}
.keshero-workspace-tabs__overflow.is-open .keshero-workspace-tabs__overflow-toggle em,
.keshero-workspace-tabs__overflow-toggle:hover em,
.keshero-workspace-tabs__overflow-toggle:focus-visible em {
  background: #2ec5ff;
  border-color: #14a8d4;
  color: #ffffff;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-toggle {
  background: #1f2937;
  border-color: #475467;
  color: #cbd5e1;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-toggle em {
  background: rgba(46, 197, 255, 0.16);
  border-color: #38bdf8;
  color: #7dd3fc;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow.is-open .keshero-workspace-tabs__overflow-toggle,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-toggle:hover,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-toggle:focus-visible {
  background: #0b4a6f;
  border-color: #38bdf8;
  border-bottom-color: #38bdf8;
  color: #e0f2fe;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow.is-open .keshero-workspace-tabs__overflow-toggle em,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-toggle:hover em,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-toggle:focus-visible em {
  background: #38bdf8;
  border-color: #7dd3fc;
  color: #0b1220;
}
.keshero-workspace-tabs__overflow-menu {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.16);
  display: grid;
  gap: 2px;
  max-height: min(380px, calc(100vh - 240px));
  max-width: min(340px, calc(100vw - 36px));
  min-width: 240px;
  overflow: auto;
  padding: 4px;
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 10135;
}
.keshero-workspace-tabs__overflow-menu[hidden] {
  display: none !important;
}
.keshero-workspace-tabs__overflow-row {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 6px;
  display: grid;
  gap: 6px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 32px;
  padding: 1px 2px 1px 8px;
}
.keshero-workspace-tabs__overflow-row:has(a:hover),
.keshero-workspace-tabs__overflow-row:has(a:focus-visible) {
  background: #e8fbff;
  border-color: #b9e6fe;
}
.keshero-workspace-tabs__overflow-menu a {
  border: 1px solid transparent;
  border-radius: 6px;
  color: #101828;
  display: block;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.2;
  min-width: 0;
  overflow: hidden;
  padding: 5px 0;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.keshero-workspace-tabs__overflow-menu a:hover,
.keshero-workspace-tabs__overflow-menu a:focus-visible {
  color: #006aa6;
  outline: none;
}
.keshero-workspace-tabs__overflow-row-actions {
  align-items: center;
  display: inline-flex;
  gap: 3px;
}
.keshero-workspace-tabs__overflow-row-actions button {
  align-items: center;
  background: #eef2f6;
  border: 1px solid #98a2b3;
  border-radius: 999px;
  color: #475467;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 18px;
  height: 18px;
  justify-content: center;
  padding: 0;
  width: 18px;
}
.keshero-workspace-tabs__overflow-row-actions button:hover,
.keshero-workspace-tabs__overflow-row-actions button:focus-visible {
  outline: none;
}
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__overflow-pin,
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__pin {
  background: #eef2f6;
  border-color: #98a2b3;
  color: #475467;
}
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__overflow-pin[data-workspace-tab-pinned="true"],
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__pin[data-workspace-tab-pinned="true"] {
  background: #e6fffb;
  border-color: #5eead4;
  color: #34C38F;
}
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__overflow-pin:hover,
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__overflow-pin:focus-visible,
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__pin:hover,
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__pin:focus-visible {
  background: #ccfbf1;
  border-color: #2dd4bf;
  box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.12);
  color: #34C38F;
}
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__overflow-pin svg,
.keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__pin svg {
  fill: currentColor;
  height: 11px;
  width: 11px;
}
.keshero-workspace-tabs__overflow-close span {
  display: block;
  height: 9px;
  position: relative;
  width: 9px;
}
.keshero-workspace-tabs__overflow-close span::before,
.keshero-workspace-tabs__overflow-close span::after {
  background: currentColor;
  border-radius: 999px;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  top: 50%;
  width: 9px;
}
.keshero-workspace-tabs__overflow-close span::before {
  transform: translateY(-50%) rotate(45deg);
}
.keshero-workspace-tabs__overflow-close span::after {
  transform: translateY(-50%) rotate(-45deg);
}
.keshero-workspace-tabs__overflow-close:hover,
.keshero-workspace-tabs__overflow-close:focus-visible {
  background: #fff1f0;
  border-color: #fda29b;
  box-shadow: 0 0 0 3px rgba(240, 68, 56, 0.1);
  color: #b42318;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-row:has(a:hover),
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-row:has(a:focus-visible) {
  background: #0b4a6f;
  border-color: #38bdf8;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-menu a {
  color: #f8fafc;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-row-actions button {
  background: #1f2937;
  border-color: #64748b;
  color: #cbd5e1;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__overflow-pin[data-workspace-tab-pinned="true"],
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__pin[data-workspace-tab-pinned="true"] {
  background: #0f3f3a;
  border-color: #2dd4bf;
  color: #5eead4;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__overflow-pin:hover,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__overflow-pin:focus-visible,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__pin:hover,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-row-actions .keshero-workspace-tabs__pin:focus-visible {
  background: #115e59;
  border-color: #2dd4bf;
  box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.22);
  color: #99f6e4;
}
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-close:hover,
html[data-keshero-theme="dark"] .keshero-workspace-tabs__overflow-close:focus-visible {
  background: #3b1118;
  border-color: #f97066;
  box-shadow: 0 0 0 3px rgba(249, 112, 102, 0.2);
  color: #fda29b;
}
.keshero-workspace-tabs__actions {
  align-items: center;
  align-self: center;
  border-left: 3px solid #98a2b3;
  display: flex;
  flex: 0 0 auto;
  gap: 4px;
  margin-left: 8px;
  padding-left: 12px;
}
.keshero-workspace-tabs.is-empty .keshero-workspace-tabs__actions {
  align-self: center;
}
.keshero-workspace-tabs__actions button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  height: 30px;
  justify-content: center;
  padding: 0;
  width: 30px;
}
.keshero-workspace-tabs__actions button:not([data-workspace-tabs-hide]) {
  height: 34px;
  width: 34px;
}
.keshero-workspace-tabs__action-icon {
  fill: none;
  height: 17px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
  width: 17px;
}
.keshero-workspace-tabs__actions button:not([data-workspace-tabs-hide]) .keshero-workspace-tabs__action-icon {
  height: 20px;
  width: 20px;
}
.keshero-workspace-tabs__actions button:hover,
.keshero-workspace-tabs__actions button:focus-visible,
.keshero-workspace-tabs__actions .keshero-workspace-tabs__action-link:hover,
.keshero-workspace-tabs__actions .keshero-workspace-tabs__action-link:focus-visible {
  background: #e8fbff;
  color: #006aa6;
  outline: none;
}
.keshero-workspace-tabs__actions .keshero-workspace-tabs__action-link[aria-current="page"] {
  background: #e8fbff;
  color: #006aa6;
}
.keshero-workspace-tabs__actions button[data-workspace-tabs-hide],
.keshero-pinned-panel__header [data-pinned-hide] {
  background: #fff7ed;
  border: 1px solid #fb923c;
  border-radius: 8px;
  box-shadow: 0 1px 0 rgba(154, 52, 18, 0.08);
  color: #9a3412;
  font-weight: 900;
}
.keshero-workspace-tabs__actions button[data-workspace-tabs-hide] {
  margin-left: 2px;
}
.keshero-workspace-tabs__actions button[data-workspace-tabs-hide]:hover,
.keshero-workspace-tabs__actions button[data-workspace-tabs-hide]:focus-visible,
.keshero-pinned-panel__header [data-pinned-hide]:hover,
.keshero-pinned-panel__header [data-pinned-hide]:focus-visible {
  background: #ffedd5;
  border-color: #f97316;
  color: #7c2d12;
}
.keshero-workspace-tabs-reveal {
  align-items: center;
  align-self: flex-start;
  background: #e0f2fe;
  border: 1px solid #38bdf8;
  border-radius: 0 0 8px 8px;
  border-top: 0;
  box-shadow: 0 6px 16px rgba(14, 116, 144, 0.16);
  box-sizing: border-box;
  color: #075985;
  cursor: pointer;
  display: inline-flex;
  height: 30px;
  justify-content: center;
  margin: -18px 0 10px 16px;
  padding: 0;
  position: relative;
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
  width: 32px;
  z-index: 3;
}
.keshero-workspace-tabs-reveal[hidden] {
  display: none !important;
}
.keshero-workspace-tabs-reveal .keshero-workspace-tabs__action-icon {
  height: 22px;
  transform: translateY(-1px);
  width: 20px;
}
.keshero-workspace-tabs-reveal:hover,
.keshero-workspace-tabs-reveal:focus-visible {
  background: #0ea5e9;
  border-color: #0284c7;
  box-shadow: 0 8px 18px rgba(2, 132, 199, 0.24);
  color: #ffffff;
  outline: none;
  transform: translateY(-1px);
}
.keshero-pinned-panel-reveal {
  align-items: center;
  background: #0f172a;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 10px 0 0 10px;
  border-right: 0;
  box-shadow: -8px 16px 28px rgba(15, 23, 42, 0.14);
  box-sizing: border-box;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  height: 44px;
  justify-content: center;
  min-height: 44px;
  overflow: hidden;
  padding: 8px;
  position: fixed;
  right: 0;
  top: 40%;
  transform: translateY(-50%);
  width: 42px;
  z-index: 10105;
}
.keshero-pinned-panel-reveal[hidden] {
  display: none !important;
}
.keshero-pinned-panel-reveal__icon {
  display: block;
  height: 20px;
  width: 20px;
}
.keshero-pinned-panel-reveal:hover,
.keshero-pinned-panel-reveal:focus-visible {
  background: #1e293b;
  outline: 2px solid #2ec5ff;
  outline-offset: 2px;
}
.keshero-pinned-panel-reveal.progress-summary-drawer__tab--pinned {
  border-radius: 10px 0 0 10px;
  top: 40px;
  transform: none;
}
.progress-summary-drawer__tab--notepad {
  border-radius: 10px 0 0 0;
}
.progress-summary-drawer__tab:has(.progress-summary-drawer__tab-badge[hidden]) > span:not(.progress-summary-drawer__tab-badge) {
  transform: none !important;
}
.keshero-context-rail {
  display: none !important;
}
.keshero-frame-drawer,
.keshero-pinned-panel,
.keshero-context-panel,
.keshero-save-workspace {
  position: fixed;
  z-index: 10100;
}
.keshero-frame-drawer[hidden],
.keshero-pinned-panel[hidden],
.keshero-context-panel[hidden],
.keshero-save-workspace[hidden],
.keshero-peek-preview[hidden] {
  display: none;
}
.keshero-frame-drawer {
  inset: 0;
}
.keshero-frame-drawer__backdrop {
  background: rgba(15, 23, 42, 0.22);
  inset: 0;
  position: absolute;
}
.keshero-save-workspace {
  display: grid;
  inset: 0;
  place-items: center;
}
.keshero-save-workspace__backdrop {
  background: rgba(15, 23, 42, 0.28);
  inset: 0;
  position: absolute;
}
.keshero-save-workspace__dialog {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.26);
  display: grid;
  gap: 14px;
  max-width: calc(100vw - 28px);
  overflow: hidden;
  position: relative;
  width: min(520px, calc(100vw - 28px));
}
.keshero-save-workspace__dialog header {
  align-items: flex-start;
  background: var(--topbar-banner-background, linear-gradient(90deg, #d8ecff 0%, #c8f1ff 100%));
  border-bottom: 1px solid var(--topbar-banner-border, #60a5fa);
  color: var(--topbar-banner-text, #0f172a);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 14px;
}
.keshero-save-workspace__dialog header div {
  display: grid;
  gap: 3px;
}
.keshero-save-workspace__dialog header strong {
  color: inherit;
  font-size: 18px;
  font-weight: 950;
}
.keshero-save-workspace__dialog header span {
  color: var(--topbar-banner-muted, #475467);
  font-size: 13px;
  font-weight: 800;
}
.keshero-save-workspace__dialog label {
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 900;
  gap: 7px;
  padding: 0 14px;
}
.keshero-save-workspace__dialog input {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  min-height: 38px;
  padding: 8px 10px;
  width: 100%;
}
.keshero-save-workspace__dialog input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.18);
  outline: none;
}
.keshero-save-workspace__summary {
  display: grid;
  gap: 8px;
  padding: 0 14px;
}
.keshero-save-workspace__summary div {
  background: #f8fbff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 2px;
  padding: 9px;
}
.keshero-save-workspace__summary span {
  color: #667085;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.keshero-save-workspace__summary strong {
  color: #101828;
  font-size: 12px;
  font-weight: 850;
  overflow-wrap: anywhere;
}
.keshero-save-workspace__actions {
  border-top: 1px solid #eef2f6;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding: 12px 14px 14px;
}
.keshero-frame-drawer__panel {
  background: #ffffff;
  border-left: 1px solid #dbe5ef;
  box-shadow: -18px 0 44px rgba(15, 23, 42, 0.18);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100%;
  margin-left: auto;
  max-width: min(760px, calc(100vw - 18px));
  min-width: min(560px, calc(100vw - 18px));
  position: relative;
}
.keshero-frame-drawer__header,
.keshero-pinned-panel__header,
.keshero-peek-preview__header,
.keshero-context-panel__header {
  background: var(--topbar-banner-background, linear-gradient(90deg, #d8ecff 0%, #c8f1ff 100%));
  border-bottom: 1px solid var(--topbar-banner-border, #60a5fa);
  color: var(--topbar-banner-text, #0f172a);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 14px;
}
.keshero-frame-drawer__header > div:first-child,
.keshero-pinned-panel__header > div:first-child,
.keshero-peek-preview__header > div:first-child,
.keshero-context-panel__header > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.keshero-frame-drawer__header strong,
.keshero-pinned-panel__header strong,
.keshero-peek-preview__header strong,
.keshero-context-panel__header strong {
  color: inherit;
  font-size: 17px;
  font-weight: 950;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.keshero-frame-drawer__header span,
.keshero-pinned-panel__header span,
.keshero-peek-preview__header span,
.keshero-context-panel__header span {
  color: var(--topbar-banner-muted, #475467);
  font-size: 12px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.keshero-pinned-panel__header,
.keshero-context-panel__header {
  align-items: center;
  padding: 8px 10px;
}
.keshero-pinned-panel__header strong,
.keshero-context-panel__header strong {
  font-size: 15px;
}
.keshero-pinned-panel__header span,
.keshero-context-panel__header span {
  font-size: 11px;
}
.keshero-pinned-panel__header-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
}
.keshero-pinned-panel__header-actions .button-small,
.keshero-context-panel__header > .button-small {
  align-self: center;
  height: 28px;
  line-height: 1;
  min-height: 28px;
  padding: 4px 8px;
}
.keshero-frame-drawer__actions,
.keshero-peek-preview__actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
}
.keshero-frame-drawer iframe,
.keshero-pinned-panel iframe,
.keshero-peek-preview iframe {
  border: 0;
  height: 100%;
  min-height: 0;
  width: 100%;
}
.keshero-peek-preview {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 22px 56px rgba(15, 23, 42, 0.24);
  display: grid;
  grid-template-rows: auto 360px;
  max-height: min(520px, calc(100vh - 28px));
  overflow: hidden;
  position: fixed;
  z-index: 10110;
}
.keshero-peek-preview__header {
  padding: 10px 12px;
}
.keshero-pinned-panel {
  background: #ffffff;
  border-left: 1px solid #dbe5ef;
  box-shadow: -16px 0 40px rgba(15, 23, 42, 0.16);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  height: 100vh;
  right: 0;
  top: 0;
  width: min(540px, calc(100vw - 18px));
}
.keshero-pinned-panel__list {
  background: #f8fbff;
  border-bottom: 1px solid #dbe5ef;
  padding: 10px;
}
.keshero-pinned-panel__selector {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}
.keshero-pinned-panel__selector select {
  appearance: none;
  background-color: #ffffff;
  background-image: var(--app-dropdown-arrow-icon);
  background-position: right 10px center;
  background-repeat: no-repeat;
  background-size: 14px 14px;
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  box-sizing: border-box;
  color: #101828;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  height: 38px;
  min-width: 0;
  padding: 7px 34px 7px 10px;
  width: 100%;
}
.keshero-pinned-panel__selector select:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  outline: none;
}
.keshero-pinned-panel__selector .keshero-context-icon-button {
  height: 34px;
  width: 34px;
}
.keshero-context-panel__item strong {
  color: #101828;
  font-size: 13px;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.keshero-context-panel__item span {
  color: #667085;
  font-size: 11px;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.keshero-context-panel {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 10px;
  box-shadow: 0 22px 56px rgba(15, 23, 42, 0.22);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  max-height: min(620px, var(--keshero-context-panel-max-height, calc(100vh - 220px)));
  overflow: hidden;
  right: 18px;
  top: var(--keshero-context-panel-top, 188px);
  width: min(430px, calc(100vw - 36px));
}
.keshero-context-panel__header {
  padding: 8px 10px;
}
.keshero-context-panel__body {
  display: grid;
  gap: 8px;
  overflow: auto;
  padding: 12px;
}
.keshero-context-panel__item {
  align-items: center;
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 9px;
}
.keshero-context-panel__item--editing {
  align-items: stretch;
  grid-template-columns: minmax(0, 1fr);
}
.keshero-context-panel__item a {
  display: grid;
  gap: 2px;
  min-width: 0;
  text-decoration: none;
}
.keshero-context-panel__item-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}
.keshero-context-panel__item-actions [data-context-remove-pinned] {
  background: #fff5f5;
  border-color: #fecaca;
  color: #b42318;
}
.keshero-context-panel__rename {
  color: #344054;
  display: grid;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
  min-width: 0;
}
.keshero-context-panel__rename input {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  min-height: 36px;
  padding: 7px 9px;
  width: 100%;
}
.keshero-context-panel__rename input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.16);
  outline: none;
}
.keshero-context-panel__rename span {
  color: #667085;
  font-size: 11px;
  font-weight: 750;
  overflow-wrap: anywhere;
}
.keshero-context-panel__item:hover {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.12);
  outline: none;
}
.keshero-context-empty {
  color: #667085;
  font-size: 12px;
  font-weight: 750;
  margin: 0;
}
.keshero-context-panel__footer {
  display: flex;
  justify-content: flex-end;
  padding-top: 6px;
}
.split-screen-workspace {
  box-sizing: border-box;
  display: grid;
  gap: 12px;
  margin: 14px 0 24px;
  max-width: none;
  padding: 0 12px;
  width: 100%;
}
.split-screen-toolbar {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 12px 34px rgba(15, 23, 42, 0.08);
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 12px 14px;
}
.split-screen-toolbar > div:first-child {
  display: grid;
  gap: 2px;
}
.split-screen-toolbar strong {
  color: #101828;
  font-size: 16px;
  font-weight: 900;
}
.split-screen-toolbar span {
  color: #667085;
  font-size: 13px;
  font-weight: 700;
}
.split-screen-toolbar__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}
.split-screen-toolbar__divider {
  align-self: stretch;
  background: #d0d5dd;
  flex: 0 0 1px;
  margin: 4px 2px;
  width: 1px;
}
.split-screen-toolbar__swap {
  align-items: center;
  appearance: none;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  flex-shrink: 0;
  height: var(--app-control-height, 38px);
  justify-content: center;
  min-height: var(--app-control-height, 38px);
  min-width: var(--app-control-height, 38px);
  padding: 0;
  width: var(--app-control-height, 38px);
  -webkit-appearance: none;
}
.split-screen-toolbar__swap:hover,
.split-screen-toolbar__swap:focus-visible {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.18);
  color: #006aa6;
  outline: none;
}
.split-screen-toolbar__swap svg {
  height: 18px;
  width: 18px;
}
.split-screen-toolbar__actions .button-small {
  min-height: 34px;
  padding: 7px 12px !important;
}
.split-screen-panes {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  min-height: calc(100vh - 260px);
  width: 100%;
}
.split-screen-pane {
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 8px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.10);
  display: grid;
  grid-template-rows: auto minmax(520px, 1fr);
  min-width: 0;
  overflow: hidden;
}
.split-screen-pane__bar {
  background: #f8fbff;
  border-bottom: 1px solid #dbe5ef;
  display: grid;
  gap: 8px;
  padding: 10px;
}
.split-screen-pane__title {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
}
.split-screen-pane__title span {
  color: #006aa6;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.split-screen-pane__title b {
  color: #101828;
  font-size: 13px;
  max-width: 70%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.split-screen-pane__controls {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  width: 100%;
}
.split-screen-pane__icon {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dbe5ef;
  border-radius: 7px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  height: 30px;
  justify-content: center;
  padding: 0;
  width: 30px;
}
.split-screen-pane__icon:hover,
.split-screen-pane__icon:focus-visible {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.18);
  color: #006aa6;
  outline: none;
}
.split-screen-pane__icon:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}
.split-screen-pane__icon:disabled:hover,
.split-screen-pane__icon:disabled:focus-visible {
  border-color: #dbe5ef;
  box-shadow: none;
  color: #344054;
}
.split-screen-pane__icon.split-screen-pane__icon--close {
  border-color: #fecdca;
  color: #b42318;
  margin-left: auto;
}
.split-screen-pane__icon.split-screen-pane__icon--close:hover,
.split-screen-pane__icon.split-screen-pane__icon--close:focus-visible {
  background: #fef3f2;
  border-color: #fecdca;
  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.12);
  color: #912018;
  outline: none;
}
.split-screen-pane__icon svg {
  fill: currentColor;
  height: 17px;
  width: 17px;
}
.split-screen-pane__icon.split-screen-pane__icon--close svg,
.split-screen-pane__icon.split-screen-pane__icon--close svg path {
  fill: none;
  stroke: currentColor;
}
.split-screen-pane__address {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}
.split-screen-pane__address input {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  font-size: 13px;
  min-height: 34px;
  padding: 7px 10px;
  width: 100%;
}
.split-screen-pane__address input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.18);
  outline: none;
}
.split-screen-pane iframe {
  border: 0;
  height: 100%;
  min-height: 520px;
  width: 100%;
}
@media (max-width: 980px) {
  .split-screen-toolbar {
    align-items: stretch;
    flex-direction: column;
  }
  .split-screen-toolbar__actions {
    justify-content: flex-start;
  }
  .split-screen-panes {
    grid-template-columns: 1fr;
  }
}
/* Admin cycles filter: keep search, cycle type, and cycle status on one row on desktop. */
#adminCyclesFilterForm.admin-cycle-filter-form.app-filter-bar {
  align-items: end !important;
  display: grid !important;
  flex-direction: initial !important;
  grid-template-columns: minmax(0, 1fr) minmax(230px, max-content) minmax(230px, max-content) auto !important;
  overflow: visible !important;
  width: 100% !important;
}

#adminCyclesFilterForm .admin-cycle-search-field,
#adminCyclesFilterForm .admin-cycle-search-field input,
#adminCyclesFilterForm .keshboard-drawer__multiselect,
#adminCyclesFilterForm .keshboard-drawer__multiselect summary {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}

@media (max-width: 760px) {
  #adminCyclesFilterForm.admin-cycle-filter-form.app-filter-bar {
    grid-template-columns: 1fr !important;
  }
}

.surveys-pulse-response-form {
  align-items: end;
  background: #f8fbff;
  border: 1px solid #d8e6f5;
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin-top: 12px;
  padding: 12px;
}

.surveys-pulse-response-form__field,
.surveys-pulse-response-form__choices {
  border: 0;
  display: grid;
  gap: 6px;
  margin: 0;
  min-width: 0;
  padding: 0;
}

.surveys-pulse-response-form__field--wide {
  grid-column: 1 / -1;
}

.surveys-pulse-response-form__field span,
.surveys-pulse-response-form__choices legend {
  color: #344054;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.2;
}

.surveys-pulse-response-form input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
.surveys-pulse-response-form select,
.surveys-pulse-response-form textarea {
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  color: #101828;
  font: inherit;
  min-height: 36px;
  padding: 7px 9px;
  width: 100%;
}

.surveys-pulse-response-form__choices label {
  align-items: center;
  display: inline-flex;
  gap: 6px;
}

.surveys-pulse-response-form__choices input {
  min-height: 0;
  width: auto;
}

.surveys-pulse-response-form button {
  justify-self: start;
}

.required-indicator {
  color: #d92d20 !important;
  font-weight: 900;
}

.surveys-pulse-response-form__choices--thumbs {
  align-items: start;
  grid-template-columns: repeat(2, minmax(142px, 170px));
}

.surveys-pulse-response-form__choices--thumbs legend {
  grid-column: 1 / -1;
}

.surveys-pulse-response-form__choices--thumbs .surveys-thumb-choice {
  display: block;
}

.surveys-pulse-response-form__choices--thumbs input[type="radio"] {
  height: 1px;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 1px;
}

.surveys-thumb-choice__button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfe0f3;
  border-radius: 10px;
  color: #475467;
  cursor: pointer;
  display: inline-flex;
  gap: 8px;
  min-height: 42px;
  padding: 8px 10px;
  transition: background 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, color 0.14s ease;
  width: 100%;
}

.surveys-thumb-choice__button svg {
  fill: none;
  flex: 0 0 22px;
  height: 22px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
  width: 22px;
}

.surveys-thumb-choice__button span {
  color: inherit;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.surveys-thumb-choice input[type="radio"]:focus-visible + .surveys-thumb-choice__button {
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.22);
  outline: none;
}

.surveys-thumb-choice input[type="radio"]:checked + .surveys-thumb-choice__button {
  border-color: #2ec5ff;
  box-shadow: 0 8px 18px rgba(46, 197, 255, 0.14);
  color: #0876a3;
}

.surveys-thumb-choice input[type="radio"]:checked + .surveys-thumb-choice__button svg {
  fill: currentColor;
}

.surveys-thumb-choice input[value="UP"]:checked + .surveys-thumb-choice__button {
  background: #ecfdf3;
  border-color: #34c38f;
  color: #027a48;
}

.surveys-thumb-choice input[value="DOWN"]:checked + .surveys-thumb-choice__button {
  background: #fff5f5;
  border-color: #f97066;
  color: #b42318;
}

@media (max-width: 760px) {
  .surveys-pulse-response-form__choices--thumbs {
    grid-template-columns: 1fr;
  }
}

/* Administration cycles filter: labeled multi-select with an external reset action. */
#adminCyclesFilterForm.admin-cycle-filter-form.app-filter-bar {
  grid-template-columns: minmax(0, 1fr) minmax(230px, 270px) minmax(230px, 270px) auto !important;
}

#adminCyclesFilterForm .admin-cycle-filter-actions {
  align-items: center;
  align-self: end;
  display: inline-flex;
  gap: 8px;
}

#adminCyclesFilterForm .admin-cycle-filter-apply {
  min-height: var(--app-control-height, 38px);
  padding: 8px 16px;
}

#adminCyclesFilterForm .admin-cycle-type-field,
#adminCyclesFilterForm .admin-cycle-status-field {
  display: grid;
  gap: 5px;
  min-width: 230px;
  overflow: visible;
  position: relative;
}

#adminCyclesFilterForm .admin-cycle-type-field__label,
#adminCyclesFilterForm .admin-cycle-status-field__label {
  color: var(--app-table-header-text, #344054);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
}

#adminCyclesFilterForm .admin-cycle-type-field:has(.ks-dropdown.is-open),
#adminCyclesFilterForm .admin-cycle-status-field:has(.ks-dropdown.is-open) {
  z-index: 40;
}

#adminCyclesFilterForm .ks-dropdown {
  align-self: auto;
  display: block;
  margin: 0;
  position: relative;
  width: 100%;
}

#adminCyclesFilterForm .admin-cycle-filter-reset {
  align-items: center;
  align-self: end;
  background: #ffffff;
  border: 1px solid #cfd8e3;
  border-radius: var(--app-radius-control, 7px);
  color: #344054;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  justify-content: center;
  min-height: var(--app-control-height, 38px);
  padding: 8px 14px;
  text-decoration: none;
}

#adminCyclesFilterForm .admin-cycle-filter-reset:hover {
  background: #f8fafc;
  border-color: #98a2b3;
  color: #1d2939;
}

@media (max-width: 760px) {
  #adminCyclesFilterForm.admin-cycle-filter-form.app-filter-bar {
    grid-template-columns: 1fr !important;
  }

  #adminCyclesFilterForm .admin-cycle-type-field,
  #adminCyclesFilterForm .admin-cycle-status-field {
    min-width: 0;
  }

  #adminCyclesFilterForm .admin-cycle-filter-actions {
    justify-self: start;
  }
}

/* Neutral Archive Actions */
.button-archive,
a.button-archive,
button.button-archive {
  background: #f2f4f7 !important;
  border-color: #d0d5dd !important;
  box-shadow: none !important;
  color: #475467 !important;
}

.button-archive:hover,
a.button-archive:hover,
button.button-archive:hover {
  background: #e4e7ec !important;
  border-color: #c5cbd5 !important;
  box-shadow: none !important;
  color: #344054 !important;
  transform: none !important;
}

.button-archive:focus-visible,
a.button-archive:focus-visible,
button.button-archive:focus-visible {
  box-shadow: 0 0 0 3px rgba(71, 84, 103, 0.18) !important;
  outline: none;
}

/* Archived Readiness Development History */
.pm-readiness-archive-development-items {
  border-top: 1px solid #eaecf0;
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
}

.pm-readiness-archive-development-items__head,
.pm-readiness-archive-development-item__head {
  align-items: baseline;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.pm-readiness-archive-development-items__head h4 {
  color: #344054;
  font-size: 13px;
  margin: 0;
}

.pm-readiness-archive-development-items__head > span,
.pm-readiness-archive-development-item__head > div > span,
.pm-readiness-archive-development-item__count,
.pm-readiness-archive-development-item__empty,
.pm-readiness-archive-development-item__step-due {
  color: #667085;
  font-size: 12px;
}

.pm-readiness-archive-development-items__list {
  display: grid;
  gap: 8px;
}

.pm-readiness-archive-development-item {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 10px;
}

.pm-readiness-archive-development-item__head > div {
  display: grid;
  gap: 2px;
}

.pm-readiness-archive-development-item__head strong {
  color: #344054;
  font-size: 13px;
}

.pm-readiness-archive-development-item__count {
  font-weight: 700;
  white-space: nowrap;
}

.pm-readiness-archive-development-item__steps {
  display: grid;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.pm-readiness-archive-development-item__step {
  align-items: center;
  color: #667085;
  display: flex;
  font-size: 12px;
  gap: 7px;
}

.pm-readiness-archive-development-item__step.is-complete {
  color: #475467;
}

.pm-readiness-archive-development-item__step-state {
  align-items: center;
  border: 1px solid #98a2b3;
  border-radius: 50%;
  color: #667085;
  display: inline-flex;
  flex: 0 0 15px;
  font-size: 10px;
  height: 15px;
  justify-content: center;
  width: 15px;
}

.pm-readiness-archive-development-item__step.is-complete .pm-readiness-archive-development-item__step-state {
  background: var(--app-complete-circle-bg, #12b76a);
  border-color: var(--app-complete-circle-border, #12b76a);
  color: transparent;
}

.pm-readiness-archive-development-item__step-due {
  margin-left: 4px;
}

.pm-readiness-archive-development-item__empty {
  margin: 0;
}

@media (max-width: 640px) {
  .pm-readiness-archive-development-items__head,
  .pm-readiness-archive-development-item__head {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }
}
/* Shared filter field titles (Development Plan, Tasks, Skills, Check-ins, etc.) */
.pm-manage-filter-dd-label {
  color: var(--app-label-color, #344054);
  display: block;
  font-family: inherit;
  font-size: var(--app-label-font-size, 12px);
  font-weight: var(--app-label-font-weight, 800);
  height: 18px;
  letter-spacing: normal;
  line-height: 18px;
  margin: 0;
  overflow: hidden;
  padding: 0;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
}

.pm-manage-filters .pm-manage-filter-field--date > .ks-field,
.keshboard-drawer__filters .keshboard-drawer__filter-field--date > .ks-field {
  gap: 5px;
  width: 100%;
}

.pm-manage-filters .pm-manage-filter-field--date .ks-field__label,
.keshboard-drawer__filters .keshboard-drawer__filter-field--date .ks-field__label {
  height: 18px;
  line-height: 18px;
  overflow: hidden;
}

.pm-manage-filters .pm-manage-filter-field--date .ks-field__control,
.keshboard-drawer__filters .keshboard-drawer__filter-field--date .ks-field__control {
  box-sizing: border-box;
  height: var(--app-control-height, 38px);
  max-height: var(--app-control-height, 38px);
  min-height: var(--app-control-height, 38px);
  width: 100%;
}

.pm-manage-filters .pm-manage-filter-field--time-range,
.keshboard-drawer__filters .keshboard-drawer__filter-field--time-range {
  min-width: 0;
}

.pm-manage-filters .pm-manage-filter-field > .ks-dropdown,
.keshboard-drawer__filters .keshboard-drawer__filter-field > .ks-dropdown {
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.pm-manage-filters .pm-manage-filter-field > .ks-dropdown .ks-dropdown__trigger,
.keshboard-drawer__filters .keshboard-drawer__filter-field > .ks-dropdown .ks-dropdown__trigger {
  box-sizing: border-box;
  height: var(--app-control-height, 38px);
  max-height: var(--app-control-height, 38px);
  min-height: var(--app-control-height, 38px);
  width: 100%;
}

.pm-manage-filters .pm-manage-filter-field > .ks-dropdown [data-ks-dropdown-label],
.keshboard-drawer__filters .keshboard-drawer__filter-field > .ks-dropdown [data-ks-dropdown-label] {
  line-height: 1.2;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  padding: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Skills & Qualifications (Growth & Development) */
.development-plan-skills {
  box-sizing: border-box;
  display: grid;
  gap: 14px;
}
.skills-tools-band {
  display: grid;
  gap: 10px;
  margin: 0;
  min-width: 0;
  padding: 0;
  border-bottom: 0;
}
.skills-tools-band + .skills-inventory {
  margin-top: 10px;
}
.skills-role-matcher__heading {
  align-items: center;
  display: grid;
  gap: 12px 16px;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 320px);
}
.skills-role-matcher__intro {
  align-items: center;
  display: flex;
  gap: 10px;
  min-width: 0;
}
.skills-role-matcher__intro > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.skills-collapsible-section__lead {
  align-items: center;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  gap: 10px;
  min-width: 0;
}
.skills-inventory__label-row {
  align-items: center;
  display: flex;
  gap: 10px;
  min-width: 0;
}
.skills-collapsible-section__lead:hover .skills-section-collapse-toggle.app-disclosure-chevron {
  --app-disclosure-chevron-color: #101828;
  background: #f2f4f7;
}
.skills-inventory__label-row .skills-inventory__label {
  flex: 1 1 auto;
  margin: 0;
  min-width: 0;
}
.skills-inventory__actions {
  align-items: center;
  display: flex;
  flex: 0 1 auto;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  margin-left: auto;
}
.skills-section-collapse-toggle.app-disclosure-chevron {
  --app-disclosure-chevron-color: #475467;
  --app-disclosure-chevron-size: 7px;
  --app-disclosure-chevron-thickness: 2px;
  background: transparent;
  border: 0;
  border-radius: 6px;
  cursor: pointer;
  flex: 0 0 auto;
  height: 28px;
  margin: 0;
  padding: 0;
  width: 28px;
}
.skills-section-collapse-toggle.app-disclosure-chevron:hover {
  --app-disclosure-chevron-color: #101828;
  background: #f2f4f7;
}
.skills-section-collapse-toggle.app-disclosure-chevron:focus-visible {
  outline: 2px solid #98a2b3;
  outline-offset: 1px;
}
.skills-collapsible-section.is-collapsed .skills-collapsible-section__body,
.skills-collapsible-section.is-collapsed .skills-collapsible-section__aside {
  display: none;
}
.skills-collapsible-section__body {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.skills-role-matcher__intro h3 {
  color: #101828;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.3;
  margin: 0;
}
.skills-role-matcher__intro p {
  color: #475467;
  font-size: 12px;
  line-height: 1.35;
  margin: 0;
  max-width: 52ch;
}
.skills-readiness-disclosure.skills-role-matcher__more {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  margin: 0;
  overflow: clip;
}

.skills-readiness-disclosure.skills-role-matcher__more > summary {
  align-items: center;
  background: #f8fafc;
  border-radius: 10px;
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  gap: 10px;
  list-style: none;
  margin: 0;
  min-height: 50px;
  padding: 10px 14px;
}

.skills-readiness-disclosure.skills-role-matcher__more > summary::before,
.skills-readiness-disclosure.skills-role-matcher__more > summary::-webkit-details-marker {
  border: 0 !important;
  content: none !important;
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  width: 0 !important;
}

.skills-readiness-disclosure.skills-role-matcher__more > summary:hover {
  background: #eef2f6;
}

.skills-readiness-disclosure.skills-role-matcher__more > summary > .skills-role-matcher__more-title,
.skills-readiness-disclosure.skills-role-matcher__more > summary > span:last-child {
  color: #101828;
  display: block;
  flex: 1 1 auto;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.3;
  min-width: 0;
}

.skills-readiness-disclosure.skills-role-matcher__more > summary > .skills-section-collapse-toggle.app-disclosure-chevron {
  --app-disclosure-chevron-color: #475467;
  --app-disclosure-chevron-size: 7px;
  --app-disclosure-chevron-thickness: 2px;
  flex: 0 0 auto;
  height: 28px;
  margin: 0;
  pointer-events: none;
  width: 28px;
}

.skills-readiness-disclosure.skills-role-matcher__more > summary:hover > .skills-section-collapse-toggle.app-disclosure-chevron {
  --app-disclosure-chevron-color: #101828;
  background: #f2f4f7;
}

.skills-readiness-disclosure.skills-role-matcher__more[open] > summary > .skills-section-collapse-toggle.app-disclosure-chevron::before {
  transform: rotate(45deg);
}

.skills-readiness-disclosure.skills-role-matcher__more[open] {
  background: #fff;
  border-color: #98a2b3;
  border-radius: 10px;
  overflow: clip;
}

.skills-readiness-disclosure.skills-role-matcher__more[open] > summary {
  background: #eef2f6;
  border-bottom: 1px solid #d0d5dd;
  border-radius: 0;
  margin: 0;
  padding: 10px 14px;
}

.skills-readiness-disclosure[open]:not(.skills-role-matcher__more) {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  overflow: clip;
}

.skills-readiness-disclosure[open]:not(.skills-role-matcher__more) > summary {
  background: #f8fafc;
  border-bottom: 1px solid #eaecf0;
  border-radius: 0;
  margin: 0;
  padding: 10px 12px;
}
.skills-inventory__label {
  color: #101828;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.3;
  margin: 0;
}
.team-skill-search__head-actions {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
}
.skills-inventory {
  display: grid;
  gap: 12px;
  min-width: 0;
}
.skills-inventory.skills-collapsible-section {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  gap: 0;
  overflow: clip;
  padding: 0;
}
.skills-inventory.skills-collapsible-section > .skills-inventory__label-row {
  align-items: center;
  background: #f8fafc;
  border-bottom: 1px solid #eaecf0;
  border-radius: 10px 10px 0 0;
  box-sizing: border-box;
  display: flex;
  gap: 10px;
  min-height: 50px;
  min-width: 0;
  padding: 10px 14px;
}
.skills-inventory.skills-collapsible-section.is-collapsed > .skills-inventory__label-row {
  border-bottom: 0;
  border-radius: 10px;
}
.skills-inventory.skills-collapsible-section > .skills-collapsible-section__body {
  gap: 12px;
  min-width: 0;
  padding: 12px 14px 14px;
}
.skills-inventory__empty {
  background: transparent;
  border: 0;
  box-shadow: none;
  margin: 0;
  min-height: 0;
  padding: 10px 0;
}
.skills-inventory__empty > p {
  color: #667085;
  font-size: 13px;
  margin: 0;
}
.skills-role-relevance {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  display: grid;
  gap: 0;
  overflow: clip;
  padding: 0;
}
.skills-role-relevance__heading,
.skills-role-matcher__heading {
  align-items: center;
  background: #f8fafc;
  border-bottom: 1px solid #eaecf0;
  box-sizing: border-box;
  display: grid;
  gap: 10px 16px;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 320px);
  min-height: 50px;
  padding: 10px 14px;
}
.skills-collapsible-section.is-collapsed .skills-role-matcher__heading,
.skills-collapsible-section.is-collapsed .skills-role-relevance__heading,
.skills-collapsible-section.is-collapsed .skills-team-readiness__heading {
  border-bottom: 0;
  grid-template-columns: minmax(0, 1fr);
}
.skills-collapsible-section.is-collapsed .skills-role-matcher__intro > div > p,
.skills-collapsible-section.is-collapsed .skills-role-matcher__intro p {
  display: none;
}
.skills-role-relevance > .skills-collapsible-section__body,
.skills-team-readiness > .skills-collapsible-section__body {
  padding: 12px 14px;
}
.skills-role-relevance__heading h3,
.skills-role-relevance__heading p {
  margin: 0;
}
.skills-role-relevance__heading h3,
.skills-role-matcher__intro h3,
.skills-role-relevance__heading .skills-role-matcher__intro h3,
.skills-team-readiness__heading .skills-role-matcher__intro h3 {
  color: #101828;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.3;
  margin: 0;
}
.skills-role-relevance__heading p,
.skills-role-matcher__intro p {
  color: #475467;
  font-size: 12px;
  line-height: 1.35;
  margin: 0;
  max-width: 52ch;
}
.skills-role-relevance__status,
.skills-role-relevance__empty {
  color: #475467;
  font-size: 13px;
  margin: 0;
}
.skills-role-relevance__picker {
  display: grid;
  gap: 5px;
}
.skills-role-relevance__picker > span {
  color: #344054;
  font-size: 12px;
  font-weight: 800;
}
.skills-role-relevance__picker select {
  width: 100%;
}
.performance-review-self-scale__move {
  align-items: center;
  display: inline-flex;
  font-size: 10px;
  height: 32px;
  justify-content: center;
  line-height: 1;
  min-width: 32px;
  padding: 0;
  width: 32px;
}
.performance-review-self-scale__move:not(:disabled):hover {
  border-color: #98a2b3;
  color: #075985;
}
.skills-role-relevance__status {
  background: transparent;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
}
.skills-role-relevance__status.is-error {
  background: #fef3f2;
  border: 1px solid #fecdca;
  border-radius: 8px;
  color: #b42318;
  padding: 8px 10px;
}
.skills-role-relevance__summary {
  align-items: flex-start;
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 11px 12px;
}
.skills-role-relevance__summary > div {
  display: grid;
  gap: 2px;
}
.skills-role-relevance__summary-actions {
  align-items: flex-start;
  display: flex !important;
  gap: 12px !important;
  grid-auto-flow: column;
}
.skills-role-relevance__summary span {
  color: #667085;
  font-size: 11px;
  font-weight: 700;
}
.skills-role-relevance__summary strong {
  color: #101828;
  font-size: 14px;
}
.skills-role-relevance__coverage {
  display: grid;
  gap: 4px;
  justify-items: end;
  text-align: right;
}
.skills-role-relevance__coverage-head {
  align-items: baseline;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
  max-width: 100%;
}
.skills-role-relevance__coverage-head span {
  color: #667085;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.skills-role-relevance__coverage-breakdown {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: flex-end;
  margin-top: 0;
}
.skills-role-relevance__coverage-breakdown span {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #475467;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  padding: 2px 6px;
  white-space: nowrap;
}
/* Requirement-type chips: purple / indigo — keep amber for Missing status badges only */
.skills-role-relevance__coverage-breakdown .skills-role-relevance__coverage-pill--required {
  background: #f4ebff;
  border-color: #e9d7fe;
  border-width: 1px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
  color: #6941c6;
  font-size: 12px;
  font-weight: 700;
  padding: 5px 10px;
}
.skills-role-relevance__coverage-pill--required.is-missing {
  background: #f4ebff;
  border-color: #b692f6;
  color: #5925dc;
}
.skills-role-relevance__coverage-pill--required.is-missing b {
  color: #5925dc;
}
.skills-role-relevance__coverage-pill--required.is-met {
  background: #f9f5ff;
  border-color: #d6bbfb;
  color: #6941c6;
}
.skills-role-relevance__coverage-pill--required.is-met b {
  color: #6941c6;
}
.skills-role-relevance__coverage-breakdown .skills-role-relevance__coverage-pill--recommended {
  background: #eef4ff;
  border-color: #c7d7fe;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
  color: #3538cd;
  font-size: 12px;
  font-weight: 700;
  padding: 5px 10px;
}
.skills-role-relevance__coverage-pill--recommended b {
  color: inherit;
}
.skills-role-relevance__coverage-pill--recommended.is-partial {
  background: #eef4ff;
  border-color: #a4bcfd;
  color: #3538cd;
}
.skills-role-relevance__coverage-pill--recommended.is-met {
  background: #f5f8ff;
  border-color: #b2ccff;
  color: #2d31a6;
}
.skills-role-relevance__coverage-breakdown b {
  color: inherit;
  font-weight: 800;
}
.skills-role-relevance__toggle {
  white-space: nowrap;
}
.skills-role-relevance__columns[hidden] {
  display: none !important;
}
.skills-role-relevance__columns {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 10px;
}
.skills-role-relevance__columns > section {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid #d1fadf;
  border-radius: 10px;
  min-width: 0;
  padding: 10px;
}
.skills-role-relevance__columns > .skills-role-relevance__missing {
  border-color: #fedf89;
}
.skills-role-relevance__columns h4 {
  align-items: center;
  color: #344054;
  display: flex;
  font-size: 12px;
  justify-content: space-between;
  margin: 0 0 8px;
}
.skills-role-relevance__columns h4 span {
  background: #f2f4f7;
  border-radius: 999px;
  padding: 2px 7px;
}
.skills-role-relevance__columns ul {
  display: grid;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.skills-role-relevance__item {
  align-items: center;
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
  padding: 8px;
}
.skills-role-relevance__item.is-missing {
  background: #fffcf5;
  border-color: #fedf89;
}
.skills-role-relevance__item-copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}
.skills-role-relevance__item-copy strong {
  color: #101828;
  font-size: 12px;
  overflow-wrap: anywhere;
}
.skills-role-relevance__item-copy span {
  color: #667085;
  font-size: 10px;
}
.skills-role-badge {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  display: inline-flex;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  padding: 3px 7px;
  width: fit-content;
}
.skills-role-badge--met {
  background: #ecfdf3;
  border-color: #abefc6;
  color: #067647;
}
.skills-role-badge--partial {
  background: #fffaeb;
  border-color: #fedf89;
  color: #b54708;
}
.skills-role-badge--missing {
  background: #fffaeb;
  border-color: #fedf89;
  color: #b54708;
}
.skills-role-relevance__item.is-partial {
  border-color: #fedf89;
}
.target-role-match-pill {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  padding: 3px 8px;
  width: fit-content;
}
.target-role-match-pill--has {
  background: #ecfdf3;
  border-color: #abefc6;
  color: #067647;
}
.target-role-match-pill--partial {
  background: #fffaeb;
  border-color: #fedf89;
  color: #b54708;
}
.target-role-match-pill--missing {
  background: #fef3f2;
  border-color: #fecdca;
  color: #b42318;
}
.target-role-match-pill--neutral {
  background: #f2f4f7;
  border-color: #d0d5dd;
  color: #475467;
}
.target-role-proficiency-compare {
  display: inline-flex;
  gap: 4px;
  align-items: baseline;
  font-size: 11px;
  font-weight: 650;
}
.target-role-proficiency-compare__sep {
  color: #98a2b3;
}
.target-role-skill-cell {
  display: grid;
  gap: 2px;
}
.target-role-row--partial td {
  background: #fffcf5;
}
.skills-team-readiness {
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  display: grid;
  gap: 0;
  overflow: clip;
  padding: 0;
}

.skills-readiness-disclosure {
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: visible;
}

.skills-readiness-disclosure > summary {
  align-items: center;
  background: transparent;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  gap: 10px;
  list-style: none;
  margin: 0 -4px;
  padding: 8px 4px;
  transition: background 140ms ease;
}

.skills-readiness-disclosure > summary:hover {
  background: #f8fafc;
}

.skills-readiness-disclosure > summary::-webkit-details-marker {
  display: none;
}

.skills-readiness-disclosure > summary > span:last-child {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.skills-readiness-disclosure > summary strong {
  color: #344054;
  font-size: 13px;
  font-weight: 800;
}

.skills-readiness-disclosure > summary small {
  color: #98a2b3;
  font-size: 12px;
}

.skills-readiness-disclosure__chevron {
  border-bottom: 2px solid #667085;
  border-right: 2px solid #667085;
  display: inline-block;
  flex: 0 0 auto;
  height: 7px;
  margin-left: 2px;
  transform: rotate(-45deg);
  transition: transform 160ms ease;
  width: 7px;
}

.skills-readiness-disclosure[open] .skills-readiness-disclosure__chevron:not(.app-disclosure-chevron) {
  transform: rotate(45deg);
}

.skills-readiness-disclosure__body {
  border-top: 0;
  display: grid;
  gap: 12px;
  padding: 12px;
}

/* Team Skills “More” advanced matcher — clearer banding and spacing */
.skills-role-matcher__more .skills-readiness-disclosure__body {
  gap: 0;
  padding: 16px 18px 18px;
}

.skills-role-matcher__more .team-skill-search {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.skills-role-matcher__more .team-skill-search__head {
  align-items: flex-start;
  border-bottom: 1px solid #eaecf0;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  justify-content: space-between;
  padding-bottom: 14px;
}

.skills-role-matcher__more .team-skill-search__intro,
.skills-readiness-disclosure .team-skill-search__intro {
  color: #667085;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
  max-width: 46rem;
}

.skills-role-matcher__more .team-skill-search__head-actions {
  align-items: center;
  display: inline-flex;
  flex-shrink: 0;
  flex-wrap: wrap;
  gap: 8px;
}

.skills-role-matcher__more .team-skill-search__toolbar {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.skills-role-matcher__more .team-skill-search__picks {
  align-items: end;
  display: flex;
  flex-wrap: nowrap;
  gap: 12px 14px;
  min-width: 0;
}

.skills-role-matcher__more .team-skill-search__mode-field {
  flex: 0 0 200px;
  max-width: 200px;
  min-width: 140px;
  width: 200px;
}

.skills-role-matcher__more .team-skill-search__role-field {
  flex: 1 1 0;
  min-width: 0;
}

.skills-role-matcher__more .team-skill-search__role-field > label {
  display: grid;
  gap: 6px;
  margin: 0;
  min-width: 0;
}

.skills-role-matcher__more .team-skill-search__role-field select,
.skills-role-matcher__more .team-skill-search__mode-field select {
  box-sizing: border-box;
  width: 100%;
}

.skills-role-matcher__more .team-skill-search__compare-tools {
  align-items: end;
  display: inline-flex;
  flex: 0 1 320px;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: 0;
}

.skills-role-matcher__more .team-skill-search__compare-tools .team-skill-search__role-field {
  flex: 1 1 160px;
  min-width: 140px;
}

.skills-role-matcher__more .team-skill-search__vs {
  align-self: end;
  color: #98a2b3;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  padding-bottom: calc((var(--app-control-height, 38px) - 12px) / 2);
  text-transform: uppercase;
}

.skills-role-matcher__more .team-skill-search__run {
  align-self: end;
  flex: 0 0 auto;
}

.team-skill-search__toolbar {
  background: #f8fafc;
  border: 1px solid #eaecf0;
  border-radius: 10px;
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 12px 14px;
}

.team-skill-search__options {
  align-items: flex-start;
  background: transparent;
  border: 0;
  border-radius: 0;
  border-top: 1px solid #e4eaf1;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  margin: 0;
  padding: 12px 0 0;
}

.team-skill-search__check {
  align-items: flex-start;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  font-size: 13px;
  font-weight: 600;
  gap: 8px;
  line-height: 1.35;
  margin: 0;
  max-width: 28rem;
}

.team-skill-search__check.is-disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.team-skill-search__check input {
  flex: 0 0 auto;
  margin: 2px 0 0;
}

.team-skill-search__check span {
  min-width: 0;
}

.team-skill-search__profile-empty {
  display: block;
  font-size: 12px;
  line-height: 1.4;
  margin: 0;
}

.skills-role-matcher__more .team-skill-search__empty,
.skills-readiness-disclosure .team-skill-search__empty,
.team-skill-search__empty {
  background: #f8fafc;
  border: 1px solid #eaecf0;
  border-radius: 10px;
  margin: 0;
  min-height: 0;
  padding: 12px 14px;
}

.skills-role-matcher__more .team-skill-search__empty > p,
.skills-readiness-disclosure .team-skill-search__empty > p,
.team-skill-search__empty > p {
  color: #667085;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
}

.skills-readiness-disclosure .team-skill-search__intro {
  max-width: 48rem;
  margin: 0;
  font-size: 12px;
}

.skills-readiness-disclosure .target-role-toolbar__picks,
.skills-readiness-disclosure .team-skill-search__picks {
  align-items: end;
  display: flex;
  flex-wrap: nowrap;
  gap: 10px 14px;
  min-width: 0;
}

.skills-readiness-disclosure .target-role-toolbar__vs,
.skills-role-matcher__more .team-skill-search__vs {
  align-self: end;
  color: #98a2b3;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  /* Sit in the middle of the 38px dropdowns, not the label+control stack. */
  padding-bottom: calc((var(--app-control-height, 38px) - 12px) / 2);
  text-transform: uppercase;
}

.skills-readiness-disclosure .target-role-toolbar__compare-btn {
  align-self: end;
  flex: 0 0 auto;
}

.skills-readiness-disclosure .target-role-toolbar__compare-btn.app-icon-btn {
  align-items: center !important;
  box-sizing: border-box;
  display: inline-flex !important;
  height: var(--app-control-height, 38px) !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-height: var(--app-control-height, 38px) !important;
  min-width: var(--app-control-height, 38px) !important;
  padding: 0 !important;
  width: var(--app-control-height, 38px) !important;
}

.skills-readiness-disclosure .target-role-toolbar__field {
  flex: 1 1 0;
  min-width: 0;
}

.skills-readiness-disclosure .team-skill-search__mode-field {
  flex: 0 0 200px;
  max-width: 200px;
  min-width: 140px;
  width: 200px;
}

.skills-readiness-disclosure .target-role-toolbar__field label {
  display: grid;
  gap: 6px;
}

.skills-readiness-disclosure .target-role-toolbar__field label > span,
.skills-readiness-disclosure .team-skill-search__mode-field > label,
#team-skill-match .team-skill-search__picks .target-role-toolbar__field label > span {
  color: var(--app-label-color, #344054);
  font-size: var(--app-label-font-size, 12px);
  font-weight: var(--app-label-font-weight, 800);
  letter-spacing: normal;
  line-height: 18px;
  text-transform: none;
}

.skills-readiness-disclosure .target-role-toolbar__field select,
.skills-readiness-disclosure .team-skill-search__mode-field select {
  width: 100%;
}

@media (max-width: 760px) {
  .skills-role-matcher__more .team-skill-search__head {
    flex-direction: column;
  }

  .skills-role-matcher__more .team-skill-search__picks,
  .skills-readiness-disclosure .target-role-toolbar__picks,
  .skills-readiness-disclosure .team-skill-search__picks {
    align-items: stretch;
    flex-direction: column;
    flex-wrap: wrap;
  }

  .skills-role-matcher__more .team-skill-search__mode-field,
  .skills-role-matcher__more .team-skill-search__role-field,
  .skills-role-matcher__more .team-skill-search__compare-tools {
    flex-basis: auto;
    max-width: none;
    min-width: 0;
    width: 100%;
  }

  .team-skill-search__options {
    flex-direction: column;
    gap: 12px;
  }
}
.skills-team-readiness__heading {
  align-items: center;
  background: #f8fafc;
  border-bottom: 1px solid #eaecf0;
  box-sizing: border-box;
  display: grid;
  gap: 10px 16px;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 320px);
  min-height: 50px;
  padding: 10px 14px;
}
.skills-team-readiness__heading h3,
.skills-team-readiness__heading p,
.skills-team-readiness__gaps h4 {
  margin: 0;
}
.skills-team-readiness__heading h3 {
  color: #101828;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.3;
}
.skills-team-readiness__heading p,
.skills-team-readiness__status,
.skills-team-readiness__empty {
  color: #475467;
  font-size: 12px;
  line-height: 1.35;
}
.skills-team-readiness__heading p {
  max-width: 52ch;
  margin-top: 0;
}
.skills-team-readiness__status,
.skills-team-readiness__selected {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
}
.skills-team-readiness__status.is-error {
  background: #fef3f2;
  border: 1px solid #fecdca;
  border-radius: 8px;
  color: #b42318;
  padding: 8px 10px;
}
.skills-team-readiness__results {
  display: grid;
  gap: 8px;
  margin-top: 2px;
}
.skills-team-readiness__selected {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  justify-content: space-between;
  padding: 7px 10px;
}
.skills-team-readiness__selected-main {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  min-width: 0;
}
.skills-team-readiness__selected-main strong {
  color: #101828;
  font-size: 13px;
  font-weight: 700;
}
.skills-team-readiness__selected-meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
}
.skills-team-readiness__selected-meta span {
  color: #667085;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}
.skills-team-readiness__selected-meta strong {
  color: #101828;
  font-weight: 700;
}
.skills-team-readiness__selected span,
.skills-team-readiness__coverage span,
.skills-team-readiness__summary-strip span,
.skills-team-readiness__kpis span,
.skills-team-readiness__gap span,
.skills-team-readiness__person-id span {
  color: #667085;
  font-size: 10px;
  font-weight: 700;
}
.skills-team-readiness__selected-main > span {
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.skills-team-readiness__summary-strip,
.skills-team-readiness__kpis {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.skills-team-readiness__kpis {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.skills-team-readiness__summary-strip > div,
.skills-team-readiness__kpis > div {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 1px;
  padding: 7px 10px;
}
.skills-team-readiness__summary-strip strong,
.skills-team-readiness__kpis strong {
  color: #101828;
  font-size: 15px;
}
.skills-team-readiness__people {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 0;
  overflow: hidden;
}
.skills-team-readiness__gap-list {
  display: grid;
  gap: 6px;
}
.skills-team-readiness__person {
  background: transparent;
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid #eaecf0;
  padding: 6px 10px;
}
.skills-team-readiness__person:last-child {
  border-bottom: 0;
}
.skills-team-readiness__person.is-expanded {
  background: #fafbfc;
}
.skills-team-readiness__gaps {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  padding: 8px 10px;
}
.skills-team-readiness__person-main {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(160px, 1fr) minmax(40px, auto) auto auto;
}
.skills-team-readiness__person-id,
.skills-team-readiness__coverage,
.skills-team-readiness__gap-count {
  display: grid;
  gap: 1px;
  min-width: 0;
}
.skills-team-readiness__person-id strong {
  color: #101828;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
}
.skills-team-readiness__person-id span {
  font-weight: 500;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.skills-team-readiness__coverage,
.skills-team-readiness__gap-count {
  text-align: right;
}
.skills-team-readiness__coverage strong {
  color: #344054;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.skills-team-readiness__badge {
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  justify-self: end;
  line-height: 1;
  padding: 3px 7px;
  white-space: nowrap;
}
.skills-team-readiness__badge.is-met {
  background: #ecfdf3;
  border-color: #abefc6;
  color: #067647;
}
.skills-team-readiness__badge.is-partial {
  background: #eff8ff;
  border-color: #b2ddff;
  color: #175cd3;
}
.skills-team-readiness__badge.is-missing {
  background: #fffaeb;
  border-color: #fedf89;
  color: #b54708;
}
.skills-team-readiness__badge.is-neutral {
  background: #f2f4f7;
  color: #475467;
}
.skills-team-readiness__details-btn {
  background: transparent;
  border: 0;
  color: #175cd3;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  justify-self: end;
  padding: 2px 0;
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
}
.skills-team-readiness__details-btn:hover {
  color: #0b4ea2;
}
.skills-team-readiness__person-detail {
  border-top: 1px solid #eaecf0;
  margin-top: 6px;
  padding-top: 6px;
}
.skills-team-readiness__person-detail h4 {
  display: flex;
  font-size: 11px;
  justify-content: space-between;
  margin: 0 0 5px;
}
.skills-team-readiness__person-detail ul {
  display: grid;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.skills-team-readiness__gaps h4 {
  color: #344054;
  font-size: 12px;
  margin-bottom: 8px;
}
.skills-team-readiness__gap {
  align-items: center;
  background: #fffcf5;
  border: 1px solid #fedf89;
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 8px 10px;
}
.skills-team-readiness__gap > div:first-child {
  display: grid;
  gap: 2px;
}
.skills-proficiency-table__skill-content {
  align-items: flex-start;
  display: grid;
  gap: 5px;
}
@media (max-width: 800px) {
  .skills-role-relevance__heading,
  .skills-role-relevance__columns,
  .skills-team-readiness__heading,
  .skills-team-readiness__summary-strip,
  .skills-team-readiness__kpis,
  .skills-team-readiness__person-main {
    grid-template-columns: 1fr;
  }
  .skills-role-relevance__coverage {
    justify-items: start;
    text-align: left;
  }
  .skills-role-relevance__coverage-head {
    justify-content: flex-start;
  }
  .skills-role-relevance__summary,
  .skills-role-relevance__summary-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .skills-team-readiness__coverage,
  .skills-team-readiness__gap-count {
    text-align: left;
  }
  .skills-team-readiness__badge,
  .skills-team-readiness__details-btn {
    justify-self: start;
  }
  .skills-team-readiness__person-id span {
    white-space: normal;
  }
}
.skills-qualifications {
  background: transparent;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
}
.skills-qualifications[hidden] {
  display: none !important;
}
.skills-qualifications__summary {
  min-width: 0;
}
.skills-qualifications__grid {
  align-items: start;
  display: grid;
  gap: 14px 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 920px;
}
.skills-qualifications__block {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.skills-qualifications__head {
  align-items: center;
  display: flex;
  gap: 8px;
  min-width: 0;
}
.skills-qualifications__label {
  color: #101828;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.skills-qualifications__count {
  align-items: center;
  background: #eef2f6;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #475467;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  justify-content: center;
  line-height: 1;
  min-height: 20px;
  min-width: 20px;
  padding: 0 7px;
}
.skills-qualifications__items {
  display: grid;
  gap: 6px 8px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 145px), 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}
.skills-qualifications__item {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  align-items: start;
  display: grid;
  gap: 2px 8px;
  grid-template-columns: minmax(0, 1fr) auto;
  min-width: 0;
  padding: 8px 10px;
}
.skills-qualifications__item--education {
  background: #fff;
  border-color: #e4e7ec;
}
.skills-qualifications__item-body {
  display: grid;
  gap: 2px;
  min-width: 0;
  flex: 1 1 auto;
}
.skills-qualifications__item-name {
  color: #101828;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: normal;
}
.skills-qualifications__item-meta {
  color: #667085;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: normal;
}
.skills-qualifications__item-remove,
.skills-qualifications__chip-remove {
  /* Row removes use .app-icon-btn--danger; chip removes stay compact. */
  margin-left: auto;
}
.skills-qualifications__item-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 4px;
  justify-content: flex-end;
  margin-top: -2px;
  padding-top: 0;
  width: max-content;
}
.skills-qualifications__item-actions .skills-qualifications__item-remove {
  margin-left: 0;
}
.skills-qualifications__item-actions .button-small {
  border-radius: 5px;
  font-size: 11px;
  line-height: 1.2;
  min-height: 24px;
  min-width: 0;
  padding: 3px 7px;
}
.skills-qualifications__item-actions .app-icon-btn {
  height: 24px;
  min-height: 24px;
  min-width: 24px;
  width: 24px;
}
.skills-qualifications__chip-remove {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: #98a2b3;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 16px;
  height: 22px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 22px;
}
.skills-qualifications__chip-remove:hover,
.skills-qualifications__chip-remove:focus-visible {
  background: #f2f4f7;
  color: #344054;
  outline: none;
}
.skills-qualifications__empty {
  margin: 0;
}
@media (max-width: 900px) {
  .skills-qualifications__grid {
    grid-template-columns: 1fr;
  }
}
/* Legacy chip styles kept for any leftover markup */
.skills-qualifications__chips {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.skills-qualifications__chip {
  align-items: center;
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  box-shadow: 0 1px 1px rgba(16, 24, 40, 0.03);
  color: #101828;
  display: inline-flex;
  gap: 8px;
  max-width: 100%;
  min-height: 34px;
  padding: 6px 12px;
}
.skills-qualifications__chip--education {
  background: linear-gradient(180deg, #f5faff 0%, #eff8ff 100%);
  border-color: #b2ddff;
}
.skills-qualifications__chip-label {
  color: #667085;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.skills-qualifications__chip-value {
  font-size: 13px;
  font-weight: 650;
  line-height: 1.2;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.skills-qualifications__chip-sep {
  color: #101828;
  font-weight: 800;
  padding: 0 2px;
}
.skills-qualifications__chip-remove {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: #98a2b3;
  cursor: pointer;
  display: inline-flex;
  font-size: 16px;
  height: 22px;
  justify-content: center;
  line-height: 1;
  margin-left: 2px;
  padding: 0;
  width: 22px;
}
.skills-qualifications__chip-remove:hover,
.skills-qualifications__chip-remove:focus-visible {
  background: #f2f4f7;
  color: #344054;
  outline: none;
}
.skills-qualifications__empty {
  font-size: 13px;
}
.skills-proficiency-modal__dialog--compact {
  max-width: min(480px, calc(100vw - 32px));
}
.role-profile-section-title {
  color: #101828;
  display: block;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 8px;
}
.role-education-reqs {
  display: grid;
  gap: 8px;
}
.role-education-reqs__hint {
  margin: 0 0 4px;
}
.role-education-reqs [data-role-education-req-list] {
  display: grid;
  gap: 0;
  overflow: visible;
}
.role-education-req {
  align-items: end;
  background: #fff;
  border: 1px solid #eaecf0;
  border-radius: 10px;
  display: grid;
  gap: 8px 10px;
  grid-template-columns: minmax(160px, 1fr) minmax(0, 1.4fr) minmax(130px, 0.7fr) auto;
  margin-bottom: 8px;
  overflow: visible;
  padding: 10px;
  position: relative;
  z-index: 1;
}
.role-education-req label,
.role-education-req .skills-proficiency-autocomplete {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.role-education-req select,
.role-education-req input[type="text"],
.role-education-req .app-rounded-select {
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  box-sizing: border-box;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  height: var(--app-control-height, 38px);
  min-width: 0;
  padding: 0 10px;
  width: 100%;
}
.role-education-req .app-rounded-select {
  border: 0;
  height: auto;
  padding: 0;
}
.role-education-req .app-rounded-select__button {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.role-education-req .button-danger-small {
  align-self: end;
  height: var(--app-control-height, 38px);
  min-height: var(--app-control-height, 38px);
}
.role-education-req .skills-proficiency-autocomplete {
  position: relative;
  z-index: 2;
}
.role-education-req .skills-proficiency-autocomplete__list {
  z-index: 30;
}
.role-education-reqs [data-role-education-add-req],
[data-target-role-form] [data-role-education-add-req],
.team-skill-search [data-team-skill-profile-form] [data-role-education-add-req] {
  display: inline-flex;
  margin: 10px 0 6px 4px;
  width: auto;
}
.target-role-qualifications {
  background: #f8fafc;
  border: 1px solid #eaecf0;
  border-radius: 12px;
  padding: 12px 14px;
}
.target-role-qualifications__grid {
  align-items: start;
  display: grid;
  gap: 14px 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.target-role-qualifications__block {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.target-role-qualifications__head {
  align-items: center;
  display: flex;
  gap: 8px;
  min-width: 0;
}
.target-role-qualifications__label {
  color: #101828;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.target-role-qualifications__count {
  align-items: center;
  background: #eef2f6;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #475467;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  justify-content: center;
  line-height: 1;
  min-height: 20px;
  min-width: 20px;
  padding: 0 7px;
}
.target-role-qualifications__items {
  display: grid;
  gap: 6px 8px;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}
.target-role-qualifications__item {
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px 10px;
}
.target-role-qualifications__item-name {
  color: #101828;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: normal;
}
.target-role-qualifications__item-meta {
  color: #667085;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: normal;
}
.target-role-qualifications__empty {
  margin: 0;
}
@media (max-width: 900px) {
  .target-role-qualifications__grid {
    grid-template-columns: 1fr;
  }
}
.team-skill-search__detail-bucket--education,
.team-skill-search__detail-bucket--certificates {
  background: linear-gradient(180deg, #fcfcfd 0%, #f8fafc 100%);
}
.team-skill-search__qual-status {
  color: #475467;
  font-weight: 600;
}
.development-plan-skills .skills-proficiency-head {
  align-items: flex-start;
  margin-bottom: 0;
}
.development-plan-skills .skills-proficiency-head__intro {
  flex: 1 1 auto;
  min-width: 0;
}
.development-plan-skills h3 {
  padding: 0;
}
.development-plan-skills .skills-proficiency-head__subtitle {
  max-width: none;
  margin: 0;
}
.development-plan-skills .skills-proficiency-toolbar--global {
  display: block;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}
.development-plan-skills .skills-proficiency-toolbar--global .skills-proficiency-toolbar__search {
  width: 100%;
}
.development-plan-skills .skills-proficiency-toolbar--global {
  grid-template-columns: minmax(0, 1fr);
}
.development-plan-skills .skills-proficiency-toolbar {
  align-items: end;
  align-self: stretch;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 12px;
  box-sizing: border-box;
  display: grid;
  flex: 0 0 auto;
  gap: 10px 14px;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, 1.1fr);
  height: auto;
  margin: 0;
  max-height: none;
  max-width: none;
  padding: 10px 12px;
  width: 100%;
}
.development-plan-skills .skills-proficiency-toolbar--team,
.development-plan-skills .skills-proficiency-toolbar--person {
  align-items: end;
  align-self: stretch;
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 12px;
  box-sizing: border-box;
  display: grid;
  flex: 0 0 auto;
  gap: 10px 14px;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, 1.1fr);
  height: auto;
  margin: 0;
  max-height: none;
  max-width: none;
  padding: 10px 12px;
  width: 100%;
}
.development-plan-skills .skills-proficiency-toolbar--person {
  grid-template-columns: auto minmax(240px, 1fr);
}
.skills-proficiency-toolbar__filters {
  align-items: end;
  display: grid;
  gap: 10px 12px;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  min-width: 0;
  width: 100%;
}
.skills-proficiency-toolbar--person {
  grid-template-columns: auto minmax(240px, 1fr);
}
.skills-proficiency-toolbar--person .skills-proficiency-toolbar__filters {
  grid-template-columns: minmax(160px, 200px);
  width: auto;
}
.skills-proficiency-toolbar--person .pm-manage-filter-field {
  max-width: 200px;
  width: 200px;
}
.skills-proficiency-toolbar__search {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.skills-proficiency-toolbar__search--with-sort {
  align-items: end;
  display: flex;
  flex-wrap: nowrap;
  gap: 10px 14px;
  min-width: 0;
  width: 100%;
}
.skills-proficiency-toolbar__search--with-sort .skills-proficiency-sort-field {
  flex: 0 0 auto;
  max-width: 180px;
  min-width: 150px;
  width: 180px;
}
.skills-proficiency-toolbar__search--with-sort .skills-proficiency-toolbar__search-main {
  display: grid;
  flex: 1 1 auto;
  gap: 6px;
  min-width: 0;
}
.skills-proficiency-search-cluster {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: 0;
  width: 100%;
}
.skills-proficiency-search-cluster .skills-proficiency-search {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
}
.skills-proficiency-search-cluster .skills-proficiency-search__match {
  flex: 0 0 auto;
  margin: 0;
}
.skills-proficiency-results-heading {
  align-items: center;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #eaecf0;
  border-radius: 0;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  margin: 0;
  padding: 2px 0 10px;
}
.skills-proficiency-results-heading__identity,
.skills-proficiency-results-heading__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.skills-proficiency-results-heading__actions {
  justify-content: flex-end;
}
.skills-proficiency-results-heading__sort {
  align-items: center;
  display: flex;
  gap: 7px;
}
.skills-proficiency-results-heading__sort > span {
  color: #344054;
  font-size: 12px;
  font-weight: 800;
}
.skills-proficiency-results-heading__sort select {
  min-width: 165px;
}
.skills-proficiency-results-heading__title {
  color: #101828;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.3;
  margin: 0;
}
.skills-proficiency-results-heading__count {
  background: #eff8ff;
  border: 1px solid #b2ddff;
  border-radius: 999px;
  color: #175cd3;
  font-size: 11px;
  font-weight: 800;
  padding: 4px 9px;
  white-space: nowrap;
}
@media (max-width: 800px) {
  .skills-proficiency-results-heading {
    grid-template-columns: 1fr;
  }
  .skills-proficiency-results-heading__actions {
    justify-content: flex-start;
  }
  .development-plan-skills .skills-proficiency-toolbar,
  .development-plan-skills .skills-proficiency-toolbar--team,
  .development-plan-skills .skills-proficiency-toolbar--person {
    grid-template-columns: 1fr;
  }
  .skills-role-relevance__heading,
  .skills-team-readiness__heading {
    grid-template-columns: 1fr;
  }
}
.skills-proficiency-toolbar--team .pm-manage-filter-field,
.skills-proficiency-toolbar--person .pm-manage-filter-field {
  align-content: start;
  display: grid;
  gap: 6px;
  grid-template-rows: 18px var(--app-control-height, 38px);
  margin: 0;
  min-width: 0;
  position: relative;
}
.skills-proficiency-toolbar--team details.pm-manage-filter-multiselect,
.skills-proficiency-toolbar--person details.pm-manage-filter-multiselect {
  display: block;
  height: var(--app-control-height, 38px);
  margin: 0;
  position: relative;
  width: 100%;
}
.skills-proficiency-toolbar--team details.pm-manage-filter-multiselect summary,
.skills-proficiency-toolbar--person details.pm-manage-filter-multiselect summary {
  align-items: center;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  box-sizing: border-box;
  color: #101828;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  height: var(--app-control-height, 38px);
  justify-content: space-between;
  list-style: none;
  min-height: var(--app-control-height, 38px);
  padding: 8px 10px;
  width: 100%;
}
.skills-proficiency-toolbar--team details.pm-manage-filter-multiselect summary::-webkit-details-marker {
  display: none;
}
.skills-proficiency-toolbar--team details.pm-manage-filter-multiselect summary:focus-visible {
  border-color: #84adff;
  box-shadow: 0 0 0 3px rgba(23, 92, 211, 0.12);
  outline: none;
}
.skills-proficiency-toolbar--team .pm-manage-filter-field:has(details[open]) {
  z-index: 40;
}
.skills-proficiency-toolbar--team .pm-manage-filter-dd-summary {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
  width: 100%;
}
.skills-proficiency-toolbar--team .pm-manage-filter-dd-summary__text {
  display: block;
  flex: 1 1 auto;
  max-width: calc(100% - 24px);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.skills-proficiency-toolbar--team .pm-manage-filter-dd-summary__chev {
  color: #667085;
  display: inline-flex;
  flex: 0 0 14px;
  font-size: 0;
  height: 14px;
  justify-content: center;
  line-height: 1;
  width: 14px;
}

/* Unified form-control focus treatment: a clear border plus a restrained ring.
   Keep button, checkbox, radio, range, and other action focus styles unchanged. */
:root {
  --app-field-focus-ring: rgba(29, 155, 240, 0.12);
  --app-field-focus-ring-width: 2px;
}

html[data-keshero-theme="dark"] {
  --app-field-focus-ring: rgba(56, 189, 248, 0.18);
}

html body :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="image"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not([type="reset"]):focus,
  select:focus,
  textarea:focus,
  .app-field__control:focus,
  .app-field__textarea:focus,
  .ks-field__control:focus,
  .app-rounded-select__button:focus-visible,
  .app-rounded-select__search-input:focus,
  .grid-filter-dropdown-toggle:focus,
  .grid-filter-search-input:focus
) {
  border-color: var(--app-field-focus, var(--ks-field-focus, #1d9bf0)) !important;
  box-shadow: 0 0 0 var(--app-field-focus-ring-width, 2px) var(--app-field-focus-ring, rgba(29, 155, 240, 0.12)) !important;
  outline: none !important;
}

html body :is(
  .ks-search-field__control:focus-within,
  .keshero-date-format-field:has(.keshero-date-format-input:focus)
) {
  box-shadow: 0 0 0 var(--app-field-focus-ring-width, 2px) var(--app-field-focus-ring, rgba(29, 155, 240, 0.12)) !important;
}

/* Shared app-wide toast notifications. */
.app-toast-region {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 8px;
  left: 50%;
  max-width: min(560px, calc(100vw - 32px));
  pointer-events: none;
  position: fixed;
  top: calc(18px + env(safe-area-inset-top, 0px));
  transform: translateX(-50%);
  width: max-content;
  z-index: 11050;
}

.app-toast {
  align-items: center;
  border: 1px solid;
  border-radius: 10px;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.18);
  box-sizing: border-box;
  display: grid;
  font-size: 14px;
  font-weight: 750;
  gap: 10px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  line-height: 1.35;
  max-width: 100%;
  min-width: min(280px, calc(100vw - 32px));
  opacity: 0;
  padding: 11px 13px;
  pointer-events: auto;
  transform: translateY(-10px);
  transition: opacity 180ms ease, transform 180ms ease;
}

.app-toast:not(:has(.app-toast__close)) {
  grid-template-columns: auto auto;
  justify-content: center;
  min-width: 0;
}

.app-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.app-toast--success { background: #ecfdf3; border-color: #a6f4c5; color: #067647; }
.app-toast--info { background: #eff8ff; border-color: #b2ddff; color: #175cd3; }
.app-toast--warning { background: #fffaeb; border-color: #fedf89; color: #b54708; }
.app-toast--error { background: #fef3f2; border-color: #fda29b; color: #b42318; }

.app-toast__icon {
  align-items: center;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  height: 18px;
  justify-content: center;
  line-height: 1;
  width: 18px;
}

.app-toast--success .app-toast__icon::before { content: "✓"; }
.app-toast--info .app-toast__icon::before { content: "i"; }
.app-toast--warning .app-toast__icon::before,
.app-toast--error .app-toast__icon::before { content: "!"; }

.app-toast__message { min-width: 0; }

.app-toast__close {
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: currentColor;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  height: 26px;
  justify-content: center;
  margin: -4px -5px -4px 2px;
  padding: 0;
  width: 26px;
}

.app-toast__close:hover,
.app-toast__close:focus-visible {
  background: rgba(15, 23, 42, 0.08);
  outline: none;
}

@media (max-width: 600px) {
  .app-toast-region {
    max-width: none;
    width: calc(100vw - 24px);
  }
  .app-toast { width: 100%; }
  .app-toast:not(:has(.app-toast__close)) { width: auto; }
}

/*
 * Numbered marker standard
 * ------------------------
 * Sequence numbers identify ordered steps, questions, fields, stages, or
 * timeline events. Quantity, notification, unread, and status badges retain
 * their semantic colors and are intentionally excluded.
 */
.user-access-help-guide__steps li::before,
.user-access-step-number,
.app-row-order-number,
.settings-performance-rating-field-number,
.settings-org-chart-field-number,
.settings-timeline-rule-number,
.settings-promo-process__num,
.settings-performance-review-repeatable__number,
.settings-performance-review-scale-option__number,
.settings-pip-level-rank,
#settings-check-in .settings-checkin-question-row::before,
.population-filter-row::before,
.population-filter-row + .population-filter-row::before,
.population-builder-step,
.cycle-grid-section-step,
.cycle-guided-section-header__step,
.grid-feedback-comment-card__index,
.stacked-ranking-rounds__number,
.stacked-ranking-rounds__item.is-current .stacked-ranking-rounds__number,
.feedback-survey-question-number,
.pm-pip-flow-step,
.recruiting-stage-order,
.candidate-audit-timeline__dot,
.pm-milestone-number,
.pm-subtask-number,
.pm-create-subtask-row::before {
  background: var(--app-numbered-marker-bg, #075985) !important;
  background-image: none !important;
  border-color: var(--app-numbered-marker-border, #075985) !important;
  box-shadow: none !important;
  color: var(--app-numbered-marker-fg, #ffffff) !important;
}

.app-row-order-number {
  align-items: center;
  border-radius: 999px;
  box-sizing: border-box;
  display: inline-flex;
  flex: 0 0 22px;
  font-size: 11px;
  font-weight: 800;
  height: 22px;
  justify-content: center;
  line-height: 1;
  min-width: 22px;
  width: 22px;
}

@media (prefers-reduced-motion: reduce) {
  .app-toast { transition: none; }
}

/* Estimated payout planning dashboard */
.estimated-payout-impact {
  --epi-blue: #2563eb;
  --epi-indigo: #4f46e5;
  --epi-ink: #172033;
  --epi-muted: #667085;
  background: #ffffff;
  border: 1px solid #dbe7f3;
  border-radius: 18px;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.07);
  box-sizing: border-box;
  display: grid;
  gap: 18px;
  margin: 22px 14px;
  overflow: hidden;
  padding: 18px;
}
.estimated-payout-impact__banner {
  align-items: center;
  background:
    radial-gradient(circle at 92% 10%, rgba(99, 102, 241, 0.17), transparent 32%),
    linear-gradient(125deg, #eff8ff 0%, #f4f3ff 100%);
  border: 1px solid #c7d7fe;
  border-radius: 15px;
  display: flex;
  gap: 28px;
  justify-content: space-between;
  overflow: hidden;
  padding: 20px 22px;
  position: relative;
}
.estimated-payout-impact__banner::before {
  background: linear-gradient(180deg, #38bdf8, #6366f1);
  border-radius: 0 999px 999px 0;
  bottom: 18px;
  content: "";
  left: 0;
  position: absolute;
  top: 18px;
  width: 4px;
}
.estimated-payout-impact__banner-copy {
  display: grid;
  gap: 7px;
  max-width: 860px;
}
.estimated-payout-impact__eyebrow {
  align-items: center;
  color: #3446a8;
  display: flex;
  font-size: 11px;
  font-weight: 800;
  gap: 7px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.estimated-payout-impact__eyebrow span {
  background: #22c55e;
  border: 3px solid rgba(34, 197, 94, 0.17);
  border-radius: 50%;
  box-sizing: content-box;
  height: 6px;
  width: 6px;
}
.estimated-payout-impact__title {
  color: var(--epi-ink);
  font-size: clamp(19px, 2vw, 24px);
  font-weight: 850;
  letter-spacing: -0.025em;
  line-height: 1.18;
  margin: 0;
}
.estimated-payout-impact__banner p {
  color: #526277;
  font-size: 13px;
  line-height: 1.55;
  margin: 0;
  max-width: 820px;
}
.estimated-payout-impact__banner-status {
  align-items: center;
  align-self: stretch;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(129, 140, 248, 0.28);
  border-radius: 12px;
  display: flex;
  flex: 0 0 150px;
  flex-direction: column;
  justify-content: center;
  min-height: 84px;
  padding: 10px 14px;
  text-align: center;
}
.estimated-payout-impact__banner-status span {
  color: #667085;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.estimated-payout-impact__banner-status strong {
  color: #3730a3;
  font-size: 24px;
  font-weight: 850;
  line-height: 1.25;
}
.estimated-payout-impact__banner-status small {
  color: #667085;
  font-size: 11px;
}
.estimated-payout-impact__cards {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.estimated-payout-impact__card {
  --epi-card-accent: #94a3b8;
  background: #ffffff;
  border: 1px solid #e1e8f0;
  border-radius: 13px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.045);
  box-sizing: border-box;
  display: grid;
  gap: 6px;
  min-height: 118px;
  overflow: hidden;
  padding: 17px 17px 15px;
  position: relative;
}
.estimated-payout-impact__card::before {
  background: var(--epi-card-accent);
  content: "";
  height: 4px;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.estimated-payout-impact__card--budget { --epi-card-accent: #0ea5e9; }
.estimated-payout-impact__card--target { --epi-card-accent: #6366f1; }
.estimated-payout-impact__card--planning {
  --epi-card-accent: #16a34a;
  background: linear-gradient(145deg, #ffffff, #f3fff7);
  border-color: #bce7ca;
}
.estimated-payout-impact__card--range { --epi-card-accent: #8b5cf6; }
.estimated-payout-impact__card--variance { --epi-card-accent: #f59e0b; }
.estimated-payout-impact__card--missing { --epi-card-accent: #94a3b8; }
.estimated-payout-impact__card--missing.has-issues {
  --epi-card-accent: #ef4444;
  background: #fffafa;
  border-color: #fecaca;
}
.estimated-payout-impact__card.is-over-budget {
  --epi-card-accent: #dc2626;
  background: #fff7f7;
  border-color: #fda4af;
}
.estimated-payout-impact__card[role="button"] {
  cursor: pointer;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}
.estimated-payout-impact__card[role="button"]:hover,
.estimated-payout-impact__card[role="button"]:focus-visible {
  border-color: var(--epi-card-accent);
  box-shadow: 0 9px 22px rgba(15, 23, 42, 0.09);
  outline: none;
  transform: translateY(-1px);
}
.estimated-payout-impact__card-label {
  color: #526277;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.035em;
  line-height: 1.35;
  text-transform: uppercase;
}
.estimated-payout-impact__card-value {
  align-self: end;
  color: var(--epi-ink);
  font-size: clamp(18px, 1.6vw, 23px);
  font-weight: 850;
  letter-spacing: -0.025em;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.estimated-payout-impact__card-value.is-empty {
  color: #667085;
  font-size: 17px;
}
.estimated-payout-impact__card-meta {
  color: #7a8799;
  font-size: 11px;
  line-height: 1.35;
}
.estimated-payout-impact__card--missing.has-issues .estimated-payout-impact__card-value,
.estimated-payout-impact__card.is-over-budget .estimated-payout-impact__card-value {
  color: #b42318;
}
.estimated-payout-impact__warning {
  align-items: center;
  background: #fffaeb;
  border: 1px solid #fedf89;
  border-radius: 11px;
  color: #93370d;
  display: flex;
  font-size: 12px;
  font-weight: 700;
  gap: 9px;
  padding: 11px 13px;
}
.estimated-payout-impact__warning::before {
  align-items: center;
  background: #f79009;
  border-radius: 50%;
  color: #fff;
  content: "!";
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 10px;
  height: 18px;
  justify-content: center;
  width: 18px;
}
.estimated-payout-impact__section-heading {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e1e8f0;
  border-radius: 12px 12px 0 0;
  display: flex;
  justify-content: space-between;
  padding: 13px 15px;
}
.estimated-payout-impact__section-heading > div {
  display: grid;
  gap: 3px;
}
.estimated-payout-impact__section-heading strong {
  color: var(--epi-ink);
  font-size: 13px;
  font-weight: 800;
}
.estimated-payout-impact__section-heading span {
  color: #667085;
  font-size: 11px;
  line-height: 1.4;
}
.estimated-payout-impact__group-count {
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  color: #4338ca !important;
  flex: 0 0 auto;
  font-size: 10px !important;
  font-weight: 800;
  padding: 4px 9px;
}
.estimated-payout-impact__group-breakdown {
  display: grid;
  gap: 0;
}
.estimated-payout-impact__table-wrap {
  border: 1px solid #e1e8f0;
  border-radius: 0 0 12px 12px;
  margin-top: 0;
  overflow: auto;
}
.estimated-payout-impact__currency-breakdown .estimated-payout-impact__table-wrap {
  margin-top: 0;
}
.estimated-payout-impact__table {
  border-collapse: separate;
  border-spacing: 0;
  margin: 0;
  min-width: 820px;
  width: 100%;
}
.estimated-payout-impact__table thead th {
  background: #f8fafc;
  border-bottom: 1px solid #dfe7f0;
  color: #475467;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.035em;
  padding: 11px 13px;
  text-transform: uppercase;
  white-space: nowrap;
}
.estimated-payout-impact__table tbody td {
  border-bottom: 1px solid #edf1f5;
  color: #344054;
  font-size: 12px;
  padding: 12px 13px;
}
.estimated-payout-impact__table tbody tr:last-child td {
  border-bottom: 0;
}
.estimated-payout-impact__table tbody tr[data-epi-open-drawer] {
  cursor: pointer;
  transition: background 130ms ease;
}
.estimated-payout-impact__table tbody tr[data-epi-open-drawer]:hover,
.estimated-payout-impact__table tbody tr[data-epi-open-drawer]:focus-visible {
  background: #f0f7ff;
  outline: none;
}
.estimated-payout-impact__pending {
  align-items: center;
  background: #eefaf3;
  border: 1px solid #a6e3bc;
  border-radius: 11px;
  color: #166534;
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  gap: 12px 24px;
  padding: 11px 13px;
}
.estimated-payout-impact__pending[hidden] {
  display: none;
}
.estimated-payout-impact__fx-note {
  color: #667085;
  font-size: 11px;
  margin: -7px 2px 0;
}
.estimated-payout-impact__actions {
  align-items: center;
  border-top: 1px solid #e9eef4;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  padding-top: 14px;
}
.estimated-payout-impact__actions .button-small {
  align-items: center;
  background: #fff;
  border: 1px solid #cfd9e6;
  border-radius: 9px;
  color: #344054;
  display: inline-flex;
  font-weight: 750;
  min-height: 34px;
  padding: 7px 11px;
  text-decoration: none;
}
.estimated-payout-impact__actions .button-small:hover {
  background: #f8fafc;
  border-color: #98a2b3;
}
.estimated-payout-impact__currency-breakdown {
  display: grid;
  margin: 0;
}
.estimated-payout-impact__currency-breakdown tfoot th {
  background: #f8fafc;
  border-top: 2px solid #98a2b3;
  padding: 11px 13px;
}
.estimated-payout-drawer[hidden] {
  display: none;
}
.estimated-payout-drawer {
  align-items: stretch;
  background: rgba(15, 23, 42, 0.38);
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 1000;
}
.estimated-payout-drawer__panel {
  background: #fff;
  box-shadow: -14px 0 40px rgba(15, 23, 42, 0.18);
  display: flex;
  flex-direction: column;
  max-width: min(720px, 92vw);
  width: 100%;
}
.estimated-payout-drawer__header {
  align-items: flex-start;
  border-bottom: 1px solid #e4e7ec;
  display: flex;
  justify-content: space-between;
  padding: 18px 20px;
}
.estimated-payout-drawer__header h3,
.estimated-payout-drawer__header p {
  margin: 0;
}
.estimated-payout-drawer__body {
  overflow: auto;
  padding: 18px 20px;
}
@media (max-width: 1050px) {
  .estimated-payout-impact__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .estimated-payout-impact {
    border-radius: 14px;
    margin: 14px 8px;
    padding: 12px;
  }
  .estimated-payout-impact__banner {
    align-items: flex-start;
    flex-direction: column;
    padding: 17px;
  }
  .estimated-payout-impact__banner-status {
    align-items: flex-start;
    align-self: stretch;
    flex: none;
    min-height: 0;
    text-align: left;
  }
  .estimated-payout-impact__cards {
    grid-template-columns: 1fr;
  }
  .estimated-payout-impact__section-heading {
    align-items: flex-start;
    gap: 10px;
  }
  .estimated-payout-impact__actions {
    justify-content: stretch;
  }
  .estimated-payout-impact__actions .button-small {
    justify-content: center;
    width: 100%;
  }
}

/* Skills & Qualifications: keep actions, match behavior, and add forms compact
   and intentional instead of letting modal content fall into the page flow. */
.skills-proficiency-toolbar-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.skills-proficiency-suggestions {
  background: #f8f7ff;
  border: 1px solid #d9d6fe;
  border-radius: 12px;
  margin: 0 0 14px;
  padding: 14px;
}

.skills-proficiency-suggestions__heading {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 10px;
}

.skills-proficiency-suggestions__heading h3 {
  color: #344054;
  font-size: 14px;
  margin: 0 0 2px;
}

.skills-proficiency-suggestions__heading p {
  color: #667085;
  font-size: 12px;
  line-height: 1.4;
  margin: 0;
}

.skills-proficiency-suggestions__count {
  align-items: center;
  background: #6941c6;
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  justify-content: center;
  min-height: 22px;
  min-width: 22px;
  padding: 0 7px;
}

.skills-proficiency-suggestions__list {
  display: grid;
  gap: 8px;
}

.skills-proficiency-suggestion {
  align-items: center;
  background: #fff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 11px 12px;
}

.skills-proficiency-suggestion.is-focus {
  border-color: var(--app-focus-ring, #2e90fa);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--app-focus-ring, #2e90fa) 28%, transparent);
}

.skills-proficiency-suggestion__copy { min-width: 0; }
.skills-proficiency-suggestion__copy > strong {
  color: #101828;
  display: block;
  font-size: 13px;
}
.skills-proficiency-suggestion__copy p {
  color: #475467;
  font-size: 12px;
  line-height: 1.4;
  margin: 3px 0;
}
.skills-proficiency-suggestion__copy small {
  color: #667085;
  font-size: 11px;
}
.skills-proficiency-suggestion__actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}
.skills-proficiency-suggestion__pending {
  background: #f4ebff;
  border: 1px solid #e9d7fe;
  border-radius: 999px;
  color: #6941c6;
  font-size: 11px;
  font-weight: 800;
  padding: 5px 9px;
}

@media (max-width: 700px) {
  .skills-proficiency-suggestion {
    align-items: stretch;
    flex-direction: column;
  }
  .skills-proficiency-suggestion__actions { justify-content: flex-end; }
}

/* Match the KeshBoard / Watchlist scope switch for paired view controls. */
.pm-manage-scope-switch {
  align-items: center;
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  display: inline-flex;
  margin-top: 0;
  overflow: hidden;
}

.pm-manage-scope-switch__link {
  align-items: center;
  background: transparent;
  border: 0;
  border-right: 1px solid #cbd5e1;
  color: #475569;
  cursor: pointer;
  display: inline-flex;
  font-size: 13px;
  font-weight: 800;
  justify-content: center;
  line-height: 1.4;
  min-height: 32px;
  padding: 6px 12px;
  text-decoration: none;
  transition: background .15s, color .15s;
}

.pm-manage-scope-switch__link:last-child { border-right: 0; }
.pm-manage-scope-switch__link:hover { background: #e2e8f0; }
.pm-manage-scope-switch__link.is-active,
.pm-manage-scope-switch__link[aria-pressed="true"] {
  background: var(--app-tab-active-bg, var(--keshero-dark-blue, #075985));
  color: var(--app-tab-active-text, #fff);
}

.skills-proficiency-board {
  align-items: stretch;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr);
  max-height: 28rem;
  min-height: 0;
  min-width: 0;
  width: 100%;
}
.skills-proficiency-board.has-alpha-nav {
  grid-template-columns: minmax(0, 1fr) 28px;
}
.skills-proficiency-board .skills-proficiency-list {
  align-content: start;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  max-height: 28rem;
  min-height: 0;
  min-width: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 2px 4px 2px 2px;
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}
.skills-proficiency-list--grouped {
  align-content: start;
  display: flex;
  flex-direction: column;
  gap: 14px;
  grid-template-columns: none;
}
.skills-proficiency-group {
  display: grid;
  gap: 8px;
  min-width: 0;
  scroll-margin-top: 8px;
}
.skills-proficiency-group__header {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  min-width: 0;
}
.skills-proficiency-group__title {
  color: #101828;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.25;
  margin: 0;
}
.skills-proficiency-group__count {
  color: #667085;
  font-size: 12px;
  font-weight: 700;
}
.skills-proficiency-group__cards {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}
.skills-proficiency-group__cards > .skills-proficiency-card {
  flex: 0 1 220px;
  max-width: 260px;
  min-width: min(220px, 100%);
  width: auto;
}
.skills-proficiency-alpha {
  align-content: start;
  display: flex;
  flex-direction: column;
  gap: 1px;
  max-height: 28rem;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 2px 0;
  scrollbar-width: none;
}
.skills-proficiency-alpha[hidden] {
  display: none !important;
}
.skills-proficiency-alpha::-webkit-scrollbar {
  display: none;
}
.skills-proficiency-alpha__btn {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 4px;
  color: #175cd3;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 800;
  height: 18px;
  justify-content: center;
  line-height: 1;
  margin: 0;
  min-width: 18px;
  padding: 0;
  width: 100%;
}
.skills-proficiency-alpha__btn:hover:not(:disabled) {
  background: #eff8ff;
  color: #0b78a5;
}
.skills-proficiency-alpha__btn:disabled {
  color: #d0d5dd;
  cursor: default;
}
.skills-proficiency-alpha__btn:focus-visible {
  outline: 2px solid #98a2b3;
  outline-offset: 1px;
}

.skills-proficiency-table-wrap {
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 12px;
  box-shadow: 0 5px 14px rgba(15, 23, 42, .06);
  box-sizing: border-box;
  overflow: auto;
  width: 100%;
}

.skills-proficiency-aggregate-wrap {
  margin-top: 0;
  min-width: 0;
  width: 100%;
}

.skills-proficiency-aggregate-chart {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  width: 100%;
}

.skills-proficiency-aggregate-row {
  align-items: center;
  display: grid;
  gap: 10px 12px;
  grid-template-columns: minmax(140px, 200px) minmax(0, 1fr) minmax(140px, 280px);
  min-width: 0;
}

.skills-proficiency-aggregate-row__label {
  color: #101828;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  min-width: 0;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.skills-proficiency-aggregate-row__track {
  background: #f2f4f7;
  border-radius: 6px;
  height: 24px;
  min-width: 0;
  overflow: hidden;
  width: 100%;
}

.skills-proficiency-aggregate-row__fill {
  background: #175cd3;
  border-radius: 6px;
  display: block;
  height: 100%;
  min-width: 0;
  transition: width 0.25s ease;
  width: 0;
}

.skills-proficiency-aggregate-row__fill.has-value {
  min-width: 4px;
}

.skills-proficiency-aggregate-row__meta {
  align-items: center;
  display: flex;
  gap: 8px;
  min-width: 0;
}

.skills-proficiency-aggregate__count-pill {
  align-items: center;
  background: #eef4ff;
  border: 1px solid #c7d7fe;
  border-radius: 999px;
  color: #175cd3;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 800;
  justify-content: center;
  line-height: 1;
  min-width: 2rem;
  padding: 6px 10px;
}

.skills-proficiency-aggregate__people {
  color: #475467;
  flex: 1 1 auto;
  font-size: 13px;
  line-height: 1.35;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .skills-proficiency-aggregate-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }

  .skills-proficiency-aggregate-row__label {
    text-align: left;
  }

  .skills-proficiency-aggregate-row__meta {
    grid-column: 1;
  }
}

.skills-proficiency-table {
  border-collapse: separate;
  border-spacing: 0;
  margin: 0;
  min-width: 680px;
  table-layout: fixed;
  width: 100%;
}

.skills-proficiency-table th {
  background: #f8fafc;
  border-bottom: 1px solid #dbe5ef;
  color: #344054;
  font-size: 12px;
  font-weight: 800;
  padding: 11px 14px;
  text-align: left;
  white-space: nowrap;
}

.skills-proficiency-table th:first-child { border-radius: 11px 0 0; }
.skills-proficiency-table th:last-child { border-radius: 0 11px 0 0; }
.skills-proficiency-table th button {
  justify-content: flex-start;
  text-align: left;
  width: 100%;
}

.skills-proficiency-table td {
  border-bottom: 1px solid #e7edf4;
  color: #344054;
  font-size: 12px;
  line-height: 1.45;
  padding: 12px 14px;
  vertical-align: middle;
}

.skills-proficiency-table tbody tr:last-child td { border-bottom: 0; }
.skills-proficiency-table tbody tr:hover td { background: #f8fbff; }
.skills-proficiency-table th:nth-child(1),
.skills-proficiency-table td:nth-child(1) { width: 23%; }
.skills-proficiency-table th:nth-child(2),
.skills-proficiency-table td:nth-child(2) { width: 41%; }
.skills-proficiency-table th:nth-child(3),
.skills-proficiency-table td:nth-child(3) { width: 18%; }
.skills-proficiency-table th:nth-child(4),
.skills-proficiency-table td:nth-child(4) { text-align: center !important; width: 18%; }
.skills-proficiency-table th:nth-child(1),
.skills-proficiency-table td:nth-child(1) { text-align: left !important; }
.skills-proficiency-table th:nth-child(2),
.skills-proficiency-table td:nth-child(2),
.skills-proficiency-table th:nth-child(3),
.skills-proficiency-table td:nth-child(3) { text-align: center !important; }
.skills-proficiency-table th:nth-child(n+2) button { justify-content: center; text-align: center; }
.skills-proficiency-table td:first-child { color: #101828; font-weight: 800; }
.skills-proficiency-table td:nth-child(2) { overflow-wrap: anywhere; }
.skills-proficiency-table__notes-cell,
.skills-proficiency-table__notes {
  text-align: left !important;
}
.skills-proficiency-table td:last-child > * { margin-left: auto; margin-right: auto; }

.skills-proficiency-table__action-row,
.skills-proficiency-card__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: center;
}

.skills-proficiency-card__actions { justify-content: flex-end; }
.skills-proficiency-table__action-row { flex-wrap: nowrap; gap: 4px; }

.skills-proficiency-search__meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  margin-top: 0;
}

.skills-proficiency-search__match {
  align-items: center;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  display: inline-flex;
  overflow: hidden;
}

.skills-proficiency-search__match-btn {
  background: transparent;
  border: 0;
  color: #667085;
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  min-height: 30px;
  padding: 5px 10px;
}

.skills-proficiency-search__match-btn.is-active {
  background: #175cd3;
  color: #fff;
}

.skills-proficiency-search__hint {
  color: #98a2b3;
  font-size: 11px;
  line-height: 1.35;
  margin: 0;
}

.development-plan-skills .skills-proficiency-search__hint {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.skills-proficiency-modal:not([hidden]) {
  align-items: center;
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 24px;
  position: fixed;
  z-index: 1200;
}

.skills-proficiency-modal__backdrop {
  backdrop-filter: blur(4px);
  background: rgba(15, 23, 42, 0.5);
  inset: 0;
  position: absolute;
}

.skills-proficiency-modal__dialog {
  --app-popup-banner-inset-top: 0px;
  --app-popup-banner-inset-x: 0px;
  background: #fff;
  border: 1px solid #d7e2ee;
  border-radius: 14px;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.24), 0 4px 14px rgba(15, 23, 42, 0.08);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  max-height: min(720px, calc(100vh - 48px));
  max-width: min(560px, calc(100vw - 32px));
  overflow: hidden;
  position: relative;
  width: min(560px, 100%);
  z-index: 1;
  animation: skills-proficiency-modal-in .18s ease-out;
}

.skills-proficiency-modal__dialog--compact {
  max-width: min(520px, calc(100vw - 32px));
  width: min(520px, 100%);
}

.skills-proficiency-modal__dialog--add-skill {
  max-width: min(720px, calc(100vw - 32px));
  width: min(720px, 100%);
}

.skills-proficiency-form[hidden],
.skills-library-browser[hidden] { display: none !important; }
.skills-library-browser {
  display: grid;
  gap: 14px;
  padding: 20px;
  overflow-y: auto;
  min-height: 0;
}
.skills-library-browser__heading,
.skills-library-browser__pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.skills-library-browser h4, .skills-library-browser p { margin: 0; }
.skills-library-browser label { display: grid; gap: 6px; }
.skills-library-browser__results { display: grid; gap: 8px; }
.skills-library-browser__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 12px 14px;
  border: 1px solid #d7e2ee;
  border-radius: 8px;
}
.skills-library-browser__row p { margin-top: 4px; overflow-wrap: anywhere; }
.skills-library-browser__row summary { cursor: pointer; font-size: 12px; margin-top: 4px; }

@keyframes skills-proficiency-modal-in {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.skills-proficiency-modal__header {
  background: var(--app-popup-header-bg, #f5faff) !important;
  border-bottom: 1px solid var(--app-popup-header-border, #d7e4f2) !important;
  display: block;
  padding: 0 !important;
}

.skills-proficiency-modal__header-inner {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  min-height: 58px;
  padding: 13px 20px;
  width: 100%;
}

.skills-proficiency-modal__header h3 {
  color: #101828;
  font-size: 17px;
  font-weight: 850;
  letter-spacing: -0.01em;
  line-height: 1.25;
  margin: 0;
}

.skills-proficiency-modal__header-inner > .button-neutral-action {
  flex: 0 0 auto;
  margin-left: auto;
  min-height: 32px;
  padding: 6px 12px;
}

.skills-proficiency-form {
  display: grid;
  gap: 18px;
  overflow: auto;
  padding: 20px;
}

.skills-proficiency-form__intro {
  color: #667085;
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
}

.skills-proficiency-form__wide {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.skills-proficiency-form__wide > span:first-child {
  color: #26374d;
  font-size: 12.5px;
  font-weight: 800;
}

.skills-proficiency-form__wide :is(input, select, textarea) {
  border-color: #c9d6e5;
  border-radius: 9px;
  box-sizing: border-box;
  width: 100%;
}

.skills-proficiency-form__wide :is(input, select) { min-height: 42px; }
.skills-proficiency-form__wide textarea { min-height: 94px; resize: vertical; }
.skills-proficiency-form__wide :is(input, select, textarea):focus {
  border-color: #4a9ee8;
  box-shadow: 0 0 0 3px rgba(39, 137, 221, .12);
  outline: none;
}

.skills-proficiency-form__actions {
  align-items: flex-start;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin: 2px -20px -20px;
  /* Extra bottom room for absolute Unsaved Changes under Save. */
  padding: 14px 20px 28px;
}

.skills-proficiency-form__actions .button-small { min-width: 94px; }
.skills-proficiency-form__actions .button-save-small { min-width: 120px; }

.skills-proficiency-autocomplete {
  min-width: 0;
  position: relative;
}

.skills-proficiency-autocomplete__field {
  min-width: 0;
  position: relative;
  width: 100%;
}

.skills-proficiency-autocomplete--library {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.skills-proficiency-autocomplete__browse {
  min-height: var(--app-control-height, 38px);
  white-space: nowrap;
}

.skills-proficiency-autocomplete__field > .app-change-field.is-changed {
  box-sizing: border-box;
  display: grid;
  min-width: 0;
  width: 100%;
}

.skills-proficiency-autocomplete__field > .app-change-field.is-changed > input[type="text"] {
  box-sizing: border-box;
  min-width: 0;
  padding-right: 44px;
  width: 100%;
}

.skills-proficiency-autocomplete > input,
.skills-proficiency-autocomplete__field > input[type="text"] {
  padding-right: 44px;
}

.skills-proficiency-autocomplete__dismiss {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: #d92d20;
  cursor: pointer;
  display: inline-flex;
  font-size: 20px;
  font-weight: 700;
  height: 26px;
  justify-content: center;
  line-height: 1;
  padding: 0 0 2px;
  position: absolute;
  right: 9px;
  top: 8px;
  transition: background-color .15s ease, box-shadow .15s ease, color .15s ease;
  width: 26px;
  z-index: 4;
}

.skills-proficiency-autocomplete__dismiss:hover,
.skills-proficiency-autocomplete__dismiss:focus-visible {
  background: #fff1f0;
  box-shadow: inset 0 0 0 1px #fda29b;
  color: #b42318;
  outline: none;
}

.skills-proficiency-autocomplete__dismiss[hidden] { display: none; }

.skills-proficiency-autocomplete__list {
  background: #fff;
  border: 1px solid #cfdbea;
  border-radius: 12px;
  box-shadow: 0 16px 36px rgba(16, 24, 40, 0.18);
  left: 0;
  list-style: none;
  margin: 7px 0 0;
  max-height: 458px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 6px;
  position: absolute;
  right: 0;
  scrollbar-color: #98a2b3 #f2f4f7;
  scrollbar-width: thin;
  top: 100%;
  z-index: 3;
}

.skills-proficiency-autocomplete__list > li {
  align-items: flex-start;
  border: 1px solid transparent;
  border-radius: 8px;
  box-sizing: border-box;
  color: #344054;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  font-size: 13px;
  gap: 3px;
  justify-content: center;
  line-height: 1.3;
  min-height: 44px;
  padding: 8px 11px;
  transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}

.skills-proficiency-autocomplete__list > li + li {
  border-top-color: #eef2f6;
}

.skills-proficiency-autocomplete__list > li:hover,
.skills-proficiency-autocomplete__list > li:focus,
.skills-proficiency-autocomplete__list > li[aria-selected="true"] {
  background: #eaf4ff;
  border-color: #84caff;
  color: #0b4a6f;
  outline: none;
}

.skills-proficiency-autocomplete__option-name {
  font-weight: 700;
}

.skills-proficiency-autocomplete__meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  font-size: 11px;
  gap: 6px;
}

@media (max-width: 640px) {
  .skills-proficiency-toolbar-actions {
    justify-content: flex-start;
  }

  .skills-proficiency-modal:not([hidden]) {
    align-items: flex-end;
    padding: 12px;
  }

  .skills-proficiency-modal__dialog {
    max-height: calc(100vh - 24px);
    max-width: 100%;
    width: 100%;
  }

  .skills-proficiency-modal__header-inner { padding: 13px 16px; }
  .skills-proficiency-form { padding: 18px 16px; }
  .skills-proficiency-form__actions { margin: 2px -16px -18px; padding: 14px 16px; }
}

@media (max-width: 520px) {
  .skills-proficiency-autocomplete--library {
    align-items: stretch;
    grid-template-columns: minmax(0, 1fr);
  }
}


/* ADMIN SETUP CHECKLIST (moved from admin_home) */
.admin-cheat-sheet {
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.04);
  display: grid;
  gap: 14px;
  overflow: visible;
  padding: 16px;
  position: relative;
}
/* SETUP-DRAWER: inner cheat-sheet card styles (overlay chrome lives in setup-checklist.css). */
.admin-cheat-sheet--drawer {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  display: grid;
  gap: 12px;
  max-width: none;
  overflow: visible;
  padding: 0;
  width: 100%;
}
.admin-cheat-sheet--drawer::before {
  display: none;
}
.admin-cheat-sheet--drawer .admin-cheat-sheet__head {
  border-bottom: 0;
  padding-bottom: 0;
}
.admin-cheat-sheet--drawer .admin-cheat-sheet__head p {
  font-size: 12px;
  line-height: 1.45;
}
.admin-cheat-sheet--drawer .admin-cheat-sheet__quick-links {
  gap: 6px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-cheat-sheet--drawer .admin-cheat-sheet__quick-links a {
  min-height: 34px;
  padding: 7px 8px;
}
.admin-cheat-sheet--drawer .admin-cheat-sheet__sequence,
.admin-cheat-sheet--drawer .admin-cheat-sheet__card {
  padding: 12px;
}
.setup-checklist-step {
  align-items: flex-start;
  color: #344054;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 600;
  gap: 8px;
  line-height: 1.4;
  margin: 0 0 8px;
}
.setup-checklist-step input {
  flex: 0 0 auto;
  margin-top: 2px;
}
.help-topic-card__link button.help-topic-card__link,
button.help-topic-card__link {
  background: none;
  border: 0;
  color: #026aa2;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  padding: 0;
  text-align: left;
  text-decoration: underline;
}
.help-topic-card__link button.help-topic-card__link:hover,
button.help-topic-card__link:hover {
  color: #075985;
}
.admin-cheat-sheet__head {
  border-bottom: 1px solid #e5edf6;
  display: grid;
  gap: 4px;
  padding-bottom: 12px;
}
.admin-cheat-sheet__head h3 {
  color: #101828;
  font-size: 18px;
  margin: 0;
}
.admin-cheat-sheet__head p {
  color: #667085;
  font-size: 12px;
  line-height: 1.4;
  margin: 0;
}
.admin-cheat-sheet__quick-links {
  display: grid;
  gap: 7px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-cheat-sheet__quick-links a,
.admin-cheat-sheet__sequence a,
.admin-cheat-sheet__card a {
  align-items: center;
  background: #ffffff;
  border: 1px solid #dfe5ec;
  border-radius: 7px;
  color: #344054;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  justify-content: center;
  line-height: 1.15;
  min-height: 32px;
  padding: 7px 9px;
  text-align: center;
  text-decoration: none;
}
.admin-cheat-sheet__quick-links a:hover,
.admin-cheat-sheet__sequence a:hover,
.admin-cheat-sheet__card a:hover {
  background: #f2f4f7;
  border-color: #98a2b3;
  color: #101828;
}
.admin-cheat-sheet__sequence,
.admin-cheat-sheet__card {
  background: #f8fafc;
  border: 1px solid #eaecf0;
  border-radius: 10px;
  display: grid;
  gap: 8px;
  padding: 12px;
}
.admin-cheat-sheet__section-toggle {
  align-items: center;
  background: transparent;
  border: 0;
  color: #101828;
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: 13px;
  font-weight: 950;
  gap: 8px;
  line-height: 1.2;
  margin: -2px;
  min-height: 28px;
  padding: 2px;
  text-align: left;
  width: calc(100% + 4px);
}
.admin-cheat-sheet__section-toggle:hover,
.admin-cheat-sheet__section-toggle:focus-visible {
  color: #175cd3;
  outline: none;
}
.admin-cheat-sheet__section-toggle:focus-visible {
  border-radius: 6px;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.2);
}
.admin-cheat-sheet__section-chevron {
  border-bottom: 2px solid #315b86;
  border-right: 2px solid #315b86;
  box-sizing: border-box;
  flex: 0 0 auto;
  height: 8px;
  transition: transform 0.16s ease;
  transform: rotate(-45deg);
  transform-origin: 50% 50%;
  width: 8px;
}
.admin-cheat-sheet__sequence.is-open .admin-cheat-sheet__section-chevron,
.admin-cheat-sheet__card.is-open .admin-cheat-sheet__section-chevron {
  transform: rotate(45deg);
}
.admin-cheat-sheet__section-title {
  min-width: 0;
}
.admin-cheat-sheet__section-body {
  display: grid;
  gap: 8px;
  padding-top: 2px;
}
.admin-cheat-sheet__section-body[hidden] {
  display: none;
}
.admin-cheat-sheet__sequence.is-collapsed,
.admin-cheat-sheet__card.is-collapsed {
  gap: 0;
}
.admin-cheat-sheet__sequence ol,
.admin-cheat-sheet__card ol,
.admin-cheat-sheet__card ul {
  color: #475467;
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
  padding-left: 18px;
}
.admin-cheat-sheet__card li + li,
.admin-cheat-sheet__sequence li + li {
  margin-top: 4px;
}
.admin-cheat-sheet__card p {
  color: #667085;
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
}
.admin-cheat-sheet__links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.admin-cheat-sheet__links a {
  justify-content: center;
}
.admin-cheat-sheet__links--step {
  margin-top: 6px;
}
.admin-cheat-sheet__links--step a {
  font-size: 11px;
  min-height: 28px;
  padding: 5px 7px;
}
.admin-cheat-sheet__note {
  background: #f8fafc;
  border: 1px solid #e4e7ec;
  border-radius: 7px;
  color: #344054;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  padding: 8px;
}
.admin-cheat-sheet__example {
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 7px;
  color: #78350f;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.35;
  padding: 8px;
}
.admin-cheat-sheet::before {
  background: var(--app-container-accent-line-custom, linear-gradient(90deg, #2ec5ff, #5a4bff 49%, #8a2be2));
  content: "";
  height: 3px;
  inset: 0 0 auto;
  position: absolute;
}
.admin-cheat-sheet__top {
  align-items: start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}
.admin-cheat-sheet__eyebrow {
  color: #0477a6;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .06em;
  margin-bottom: 3px;
  text-transform: uppercase;
}
.admin-cheat-sheet__toggle {
  align-items: center;
  background: #fff;
  border: 1px solid #d0d5dd;
  border-radius: 7px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 950;
  justify-content: center;
  min-height: 28px;
  padding: 5px 9px;
}
.admin-cheat-sheet__toggle-chevron {
  display: none;
}
.admin-cheat-sheet__toggle:hover,
.admin-cheat-sheet__toggle:focus-visible {
  background: #f8fafc;
  border-color: #98a2b3;
  color: var(--keshero-teal, #2ec5ff);
}
.admin-cheat-sheet__search {
  background: #f8fbff;
  border: 1px solid #d8e6f5;
  border-radius: 8px;
  display: grid;
  gap: 5px;
  padding: 9px;
}
.admin-cheat-sheet__search span {
  color: #52637a;
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}
.admin-cheat-sheet__search input {
  background: #ffffff;
  border: 1px solid #d0d5dd;
  border-radius: 7px;
  box-sizing: border-box;
  color: #101828;
  font: inherit;
  height: 34px;
  min-width: 0;
  padding: 7px 10px;
  width: 100%;
}
.admin-cheat-sheet__search input:focus {
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.18);
  outline: none;
}
.admin-cheat-sheet__sequence,
.admin-cheat-sheet__card {
  overflow: hidden;
  position: relative;
}
.admin-cheat-sheet__section-toggle:hover {
  background: #eef2f6;
  border-radius: 6px;
}
.admin-cheat-sheet__empty {
  background: #f8fafc;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  color: #667085;
  font-size: 12px;
  font-weight: 850;
  padding: 12px;
  text-align: center;
}
.admin-cheat-sheet.is-collapsed {
  align-items: center;
  background: #ffffff;
  gap: 0;
  justify-items: center;
  min-height: 250px;
  overflow: hidden;
  padding: 10px 6px;
  width: 54px;
}
.admin-cheat-sheet.is-collapsed::before {
  background: linear-gradient(180deg, var(--app-container-accent-custom, #2ec5ff), var(--app-container-accent-end-custom, #5a4bff));
  height: auto;
  inset: 0 0 0 auto;
  width: 4px;
}
.admin-cheat-sheet.is-collapsed > :not(.admin-cheat-sheet__head) {
  display: none;
}
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__head {
  align-items: center;
  border-bottom: 0;
  display: grid;
  gap: 10px;
  justify-items: center;
  padding-bottom: 0;
}
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__head p,
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__eyebrow {
  display: none;
}
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__top {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 224px;
}
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__head h3 {
  color: #1849a9;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .02em;
  line-height: 1;
  margin: 0;
  text-align: center;
  text-orientation: mixed;
  text-transform: uppercase;
  white-space: nowrap;
  writing-mode: vertical-rl;
}
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__toggle {
  background: #eff8ff;
  border-color: #84caff;
  border-radius: 999px;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.08);
  color: #075985;
  height: 34px;
  min-height: 34px;
  padding: 0;
  width: 34px;
  writing-mode: horizontal-tb;
}
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__toggle:hover,
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__toggle:focus-visible {
  background: #dff4ff;
  border-color: #2ec5ff;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.18);
  outline: none;
}
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__toggle-text {
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute;
  width: 1px;
}
.admin-cheat-sheet.is-collapsed .admin-cheat-sheet__toggle-chevron {
  border-bottom: 3px solid currentColor;
  border-right: 3px solid currentColor;
  display: inline-block;
  height: 9px;
  margin-top: -4px;
  transform: rotate(45deg);
  width: 9px;
}
@media (max-width: 1100px) {
  .admin-cheat-sheet--drawer .admin-cheat-sheet__quick-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .admin-cheat-sheet__quick-links,
  .admin-cheat-sheet--drawer .admin-cheat-sheet__quick-links {
    grid-template-columns: 1fr;
  }
}

/* App-wide table standard: column titles remain visible while rows scroll.
   Exceptional presentation tables can opt out with data-sticky-header="false". */
:where(table:not([data-sticky-header="false"])) > thead > tr > th {
  background-color: var(--app-table-header-bg, #f8fafc);
  background-clip: padding-box;
  box-shadow: inset 0 -1px 0 var(--app-table-border, #dbe5ef);
  position: sticky !important;
  top: var(--app-table-sticky-top, 0px) !important;
  z-index: 5;
}

/* The compact topbar search has a 36px shell and 28px centered inner controls.
   Keep semantic button classes from stretching its component-specific actions. */
.topbar-search > .topbar-search__composer,
.topbar-search > .topbar-search__leading,
.topbar-search > .topbar-search__add-term,
.topbar-search > .topbar-search__submit {
  align-self: center;
}

.topbar-search .topbar-search__input {
  align-self: center;
  box-sizing: border-box;
  height: 28px;
  line-height: 28px;
  min-height: 28px;
}

.topbar-search > .topbar-search__add-term,
.topbar-search > .topbar-search__submit {
  height: 28px !important;
  min-height: 28px !important;
}

.topbar-search > .topbar-search__add-term {
  padding: 0 8px !important;
}

.topbar-search > .topbar-search__submit {
  padding: 0 !important;
}

/* Favorites management is an in-context utility panel, not a blocking task. */
.favorites-manage-modal,
.start-page-modal {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.favorites-manage-modal > .favorites-modal__backdrop,
.start-page-modal > .favorites-modal__backdrop {
  backdrop-filter: none;
  background: transparent;
}

.favorites-manage-modal__dialog {
  border-color: #b9dff5 !important;
  border-radius: 16px !important;
  box-shadow: 0 22px 60px rgba(15, 23, 42, 0.2) !important;
  left: auto;
  max-height: calc(100vh - 116px);
  right: 64px;
  top: 92px;
  transform: none;
}

.start-page-modal__dialog {
  border-color: #b9dff5 !important;
  border-radius: 16px !important;
  box-shadow: 0 22px 60px rgba(15, 23, 42, 0.2) !important;
  left: auto;
  max-height: calc(100vh - 116px);
  right: 64px;
  top: 92px;
  transform: none;
}

@media (max-width: 760px) {
  .favorites-manage-modal__dialog,
  .start-page-modal__dialog {
    left: 16px;
    max-height: calc(100vh - 96px);
    right: 16px;
    top: 72px;
    width: auto;
  }
}

/* Reporting hub / canvas additions (appended into styles.css) */

.reporting-hub-search {
  grid-template-columns: minmax(280px, 2fr) auto auto;
}

.reporting-controls--sticky {
  position: sticky;
  top: 8px;
  z-index: 20;
  backdrop-filter: blur(8px);
  background: color-mix(in srgb, var(--app-surface) 92%, #fff);
}

.reporting-domain-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.reporting-domain-chip {
  align-items: center;
  background: #f2f4f7;
  border: 1px solid #d0d5dd;
  border-radius: 999px;
  color: #344054;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  min-height: 34px;
  padding: 6px 12px;
}

.reporting-domain-chip:hover {
  background: #eaecf0;
  border-color: #b8c4d3;
}

.reporting-domain-chip:focus-visible {
  border-color: var(--app-action-primary);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
  outline: none;
}

.reporting-domain-chip.is-active,
.reporting-domain-chip[aria-pressed="true"] {
  background: #eff8ff;
  border-color: #b2ddff;
  color: #175cd3;
  box-shadow: 0 0 0 3px rgba(46, 197, 255, 0.12);
}

.reporting-domain-chip__count {
  background: rgba(15, 23, 42, 0.06);
  border-radius: 999px;
  color: inherit;
  font-size: 11px;
  font-weight: 800;
  min-width: 1.4rem;
  padding: 1px 6px;
  text-align: center;
}

.reporting-domain-chip.is-active .reporting-domain-chip__count,
.reporting-domain-chip[aria-pressed="true"] .reporting-domain-chip__count {
  background: rgba(23, 92, 211, 0.12);
}

.reporting-controls__meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-top: 12px;
}

.reporting-controls__hint {
  color: var(--app-muted);
  font-size: 12px;
  font-weight: 700;
  margin: 0;
}

.reporting-sensitivity-legend [data-sensitivity-filter] { cursor: pointer; box-shadow: none; }
.reporting-sensitivity-legend [data-sensitivity-filter][aria-pressed="true"] { outline: 2px solid currentColor; outline-offset: 2px; box-shadow: inset 0 0 0 1px currentColor; }
.reporting-sensitivity-legend [data-sensitivity-filter]:focus-visible { outline: 2px solid #087bad; outline-offset: 3px; }
.reporting-sensitivity-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 0;
}

.reporting-badge {
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.02em;
  padding: 3px 9px;
  text-transform: uppercase;
}

.reporting-badge--standard {
  background: #ecfdf3;
  color: #027a48;
  border: 1px solid #abefc6;
}

.reporting-badge--sensitive {
  background: #fffaeb;
  color: #b54708;
  border: 1px solid #fedf89;
}

.reporting-badge--restricted {
  background: #fef3f2;
  color: #b42318;
  border: 1px solid #fecdca;
}

.reporting-chip {
  background: #f2f4f7;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #344054;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
}

.reporting-chip--locked {
  background: #fef3f2;
  border-color: #fecdca;
  color: #b42318;
}

.reporting-eyebrow--section {
  margin-bottom: 2px;
}

.reporting-section-header--domain {
  align-items: flex-end;
  margin-bottom: 12px;
}

.reporting-domain-count {
  background: #f2f4f7;
  border: 1px solid #e4e7ec;
  border-radius: 999px;
  color: #475467;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 10px;
  white-space: nowrap;
}

.reporting-card-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

/* Author display rules must not override the catalog filters' hidden state. */
.reporting-hub [data-reporting-card][hidden],
.reporting-hub [data-reporting-domain-section][hidden],
.reporting-hub [data-reporting-filter-empty][hidden] {
  display: none !important;
}

.reporting-favorites-table-wrap { overflow-x: auto; }
.reporting-favorites-table { width: 100%; border-collapse: collapse; text-align: left; }
.reporting-favorites-table th { padding: 10px 12px; background: #f8fafc; color: #64748b; font-size: 11px; }
.reporting-favorites-table td { padding: 12px; border-bottom: 1px solid #e2e8f0; vertical-align: middle; }
.reporting-favorites-table td:nth-child(2) { min-width: 220px; }
.reporting-hub .reporting-favorites-table th:nth-child(2),
.reporting-hub .reporting-favorites-table td:nth-child(2),
.reporting-hub .reporting-favorites-table td:nth-child(2) p { text-align: left !important; }
.reporting-hub .reporting-favorites-table th:first-child,
.reporting-hub .reporting-favorites-table td:first-child { text-align: center !important; }
.reporting-hub .reporting-favorites-table td:first-child .reporting-card__favorite { margin-inline: auto; }
.reporting-favorites-table td p { margin: 4px 0 0; color: #64748b; font-size: 12px; max-width: 520px; }
.reporting-favorites-table td:last-child { white-space: nowrap; }
.reporting-favorites-table tbody tr:hover { background: #f8fbff; }
.reporting-card {
  background: #fff;
  border: 1px solid var(--app-border);
  border-radius: 12px;
  box-shadow: 0 4px 13px rgba(16, 24, 40, 0.04);
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 100%;
  padding: 16px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.reporting-card:hover {
  border-color: #b8c4d3;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.08);
}

.reporting-card:focus-within {
  border-color: var(--app-action-primary);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
}

.reporting-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.reporting-card__top > .reporting-card__title {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}

.reporting-card__top > .reporting-card__badges {
  flex: 0 0 auto;
  justify-content: flex-end;
  flex-wrap: nowrap;
}

.reporting-card__info-row { justify-content: flex-start; text-align: left; }
.reporting-collapse-body[hidden] { display: none !important; }
.reporting-section-toggle.app-disclosure-chevron { --app-disclosure-chevron-color:#475467; --app-disclosure-chevron-size:7px; --app-disclosure-chevron-thickness:2px; flex:0 0 28px; width:28px; height:28px; margin:0; padding:0; border:0; border-radius:6px; background:transparent; cursor:pointer; }
.reporting-section-toggle.app-disclosure-chevron:hover { --app-disclosure-chevron-color:#101828; background:#f2f4f7; }
.reporting-section-toggle.app-disclosure-chevron:focus-visible { outline:2px solid #98a2b3; outline-offset:1px; }
.reporting-saved > .reporting-section-header h2 { margin:0; font-size:20px; }
.reporting-card__info-row summary > span { font-weight: 600; }
.reporting-purpose-filters { margin: 0 0 14px; }
.reporting-saved > h2 { margin: 0 0 6px; font-size: 20px; }
.reporting-saved-group { margin-top: 18px; border: 1px solid #dbe3ee; border-radius: 10px; overflow: hidden; }
.reporting-saved-original { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 16px; background: #f8fafc; border-bottom: 1px solid #e2e8f0; }
.reporting-saved-eyebrow { font-size: 10px; color: #64748b; font-weight: 600; }
.reporting-saved-original h3 { margin: 3px 0 0; font-size: 14px; }
.reporting-saved-table-wrap { overflow-x: auto; }
.reporting-saved-variations { width: 100%; border-collapse: collapse; margin: 0; text-align: left; }
.reporting-saved-variations th { padding: 9px 18px; color: #64748b; font-size: 11px; font-weight: 600; background: #fafcfe; }
.reporting-saved-variations th:last-child { text-align: right; }
.reporting-saved-row { border-bottom: 1px solid #edf2f7; }
.reporting-saved-row td { padding: 8px 12px; vertical-align: middle; }
.reporting-saved-filters { display:flex; flex-wrap:wrap; align-items:end; gap:10px; margin-top:14px; }
.reporting-saved-filters label { display:flex; flex-direction:column; gap:5px; font-size:11px; color:#64748b; flex:1 1 150px; min-width:0; }
.reporting-saved-filters label:first-child { flex:2 1 240px; }
.reporting-saved-filters input, .reporting-saved-filters select { width:100%; box-sizing:border-box; padding:8px 10px; border:1px solid #dbe3ee; border-radius:7px; background:#fff; }
.reporting-saved-filter-status { margin:8px 0 0; color:#64748b; font-size:11px; }
.reporting-hub [data-saved-filter-empty][hidden] { display:none!important; }
.reporting-saved-variations { table-layout: fixed; min-width: 1100px; }
.reporting-saved-variations th:first-child { width: 64px; }
.reporting-saved-variations th:nth-child(2) { width: 19%; }
.reporting-saved-variations th:nth-child(3) { width: 180px; }
.reporting-saved-variations th:nth-child(4) { width: 85px; }
.reporting-saved-variations th:nth-child(5) { width: 110px; }
.reporting-saved-domain { color: #475569; font-size: 11px; text-align: left !important; }
.reporting-saved-variations th:last-child { width: 280px; }
.reporting-more-menu:popover-open { display: flex; flex-direction: column; gap: 8px; padding: 12px; border: 1px solid #cbd5e1; border-radius: 8px; box-shadow: 0 12px 30px #0f172a26; }
.reporting-layout-choice { display:flex; align-items:center; gap:8px; margin:0; white-space:nowrap; min-width:150px; }
.reporting-layout-choice select { width:110px; }
.reporting-layout-choice > .ks-dropdown, .reporting-layout-choice > .ks-select { width:110px; }
.reporting-disclosure-title { display:flex; align-items:center; gap:8px; min-width:0; }
.reporting-section-header--domain { align-items:center; }
.reporting-history-pager { display:flex; align-items:center; justify-content:flex-end; gap:12px; margin-top:12px; }
.reporting-saved-variations td:first-child { text-align: center !important; }
.reporting-saved-row .reporting-saved-actions .reporting-action { white-space: nowrap; flex-shrink: 0; }
.reporting-saved-notes { white-space: pre-wrap; overflow-wrap: anywhere; color: #64748b; font-size: 12px; text-align: left !important; }
.reporting-hub [data-saved-library][hidden], .reporting-hub .reporting-saved-group[hidden], .reporting-hub [data-saved-id][hidden] { display: none !important; }
.reporting-saved-row:hover { background: #f8fbff; }
.reporting-saved-access { display: inline-block; padding: 3px 8px; border-radius: 6px; background: #f1f5f9; color: #475569; font-size: 11px; white-space: nowrap; }
.reporting-saved-row:last-child { border-bottom: 0; }
.reporting-saved-name { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 4px; min-width: 0; }
.reporting-saved-name > a, .reporting-saved-name > span { text-align: left; }
.reporting-saved-name a, .reporting-saved-name a:visited { color: #075985; font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.reporting-saved-name a:hover { text-decoration: underline; }
.reporting-saved-name > span { font-size: 11px; color: #64748b; }
.reporting-saved-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; flex-shrink: 0; }
.reporting-saved-actions .reporting-action { font-size: 11px; padding: 6px 10px; }
.reporting-saved-row .reporting-saved-actions { flex-wrap: nowrap; }
.reporting-saved-delete { color: #b91c1c; }
@media (max-width: 760px) {
  .reporting-saved-original { align-items: flex-start; flex-direction: column; gap: 10px; }
  .reporting-saved-actions { flex-shrink: 1; justify-content: flex-start; }
  .reporting-saved-variations { padding-left: 20px; }
}
.reporting-card__purpose { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.reporting-card__purpose-label { color: var(--app-text-muted, #64748b); font-size: 10px; margin-right: 2px; }
.reporting-purpose-tag { display: inline-flex; padding: 2px 7px; border-radius: 5px; font-size: 10px; line-height: 1.5; font-weight: 600; color: #475569; background: #f1f5f9; }
.reporting-purpose-tag--rating { color: #1e40af; background: #eff6ff; }
.reporting-purpose-tag--compensation { color: #6b21a8; background: #faf5ff; }
.reporting-purpose-tag--talent { color: #0f766e; background: #f0fdfa; }
.reporting-purpose-tag--growth-and-development { color: #166534; background: #f0fdf4; }
.reporting-purpose-tag--performance-progress { color: #075985; background: #f0f9ff; }
.reporting-info-icon { color: var(--app-action-primary, #159dd5); vertical-align: middle; margin-right: 5px; flex-shrink: 0; }
.reporting-card__info-row summary:hover .reporting-info-icon,
.reporting-card__info-row details[open] .reporting-info-icon { color: var(--app-action-primary-hover, #087bad); }
.reporting-card__favorite.reporting-action {
  box-sizing: border-box;
  width: 26px;
  height: 26px;
  min-width: 26px;
  min-height: 26px;
  padding: 2px;
  line-height: 1;
}
.reporting-favorite-star { display: inline-block; flex-shrink: 0; fill: none; stroke: #a66b00; stroke-width: 1.6; vertical-align: middle; }
.reporting-card__favorite[aria-pressed="true"] .reporting-favorite-star,
.reporting-library-tabs .reporting-favorite-star { fill: #facc15; }
.reporting-library-tabs .reporting-favorite-star { width: 16px; height: 16px; margin-right: 6px; }

.reporting-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  min-height: 24px;
}

.reporting-card__meta {
  color: var(--app-muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  margin: 0;
}

.reporting-card__meta-sep {
  margin: 0 4px;
  opacity: 0.7;
}

.reporting-card__title,
.reporting-card h4 {
  color: var(--app-heading);
  font-size: 16px;
  line-height: 1.3;
  margin: 0;
}

.reporting-card__desc,
.reporting-card p {
  color: var(--app-muted);
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
}

.reporting-card__desc {
  flex: 1 1 auto;
}

.reporting-card__footer {
  align-items: center;
  border-top: 1px solid #eef2f7;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
  margin-top: 4px;
  padding-top: 12px;
}

.reporting-card__cta-hint {
  color: var(--app-muted);
  font-size: 12px;
  font-weight: 700;
}

.reporting-action--primary {
  background: var(--app-action-primary);
  border-color: var(--app-action-primary-border);
  color: #fff;
}

.reporting-action--primary:hover {
  background: var(--app-action-primary-hover);
  border-color: var(--app-action-primary-border);
  color: #fff;
}

.reporting-card--locked {
  background: #fcfcfd;
  border-style: dashed;
  opacity: 1;
}

.reporting-card--locked:hover {
  box-shadow: 0 4px 13px rgba(16, 24, 40, 0.04);
  transform: none;
}

.reporting-locked-reason {
  color: #b42318 !important;
  flex: 1 1 12rem;
  font-size: 12px !important;
  font-weight: 700;
  margin: 0 !important;
}

.reporting-action--disabled {
  background: #e4e7ec;
  border-color: #d0d5dd;
  color: #667085;
  cursor: not-allowed;
  pointer-events: none;
}

.reporting-recent .reporting-section-header p {
  max-width: 40rem;
  margin: 0;
  font-size: 12px;
}
.reporting-recent .reporting-section-header { margin-bottom: 8px; }
.reporting-cycle-chooser {
  width: min(460px, calc(100vw - 32px)); max-height: calc(100vh - 48px); overflow: auto;
  padding: 22px; box-sizing: border-box; border: 1px solid #cbd5e1; border-radius: 14px;
  background: var(--app-surface, #fff); color: var(--app-field-text, #101828); box-shadow: 0 16px 48px #10182833;
}
.reporting-cycle-chooser::backdrop { background: #10182833; }
.reporting-cycle-chooser h3 { margin: 0; }
.reporting-cycle-chooser ul { list-style: none; padding: 0; margin: 16px 0; }
.reporting-cycle-chooser li a { display: block; padding: 10px 12px; border: 1px solid #dbe5ef; border-radius: 8px; margin-bottom: 6px; }
.reporting-cycle-chooser li a:hover, .reporting-cycle-chooser li a:focus-visible { background: #eff8ff; outline-color: #3978ff; }

.reporting-export-list {
  height: 180px;
  overflow-y: auto;
  scrollbar-gutter: stable;
  align-content: start;
  display: grid;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0 8px 0 0;
}

.reporting-export-list li {
  align-items: start;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 14px;
  border-bottom: 1px solid #eef2f7;
  padding: 9px 0;
}
.reporting-export-details { min-width: 0; padding-inline-start: 8px; }
.reporting-export-details > summary { cursor: pointer; font-size: 12px; line-height: 1.4; }
.reporting-export-title { display: inline-flex; align-items: center; gap: 8px; max-width: calc(100% - 24px); }
.reporting-export-title strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reporting-export-format { flex-shrink: 0; color: var(--app-muted); background: #f1f5f9; border-radius: 4px; padding: 1px 5px; font-size: 10px; font-weight: 700; }
.reporting-export-meta { display: block; color: var(--app-muted); font-size: 11px; margin: 3px 0 0 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reporting-export-settings { margin: 8px 0 0 16px; padding: 8px 10px; background: #f8fafc; border-radius: 6px; overflow-wrap: anywhere; font-size: 12px; }
.reporting-export-settings p { margin: 4px 0; font-size: 11px; }
.reporting-export-time { padding-top: 3px; font-size: 11px; white-space: nowrap; }
.reporting-export-open { padding: 4px 8px; border: 1px solid #dbe4ee; border-radius: 6px; color: var(--app-action-primary); text-decoration: none; font-size: 11px; font-weight: 600; white-space: nowrap; }
.reporting-export-open:hover { background: #eff8ff; }
@media (max-width: 640px) {
  .reporting-export-list li { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; }
  .reporting-export-time { grid-column: 1; padding-left: 16px; }
  .reporting-export-open { grid-column: 2; grid-row: 1; }
}

.reporting-export-list li:last-child {
  border-bottom: 0;
}

.reporting-muted {
  color: var(--app-muted);
  font-size: 12px;
}

.reporting-empty--filter {
  text-align: left;
}

.reporting-table-wrap {
  border: 1px solid #e4e7ec;
  border-radius: 8px;
  overflow: auto;
  max-height: 28rem;
}

.reporting-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 720px;
  width: 100%;
}

.reporting-table th {
  background: #f8fafc;
  border-bottom: 1px solid #d0d5dd;
  color: #344054;
  font-size: 11px;
  padding: 8px;
  position: sticky;
  text-align: left;
  top: 0;
}

.reporting-table td {
  border-bottom: 1px solid #eef2f7;
  font-size: 12px;
  padding: 8px;
  vertical-align: top;
}

.reporting-comp-honest {
  background: #fffaeb;
  border: 1px solid #fedf89;
  border-radius: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  justify-content: space-between;
  padding: 12px 14px;
}

.reporting-comp-honest h3 {
  color: #9a3412;
  font-size: 14px;
  font-weight: 800;
  margin: 0;
}

.reporting-comp-honest p {
  color: #7a2e0e;
  font-size: 13px;
  margin: 4px 0 0;
}

@media (max-width: 900px) {
  .reporting-hub-search {
    grid-template-columns: 1fr;
  }

  .reporting-controls--sticky {
    position: static;
  }

  .reporting-card__footer {
    align-items: stretch;
    flex-direction: column;
  }

  .reporting-card__footer .reporting-action {
    width: 100%;
  }
}

.reporting-canvas__badges { margin-top: 10px; }


/* Setup Import Center hub polish (aligned with reporting cards) */
.admin-access-import-hub__intro {
  margin-bottom: 8px;
}

.admin-access-import-grid {
  align-items: stretch;
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.admin-access-import-card {
  background: #fff;
  border: 1px solid var(--app-border);
  border-radius: 12px;
  box-shadow: 0 4px 13px rgba(16, 24, 40, 0.04);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 100%;
  padding: 0;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.admin-access-import-card:hover {
  border-color: #b8c4d3;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.08);
}

.admin-access-import-card:focus-within {
  border-color: var(--app-action-primary);
  box-shadow: 0 0 0 4px var(--app-focus-ring);
}

.admin-access-import-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 10px;
  padding: 16px 16px 12px;
}

.admin-access-import-card__footer {
  border-top: 1px solid #eef2f7;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: auto;
  padding: 12px 16px 16px;
}

.admin-access-import-title {
  color: var(--app-heading);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.3;
  margin: 0;
}

.admin-access-import-copy {
  color: var(--app-muted);
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
}

.admin-access-import-scenarios {
  color: var(--app-muted);
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
  padding-left: 1.15rem;
}

.admin-access-import-scenarios li {
  margin: 2px 0;
}

.admin-access-import-scenarios strong {
  color: var(--app-heading);
}

.admin-access-import-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-access-import-file {
  min-width: 0;
  width: 100%;
}

.admin-access-import-file input[type="file"] {
  background: var(--app-field-bg, #fff);
  border: 1px solid var(--app-field-border, #d0d5dd);
  border-radius: var(--app-field-radius, 6px);
  box-sizing: border-box;
  color: var(--app-field-text, #101828);
  font: inherit;
  font-size: 13px;
  max-width: 100%;
  min-height: var(--app-control-height, 38px);
  padding: 6px 10px;
  width: 100%;
}

.admin-access-import-file input[type="file"]:focus,
.admin-access-import-file input[type="file"]:focus-visible {
  border-color: var(--app-field-focus, var(--app-action-primary));
  box-shadow: 0 0 0 var(--app-field-focus-ring-width, 2px) var(--app-field-focus-ring, rgba(29, 155, 240, 0.12));
  outline: none;
}

.admin-access-import-card__footer > .button-primary {
  align-self: stretch;
  width: 100%;
}

.admin-access-import-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  font-weight: 700;
}

.admin-access-import-field span {
  color: var(--app-heading);
}

.admin-access-import-field select {
  max-width: 100%;
}

.admin-access-import-comp-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.admin-access-import-comp-form .button-primary {
  align-self: stretch;
  width: 100%;
}

.admin-access-import-link-strip {
  border-top: 1px solid var(--app-border-soft, #e6e9ef);
  margin-top: 20px;
  padding-top: 16px;
}

.admin-access-import-link-strip > .admin-access-import-title {
  color: var(--app-muted);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

.admin-access-import-link-strip > .admin-access-import-copy {
  margin-top: 6px;
}

.admin-access-import-link-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.admin-access-import-card--comp {
  background: color-mix(in srgb, var(--app-field-bg, #fff) 92%, #e8eef5);
}

/* Employee Relations submit concern: optional flags + required acknowledgment */
.er-submit-checks {
  background: var(--app-surface-muted);
  border: 1px solid var(--app-border);
  border-radius: var(--app-radius-card);
  display: grid;
  gap: 14px;
  padding: 16px;
}

.er-submit-checks__flags {
  display: grid;
  gap: 12px;
}

.er-submit-checks label {
  align-items: flex-start;
  color: var(--app-field-text);
  cursor: pointer;
  display: flex;
  gap: 10px;
  font-weight: 600;
  line-height: 1.4;
}

.er-submit-checks input[type="checkbox"] {
  flex: 0 0 auto;
  height: var(--app-checkbox-size);
  margin-top: 2px;
  min-height: 0;
  padding: 0;
  width: var(--app-checkbox-size);
}

.er-submit-acknowledgment {
  background: var(--app-surface);
  border: 1px solid var(--app-border-soft);
  border-radius: var(--app-radius-control);
  display: grid;
  gap: 8px;
  padding: 12px 14px;
}

.er-submit-acknowledgment__hint {
  color: var(--app-muted);
  font-size: var(--app-label-font-size);
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}

.er-submit-acknowledgment .er-submit-check--required,
.er-submit-checks .er-submit-check--required {
  color: var(--app-label-color);
  font-weight: var(--app-label-font-weight);
}
