/* Oracle JET Redwood-aligned KPI dashboard styling. */
:root {
  --oj-core-border-radius-sm: 0.2rem;
  --oj-core-border-radius-md: 0.2rem;
  --oj-core-border-radius-lg: 0.2rem;
  --kpi-surface: #ffffff;
  --kpi-surface-alt: #f6f4f2;
  --kpi-soft: #fbfaf8;
  --kpi-ink: #161513;
  --kpi-muted: #6f6862;
  --kpi-border: #dedbd7;
  --kpi-brand: #c74634;
  --kpi-success: #145a32;
  --kpi-danger: #c00000;
  --kpi-warning: #c9832b;
  --kpi-blue: #2f6f9f;
  --kpi-shadow: 0 18px 45px rgba(22, 21, 19, 0.09);
  --kpi-side-nav-bg: #312d2a;
  --kpi-side-nav-text: #ffffff;
  --kpi-side-nav-hover: rgba(255, 255, 255, 0.12);
  --kpi-side-nav-selected: rgba(255, 255, 255, 0.18);
  --kap-grid-header-bg: #eef2f5;
  --kap-grid-header-ink: #334155;
  --kap-grid-cell-bg: #fff;
  --kap-grid-border: #ebe7e3;
  --kap-grid-hover-bg: #fffaf8;
  --kap-grid-selected-bg: #fffaf8;
  --kap-grid-reflected-bg: #fff8e5;
  --kap-grid-kpi-reflected-bg: #edf7f4;
  --kap-grid-draft-bg: #fff7ed;
  --kap-grid-draft-ink: #5f3b12;
  --kap-grid-draft-line: #b3366f;
  --kpi-panel-radius: var(--oj-core-border-radius-md, .2rem);
  --kap-consumption-control-height: 2.15rem;
  --kap-data-control-gap: .5rem;
  --kap-section-gap: .375rem;
  --kap-footer-gap: .75rem;
}

body {
  background: var(--kpi-surface-alt);
  font-family: var(--oj-core-text-font-family, "Oracle Sans"), "Noto Sans CJK KR", "Malgun Gothic", "Apple SD Gothic Neo", Arial, sans-serif;
  margin: 0;
  overflow-x: hidden;
}

*, *::before, *::after { box-sizing: border-box; }

.kap-login-page {
  align-items: center;
  background: var(--oj-core-bg-color-content, #fff);
  color: var(--oj-core-text-color-primary, var(--kpi-ink));
  display: grid;
  justify-items: center;
  min-height: 100vh;
  min-height: 100dvh;
  padding: clamp(1rem, 4vw, 3rem);
}

.kap-login-card {
  background: var(--oj-core-bg-color-content, #fff);
  border: 1px solid var(--oj-core-divider-color, var(--kpi-border));
  border-radius: var(--oj-core-border-radius-lg, .5rem);
  box-shadow: var(--oj-core-box-shadow-sm, 0 .5rem 1.5rem rgb(22 21 19 / 10%));
  max-width: 100%;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  width: 30rem;
}
.kap-login-card h1 { font-size: clamp(1.75rem, 7vw, 2.35rem); margin: 1.5rem 0 .5rem; }
.kap-login-card > p { color: var(--oj-core-text-color-secondary, var(--kpi-muted)); line-height: 1.5; margin: .5rem 0 1.5rem; }
.kap-login-brand { align-items: center; display: flex; gap: .75rem; }
.kap-login-brand__mark { display: block; height: 2.5rem; object-fit: contain; width: 2.5rem; }
.kap-login-brand > div { display: grid; gap: .15rem; }
.kap-login-brand span { color: var(--oj-core-text-color-secondary, var(--kpi-muted)); font-size: .75rem; }
.kap-login-brand strong b { color: var(--kpi-brand); font-size: 1.12em; }
.kap-login-form { display: grid; gap: 1rem; }
.kap-login-error { background: var(--oj-core-danger-1, #fff2f0); border-left: .25rem solid var(--oj-core-danger-3, var(--kpi-danger)); color: var(--oj-core-text-color-primary, #161513); margin: .75rem 0; padding: .75rem; }
.kap-login-success { background: var(--oj-core-success-1, #eef6ec); border-left: .25rem solid var(--oj-core-success-3, var(--kpi-success)); margin: 1rem 0; padding: .85rem; }
.kap-login-success p { color: var(--oj-core-text-color-primary, var(--kpi-ink)); line-height: 1.45; margin: .35rem 0 .75rem; }
.kap-login-reset-link { color: var(--oj-link-text-color, #174f82); display: inline-block; font-weight: 700; margin-bottom: .75rem; text-decoration: underline; }
.kap-login-reset-link:focus-visible { outline: 2px solid var(--oj-core-focus-border-color, #0572ce); outline-offset: 2px; }
.kap-login-warning { background: var(--oj-core-warning-1, #fff8e1); border-left: .25rem solid var(--oj-core-warning-3, #8a4b08); color: var(--oj-core-text-color-primary, #161513); line-height: 1.45; padding: .75rem; }
.kap-login-link { background: transparent; border: 0; color: var(--oj-link-text-color, #174f82); cursor: pointer; display: inline-block; font: inherit; margin: 1rem .75rem 0 0; padding: .35rem 0; text-decoration: underline; }
.kap-login-link:focus-visible { outline: 2px solid var(--oj-core-focus-border-color, #0572ce); outline-offset: 2px; }

@media (max-width: 480px) {
  .kap-login-page { align-items: start; padding: 0; }
  .kap-login-card { border-width: 0; border-radius: 0; box-shadow: none; min-height: 100dvh; padding: 1.5rem 1rem; width: 100%; }
}

.kap-login {
  align-items: center;
  background:
    radial-gradient(circle at 14% 8%, rgba(199, 70, 52, 0.1), transparent 26rem),
    linear-gradient(145deg, #f7f5f2 0%, #eeebe7 100%);
  display: grid;
  justify-items: center;
  min-height: 100vh;
  min-height: 100dvh;
  padding: 2rem 1rem;
}

.kap-login__card {
  background: var(--kpi-surface);
  border: 1px solid rgba(49, 45, 42, 0.12);
  border-radius: 0.75rem;
  box-shadow: 0 22px 54px rgba(49, 45, 42, 0.13);
  max-width: 100%;
  padding: 2.5rem;
  width: 28.5rem;
}

.kap-login__brand {
  align-items: center;
  display: flex;
  min-height: 1.5rem;
}

.kap-login__eyebrow {
  color: var(--kpi-muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin: 2rem 0 0.75rem;
}

.kap-login h1 {
  color: var(--kpi-ink);
  font-size: clamp(2rem, 6vw, 2.65rem);
  font-weight: 600;
  letter-spacing: -0.035em;
  line-height: 1.08;
  margin: 0;
}

.kap-login__intro {
  color: var(--kpi-muted);
  line-height: 1.5;
  margin: 0.75rem 0 0;
}

.kap-login__form {
  display: grid;
  gap: 1rem;
  margin-top: 2rem;
}

.kap-login__field,
.kap-login__submit {
  width: 100%;
}

.kap-login__error {
  align-items: flex-start;
  background: #fff3f1;
  border: 1px solid #e8aaa2;
  border-radius: 0.4rem;
  color: #8f2417;
  display: flex;
  font-size: 0.875rem;
  gap: 0.5rem;
  line-height: 1.4;
  padding: 0.7rem 0.8rem;
}

.kap-login__error-icon {
  flex: 0 0 auto;
  margin-top: 0.08rem;
}

.kap-login__notice {
  border-top: 1px solid var(--kpi-border);
  color: var(--kpi-muted);
  font-size: 0.75rem;
  line-height: 1.45;
  margin: 1.75rem 0 0;
  padding-top: 1rem;
}

@media (max-width: 480px) {
  .kap-login { align-items: start; padding: 1rem; }
  .kap-login__card { border-radius: 0.55rem; padding: 1.75rem 1.25rem; }
  .kap-login__eyebrow { margin-top: 1.5rem; }
}

.kpi-fiscal-year-panel {
  align-items: center;
  background: var(--kpi-surface);
  border: 1px solid var(--kpi-border);
  border-radius: 0.2rem;
  box-shadow: 0 10px 28px rgba(22, 21, 19, 0.05);
  display: flex;
  gap: 0.75rem;
  height: 3.5rem;
  justify-content: space-between;
  margin-bottom: 1rem;
  min-height: 3.5rem;
  overflow: hidden;
  padding: 0.45rem 0.85rem;
}

.kpi-fiscal-year-panel__start,
.kpi-fiscal-year-options {
  align-items: center;
  display: flex;
  gap: 0.5rem;
  min-width: 0;
}

.kpi-fiscal-year-panel .kpi-section-label {
  flex: 0 0 auto;
  margin: 0;
}

.kpi-fiscal-year-option,
.kpi-guide-entry-button {
  flex: 0 0 auto;
}

.kpi-guide-entry-button {
  max-height: 2.35rem;
}

.demo-oracle-icon {
  width: 137px;
  height: 18px;
  content: url("images/oracle_logo.svg");
}

.kpi-shell {
  --kpi-footer-reserved-height: 4.5rem;
  background: radial-gradient(circle at top left, rgba(199, 70, 52, 0.08), transparent 32rem), var(--kpi-surface-alt);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
  padding-bottom: var(--kpi-footer-reserved-height);
}

.kpi-header {
  border-bottom: 1px solid var(--kpi-border);
  background: var(--oj-core-bg-color-content, var(--kpi-surface));
  position: sticky;
  top: 0;
  z-index: 20;
}

.kpi-header__bar {
  box-sizing: border-box;
  display: flex;
  flex-wrap: nowrap;
  min-height: 3.35rem;
  padding: 0 1.5rem;
  gap: 1rem;
  width: 100%;
}

.kpi-header__start,
.kpi-title-block,
.kpi-header__end {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}

.kpi-header__start { flex: 1 1 auto; }
.kpi-header__end {
  align-items: center;
  flex: 0 1 auto;
  flex-direction: row;
  gap: .35rem;
  justify-content: center;
}
.kpi-header__oracle-logo {
  display: block;
  height: auto;
  /* The 1600x300 KAP artwork retains about 330px of white space after “Perform.”. */
  margin: 0 0 .12rem -2.35rem;
  width: 3.15rem;
}

.kpi-header__toggle {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  justify-content: center;
}

.kpi-header__brand {
  align-items: flex-end;
  border-left: 1px solid var(--oj-core-divider-color, var(--kpi-border));
  display: flex;
  gap: .35rem;
  min-width: 0;
  padding: .25rem 0 .25rem 1rem;
}

.kpi-header__brand .demo-oracle-icon { flex: 0 0 auto; }
.kpi-header__divider { display: none; }
.kpi-header__title {
  color: var(--oj-core-text-color-primary, var(--kpi-ink));
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kpi-title-block {
  align-items: flex-start;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}

.kpi-title-block .oj-web-applayout-header-title {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
  margin: 0;
  max-width: 100%;
  overflow: hidden;
  padding: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kpi-brand-lockup {
  align-items: center;
  display: flex;
  padding-inline: 0.25rem 0.75rem;
  border-right: 1px solid var(--kpi-border);
}

.kpi-shell__body {
  display: grid;
  flex: 1 0 auto;
  grid-template-columns: 16.5rem minmax(0, 1fr);
  min-height: 0;
  transition: grid-template-columns 180ms ease;
}

.kpi-shell__body:has(.kpi-side-nav.is-closed) { grid-template-columns: 0 minmax(0, 1fr); }
.kpi-side-nav.is-closed { opacity: 0; padding-inline: 0; pointer-events: none; }
.kpi-side-nav.is-open { opacity: 1; }

/* Existing left navigation styling is intentionally preserved. */
.kpi-side-nav {
  --oj-navigation-list-item-label-color: var(--kpi-side-nav-text);
  --oj-navigation-list-item-label-color-hover: var(--kpi-side-nav-text);
  --oj-navigation-list-item-label-color-selected: var(--kpi-side-nav-text);
  --oj-navigation-list-item-bg-color-hover: var(--kpi-side-nav-hover);
  --oj-navigation-list-item-bg-color-selected: var(--kpi-side-nav-selected);
  --oj-navigation-list-item-min-height: 3rem;
  align-self: start;
  background: var(--kpi-side-nav-bg);
  border-right: 1px solid rgba(22, 21, 19, 0.18);
  color: var(--kpi-side-nav-text);
  max-height: calc(100vh - 4.5rem);
  min-width: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 1.25rem 0.75rem;
  position: fixed;
  top: 4.5rem;
  transition: opacity 180ms ease, padding 180ms ease, width 180ms ease;
}

@media (min-width: 1025px) {
  .kpi-side-nav {
    bottom: 0;
    height: calc(100vh - 4.5rem);
    left: 0;
    width: 16.5rem;
    z-index: 15;
  }

  .kpi-navigation-label {
    font-size: 0.84rem;
  }

  .kpi-content {
    grid-column: 2;
  }
}

.kpi-navigation-list { background: transparent; border-radius: 0; color: var(--kpi-side-nav-text); }
.kpi-navigation-list a {
  align-items: center;
  border-radius: 0.35rem;
  color: var(--kpi-side-nav-text);
  display: flex;
  gap: 0.5rem;
  min-height: 3rem;
  padding-inline: 0.8rem 0.55rem;
  text-decoration: none;
}
.kpi-navigation-list a:hover { background: var(--kpi-side-nav-hover); }
.kpi-navigation-row { align-items: center; display: flex; gap: 0.5rem; min-width: 0; width: 100%; }
.kpi-navigation-icon { color: var(--kpi-side-nav-text); flex: 0 0 auto; font-size: 1.15rem; line-height: 1; opacity: 0.95; }
.kpi-navigation-label { color: var(--kpi-side-nav-text); flex: 1 1 auto; line-height: 1.25; min-width: 0; outline: none; position: relative; }
.kpi-navigation-label__text { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kpi-navigation-code-badge,
.kpi-detail-code-badge {
  background: rgba(64, 160, 88, 0.28);
  border: 1px solid rgba(130, 214, 149, 0.72);
  border-radius: 999px;
  color: #d8f8df;
  flex: 0 0 auto;
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1;
  margin-inline-start: auto;
  min-width: 2rem;
  padding: 0.28rem 0.48rem;
  text-align: center;
}
.kpi-navigation-code-badge--before { margin-inline-start: 0; order: 1; }
.kpi-navigation-code-badge--before + .kpi-navigation-label { flex: 1 1 auto; order: 2; }
.kpi-detail-code-badge { background: #e5f3e7; border-color: #b9dfc0; color: #246230; margin-inline-start: 0; }

.kpi-content {
  display: grid;
  gap: 1rem;
  min-width: 0;
  overflow-x: clip;
  padding: 1.5rem;
}

.kpi-content:has(.accounts-workloads-page) {
  align-content: stretch;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  height: calc(100dvh - 4rem - var(--kpi-footer-reserved-height));
  min-height: 0;
}
.kpi-content:has(.accounts-workloads-page.is-empty) { gap: 0.25rem; }

.kpi-content:has(.consumption-insights-page),
.kpi-content:has(.attainment-page) {
  align-content: start;
  grid-auto-rows: max-content;
}

.kpi-content:has(.kpi-spreadsheet-page) { align-content: start; }
.kpi-content:has(.my-customers-360-page) { align-content: start; }

.kpi-api-status {
  margin: 0;
  color: var(--oj-core-text-color-secondary);
  font-size: 0.82rem;
}

.kpi-api-status--error {
  color: var(--oj-core-danger-3, #9b1c1c);
  font-weight: 600;
}

.kpi-panel,
.kpi-fiscal-year-panel {
  background: var(--kpi-surface);
  border: 1px solid var(--kpi-border);
  border-radius: 0.2rem;
  box-shadow: var(--kpi-shadow);
}

.kpi-fiscal-year-panel {
  align-items: center;
  display: flex;
  gap: 0.8rem;
  height: 3.5rem;
  justify-content: space-between;
  margin-bottom: 0;
  min-height: 3.5rem;
  overflow: hidden;
  padding: 0.45rem 0.85rem;
}

.kpi-fiscal-year-panel__start {
  align-items: center;
  display: flex;
  gap: 1rem;
}

.kpi-guide-entry-button {
  align-items: center;
  background: #fff;
  border: 1px solid var(--kpi-border);
  border-radius: 999px;
  color: var(--kpi-ink);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 800;
  gap: 0.5rem;
  min-height: 2.45rem;
  padding: 0.45rem 0.9rem;
  white-space: nowrap;
}

.kpi-guide-entry-button:hover,
.kpi-guide-entry-button:focus-visible {
  border-color: rgba(199, 70, 52, 0.5);
  box-shadow: 0 0 0 3px rgba(199, 70, 52, 0.14);
  outline: none;
}

.kpi-section-label,
.kpi-eyebrow {
  color: var(--kpi-muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.kpi-fiscal-year-options {
  background: #f2efec;
  border: 1px solid var(--kpi-border);
  border-radius: 999px;
  display: inline-flex;
  padding: 0.2rem;
}

.kpi-fiscal-year-option {
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: #5f5853;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  min-width: 3.4rem;
  padding: 0.42rem 0.75rem;
}

.kpi-fiscal-year-option.is-selected {
  background: #fff;
  box-shadow: 0 4px 12px rgba(22, 21, 19, 0.12);
  color: var(--kpi-ink);
}

.kpi-panel { min-width: 0; overflow: hidden; padding: 1.25rem; }
.kpi-dashboard-section h2 { font-size: clamp(1.65rem, 2.5vw, 2.15rem); margin: 0.25rem 0 0; }
.kpi-panel__header { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: 1rem; }
.kpi-panel__description { color: var(--kpi-muted); margin: 0.45rem 0 0; }
.kpi-source-note { color: var(--kpi-muted); font-size: 0.8rem; }

.kpi-overview-table-wrap { overflow-x: auto; }
.kpi-overview-table { border-collapse: separate; border-spacing: 0 0.55rem; min-width: 60rem; width: 100%; }
.kpi-overview-table th { color: var(--kpi-muted); font-size: 0.76rem; letter-spacing: 0.04em; padding: 0 0.7rem 0.25rem; text-align: left; text-transform: uppercase; }
.kpi-overview-table th:not(:first-child) { text-align: center; }
.kpi-overview-table td:not(:first-child) { text-align: center; }
.kpi-overview-table td { background: var(--kpi-soft); border-block: 1px solid #ebe7e3; padding: 0.72rem 0.7rem; vertical-align: middle; }
.kpi-overview-table tr td:first-child { border-left: 1px solid #ebe7e3; border-radius: 0.2rem 0 0 0.2rem; }
.kpi-overview-table tr td:last-child { border-right: 1px solid #ebe7e3; border-radius: 0 0.2rem 0.2rem 0; }
.kpi-overview-table tr.is-selected td { background: #fff7f5; border-color: rgba(199, 70, 52, 0.32); }

.kpi-name-cell { align-items: center; display: flex; gap: 0.7rem; min-width: 16rem; }
.kpi-name-cell__label { display: grid; gap: 0.16rem; }
.kpi-name-cell__detail { color: var(--kpi-muted); font-size: 0.68rem; line-height: 1.2; }
.kpi-code-badge {
  align-items: center;
  background: #eaf3f8;
  border: 1px solid #c6ddea;
  border-radius: 0.55rem;
  color: var(--kpi-blue);
  display: inline-flex;
  font-size: 0.72rem;
  font-weight: 900;
  justify-content: center;
  min-width: 2rem;
  padding: 0.18rem 0.42rem;
  white-space: nowrap;
}
.kpi-code-badge--priority { background: #fff0e7; border-color: #f2c8b9; color: var(--kpi-brand); }

.kpi-status-badge {
  align-items: flex-start;
  border-radius: 999px;
  display: inline-flex;
  flex-direction: column;
  font-size: 0.72rem;
  font-weight: 800;
  gap: 0.18rem;
  min-width: 6.2rem;
  padding: 0.42rem 0.7rem;
}
.kpi-status-badge strong { font-size: 0.86rem; }
.kpi-status-badge--success { background: #dff2e4; color: #145a32; }
.kpi-status-badge--danger { background: #fde6e6; color: #c00000; }
.kpi-status-badge--rate-red { background: #fde6e6; color: #c00000; }
.kpi-status-badge--rate-yellow { background: #fff6d7; color: #7d5a00; }
.kpi-status-badge--rate-blue { background: #e6f1fb; color: #245f8f; }
.kpi-status-badge--rate-light-green { background: #edf8e8; color: #4d7c22; }
.kpi-status-badge--rate-green { background: #dff2e4; color: #145a32; }
.kpi-tooltip-trigger { display: inline-flex; outline: none; position: relative; }
.kpi-tooltip-trigger:focus-visible .kpi-status-badge { box-shadow: 0 0 0 3px rgba(47, 111, 159, 0.22); }
.kpi-tooltip {
  background: #312d2a;
  border-radius: 0.65rem;
  bottom: calc(100% + 0.55rem);
  box-shadow: 0 12px 30px rgba(22, 21, 19, 0.22);
  color: #fff;
  font-size: 0.76rem;
  font-weight: 700;
  left: 50%;
  line-height: 1.45;
  min-width: 12rem;
  opacity: 0;
  padding: 0.55rem 0.7rem;
  pointer-events: none;
  position: absolute;
  transform: translateX(-50%) translateY(0.25rem);
  transition: opacity 140ms ease, transform 140ms ease;
  white-space: pre-line;
  z-index: 8;
}
.kpi-tooltip-trigger:hover .kpi-tooltip,
.kpi-tooltip-trigger:focus .kpi-tooltip,
.kpi-tooltip-trigger:focus-visible .kpi-tooltip {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.kpi-helper-note { color: #805c18; margin: 0.2rem 0 0; }

.kpi-selected-summary { background: linear-gradient(160deg, #fff, #fcf7f5); }

.kpi-new-workload-section { background: linear-gradient(160deg, #fff, #fcf7f5); }
.kpi-new-workload-grid { display: grid; gap: 1rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpi-new-workload-card { background: var(--kpi-soft); border: 1px solid #ebe7e3; border-radius: 0.2rem; padding: 1rem; }
.kpi-customer-module-grid { display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kpi-customer-module-card { background: var(--kpi-soft); border: 1px solid #ebe7e3; border-radius: 0.2rem; padding: 1rem; }
.kpi-customer-module-card h3 { margin: 0 0 0.65rem; }
.kpi-customer-module-card p { color: var(--kpi-muted); margin: 0; }
.kpi-new-workload-card__header { align-items: center; display: flex; justify-content: space-between; margin-bottom: 1rem; }
.kpi-new-workload-card__header strong { font-size: 1.25rem; }
.kpi-new-workload-metric { display: grid; gap: 0.4rem; margin-top: 0.9rem; }
.kpi-new-workload-metric__row,
.kpi-new-workload-metric__amounts { align-items: center; display: flex; justify-content: space-between; }
.kpi-new-workload-metric__row span { color: var(--kpi-muted); font-size: 0.86rem; font-weight: 800; }
.kpi-new-workload-metric__amounts { color: var(--kpi-muted); font-size: 0.8rem; font-weight: 700; }
.kpi-new-workload-metric__amounts span:first-child { color: var(--kpi-ink); }
.kpi-new-workload-metric__bar { background: #eee9e5; border-radius: 999px; height: 0.62rem; overflow: hidden; }
.kpi-new-workload-metric__bar-fill { border-radius: inherit; display: block; height: 100%; }
.kpi-new-workload-metric--red .kpi-new-workload-metric__row strong { color: #c00000; }
.kpi-new-workload-metric--yellow .kpi-new-workload-metric__row strong { color: #7d5a00; }
.kpi-new-workload-metric--blue .kpi-new-workload-metric__row strong { color: #245f8f; }
.kpi-new-workload-metric--light-green .kpi-new-workload-metric__row strong { color: #4d7c22; }
.kpi-new-workload-metric--green .kpi-new-workload-metric__row strong { color: #145a32; }
.kpi-new-workload-metric__bar-fill--red { background: var(--kpi-danger); }
.kpi-new-workload-metric__bar-fill--yellow { background: #d6a400; }
.kpi-new-workload-metric__bar-fill--blue { background: var(--kpi-blue); }
.kpi-new-workload-metric__bar-fill--light-green { background: #86b852; }
.kpi-new-workload-metric__bar-fill--green { background: #145a32; }

.kpi-guide-overlay {
  align-items: center;
  background: rgba(22, 21, 19, 0.42);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 2rem;
  position: fixed;
  z-index: 60;
}

.kpi-guide-dialog {
  background: var(--kpi-surface);
  border: 1px solid rgba(22, 21, 19, 0.16);
  border-radius: 1.25rem;
  box-shadow: 0 32px 90px rgba(22, 21, 19, 0.34);
  max-height: min(92vh, 58rem);
  max-height: min(92dvh, 58rem);
  display: flex;
  flex-direction: column;
  max-width: 74rem;
  overflow: hidden;
  padding: 1.25rem;
  width: min(100%, 74rem);
}

.kpi-guide-dialog__body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.kpi-guide-dialog__header { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; }
.kpi-guide-dialog__header h2 { margin: 0.15rem 0 0; }
.kpi-guide-dialog__actions { align-items: center; display: flex; gap: 0.4rem; }
.kpi-guide-edit-button { background: #fff; border: 1px solid var(--kpi-border); border-radius: 999px; color: var(--kpi-ink); cursor: pointer; font: inherit; font-weight: 800; min-height: 2.4rem; padding: 0.45rem 0.9rem; }
.kpi-guide-edit-button.is-active,
.kpi-guide-edit-button:hover,
.kpi-guide-edit-button:focus-visible { background: #fff4f1; border-color: rgba(199, 70, 52, 0.42); box-shadow: 0 0 0 3px rgba(199, 70, 52, 0.12); outline: none; }
.kpi-guide-layout { display: grid; gap: 1.15rem; grid-template-columns: 16.5rem minmax(0, 1fr); margin-top: 1.1rem; min-height: 28rem; }
.kpi-guide-layout--unified { grid-template-columns: 17rem minmax(0, 1fr); }
.kpi-guide-list { background: #f7f4f1; border: 1px solid #ebe7e3; border-radius: 0.2rem; display: flex; flex-direction: column; gap: 0.35rem; padding: 0.9rem; }
.kpi-guide-list-item { align-items: center; background: transparent; border: 1px solid transparent; border-left: 4px solid transparent; border-radius: 0.8rem; color: var(--kpi-ink); cursor: pointer; display: grid; gap: 0.6rem; grid-template-columns: auto minmax(0, 1fr); font: inherit; font-weight: 800; padding: 0.68rem 0.68rem 0.68rem 0.58rem; text-align: left; width: 100%; }
.kpi-guide-list-item.is-selected,
.kpi-guide-list-item:hover { background: #fff4f1; border-color: rgba(199, 70, 52, 0.2); border-left-color: var(--kpi-brand); box-shadow: 0 8px 18px rgba(22, 21, 19, 0.08); }
.kpi-guide-main { display: flex; flex-direction: column; min-width: 0; }
.kpi-guide-main--details { background: #fff; border: 1px solid #ebe7e3; border-radius: 0.2rem; padding: 1rem; }
.kpi-guide-details-heading { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: 1rem; }
.kpi-guide-details-heading h3 { align-items: center; display: flex; gap: 0.55rem; margin: 0.25rem 0 0; }
.kpi-guide-kpi-description { color: var(--kpi-muted); line-height: 1.5; margin: 0.55rem 0 0; }
.kpi-guide-notes-readonly { background: var(--kpi-soft); border: 1px solid #ebe7e3; border-radius: 0.2rem; margin-top: 1rem; padding: 1rem; }
.kpi-guide-notes-readonly h3 { margin: 0 0 0.55rem; }
.kpi-guide-notes-readonly p { color: var(--kpi-muted); line-height: 1.45; margin: 0; white-space: pre-wrap; }
.kpi-guide-edit-grid { display: grid; gap: 0.9rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kpi-guide-edit-grid label { color: var(--kpi-muted); display: grid; font-size: 0.78rem; font-weight: 800; gap: 0.35rem; letter-spacing: 0.03em; text-transform: uppercase; }
.kpi-guide-edit-grid input,
.kpi-guide-edit-grid textarea { background: #fff; border: 1px solid var(--kpi-border); border-radius: 0.2rem; color: var(--kpi-ink); font: inherit; letter-spacing: 0; min-height: 2.55rem; padding: 0.65rem 0.75rem; text-transform: none; width: 100%; }
.kpi-guide-edit-grid textarea { min-height: 7rem; resize: vertical; }
.kpi-guide-edit-grid__wide { grid-column: 1 / -1; }
.kpi-guide-criteria-table { border-collapse: collapse; width: 100%; }
.kpi-guide-criteria-table th { background: #f7f4f1; border: 1px solid #ebe7e3; color: var(--kpi-muted); padding: 0.62rem; text-align: left; vertical-align: top; width: 13rem; }
.kpi-guide-criteria-table td { border: 1px solid #ebe7e3; color: var(--kpi-ink); line-height: 1.35; padding: 0.62rem; vertical-align: top; white-space: pre-line; }
.kpi-guide-card-row { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1rem; }
.kpi-guide-info-card { background: var(--kpi-soft); border: 1px solid #ebe7e3; border-radius: 1rem; padding: 1rem; }
.kpi-guide-info-card h3 { margin: 0 0 0.55rem; }
.kpi-guide-info-card p { color: var(--kpi-muted); line-height: 1.45; margin: 0; }

.kpi-mobile-scrim { display: none; }
.kpi-profile-icon { font-size: 1.1rem; margin-inline-end: 0.35rem; }
.kpi-footer { transition: margin-left 180ms ease, width 180ms ease; }
.kpi-shell:has(.kpi-side-nav.is-open) .kpi-footer { margin-left: 18rem; width: calc(100% - 19.5rem); }
.kpi-shell:has(.kpi-side-nav.is-closed) .kpi-footer { margin-left: 1.5rem; width: calc(100% - 3rem); }
.kpi-footer .oj-web-applayout-footer-item { justify-content: center; max-width: none; text-align: center; width: 100%; }
.kpi-footer ul { justify-content: center; }

@media (max-width: 1024px) {
  .kpi-header__bar { align-items: center; min-height: auto; padding: 0.75rem 1rem; }
  .kpi-header__end { flex: 0 0 auto; }
  .kpi-profile-email { display: none; }
  #userMenu .oj-button-menu-dropdown-icon { display: none; }
  #navigationToggle { display: none; }
  .kpi-shell:has(.kpi-side-nav.is-open) .kpi-footer,
  .kpi-shell:has(.kpi-side-nav.is-closed) .kpi-footer { margin-left: 6rem; width: calc(100% - 7.5rem); }
  .kpi-shell__body,
  .kpi-shell__body:has(.kpi-side-nav.is-closed) {
    display: grid;
    grid-template-columns: 4.5rem minmax(0, 1fr);
    min-height: 0;
  }
  .kpi-side-nav,
  .kpi-side-nav.is-closed,
  .kpi-side-nav.is-open {
    bottom: 0;
    box-shadow: var(--kpi-shadow);
    box-sizing: border-box;
    height: calc(100dvh - 5rem - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    left: 0;
    max-height: none;
    opacity: 1;
    padding: 0.75rem 0.35rem max(0.75rem, env(safe-area-inset-bottom));
    pointer-events: auto;
    position: fixed;
    top: calc(5rem + env(safe-area-inset-top));
    transform: none;
    transition: width 180ms ease, padding 180ms ease;
    width: 4.5rem;
    z-index: 15;
  }
  .kpi-navigation-list a {
    justify-content: center;
    max-width: 100%;
    min-height: 3rem;
    overflow: hidden;
    padding-inline: 0.3rem;
  }
  .kpi-navigation-row { justify-content: center; }
  .kpi-navigation-list ul { margin: 0; padding: 0; }
  .kpi-navigation-label,
  .kpi-navigation-list .oj-navigationlist-item-title { display: none; }
  .kpi-navigation-list .oj-navigationlist-item-label { justify-content: center; }
  .kpi-navigation-icon { font-size: 1.25rem; }
  .kpi-navigation-code-badge {
    font-size: 0.65rem;
    margin-inline-start: 0;
    min-width: 2.05rem;
    padding: 0.24rem 0.32rem;
  }
  .kpi-navigation-list .oj-navigationlist-previous-button { margin-inline: 0; }
  .kpi-mobile-scrim,
  .kpi-mobile-scrim.is-open { display: none; }
  .kpi-content { grid-column: 2; width: 100%; }
  .kpi-new-workload-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-guide-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 720px) {
  .kpi-header__bar { align-items: center; flex-direction: row; gap: 0.5rem; min-height: 4.5rem; padding: 0.6rem 0.75rem; }
  .kpi-header__start { flex: 1 1 auto; min-width: 0; width: auto; }
  .kpi-header__end { align-items: center; flex: 0 0 auto; justify-content: flex-end; margin-inline-start: auto; width: auto; }
  .kpi-brand-lockup { display: none; }
  .kpi-title-block .oj-web-applayout-header-title { font-size: 1.05rem; }
  .kpi-shell:has(.kpi-side-nav.is-open) .kpi-footer,
  .kpi-shell:has(.kpi-side-nav.is-closed) .kpi-footer { margin-left: 5rem; width: calc(100% - 5.75rem); }
  .kpi-shell__body,
  .kpi-shell__body:has(.kpi-side-nav.is-closed) {
    grid-template-columns: 4.25rem minmax(0, 1fr);
    min-height: 0;
  }
  .kpi-side-nav,
  .kpi-side-nav.is-closed,
  .kpi-side-nav.is-open {
    height: calc(100dvh - 5rem - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    max-height: none;
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
    top: calc(5rem + env(safe-area-inset-top));
    width: 4.25rem;
  }
  .kpi-panel__header,
  .kpi-fiscal-year-panel { align-items: stretch; flex-direction: column; }
  .kpi-fiscal-year-panel { align-items: center; flex-direction: row; }
  .kpi-fiscal-year-panel__start { min-width: 0; }
  .kpi-guide-entry-button { border-radius: 50%; min-width: 2.45rem; padding: 0.45rem; }
  .kpi-guide-entry-button__label { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; }
  .kpi-new-workload-grid { grid-template-columns: minmax(0, 1fr); }
  .kpi-content { padding: 0.75rem; }
  .kpi-panel { border-radius: 0.2rem; padding: 1rem; }
}

/* Executive Pulse V2: attached concept-aligned home summary. */
.accounts-pulse-v2 {
  display: grid;
  gap: 0.85rem;
  padding: 1.25rem;
}

.accounts-pulse-v2__header {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
}

.accounts-pulse-v2__header h2 {
  font-size: 1.6rem;
  margin: 0.25rem 0 0.15rem;
}

.accounts-pulse-v2__header p {
  color: var(--kpi-muted);
  font-size: 0.86rem;
  margin: 0;
}

.accounts-pulse-v2__concept {
  color: var(--kpi-muted);
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.accounts-pulse-v2__metrics {
  display: grid;
  gap: 0.72rem;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.accounts-pulse-v2-metric {
  background: var(--kpi-soft);
  border: 1px solid var(--kpi-border);
  border-radius: 0.2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 5rem;
  padding: 0.7rem 0.85rem;
}

.accounts-pulse-v2-metric > span,
.accounts-pulse-v2-card h3,
.accounts-pulse-v2-card__title-row > span {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.accounts-pulse-v2-metric strong {
  color: var(--kpi-ink);
  font-size: 1.55rem;
  line-height: 1.05;
  margin: 0.18rem 0 0.15rem;
}

.accounts-pulse-v2-metric small {
  color: var(--kpi-muted);
  font-size: 0.66rem;
}

.accounts-pulse-v2__grid {
  align-items: stretch;
  display: grid;
  gap: 0.85rem;
  grid-template-areas: "new renewal accounts";
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.accounts-pulse-v2-card {
  border: 1px solid var(--kpi-border);
  border-radius: 0.2rem;
  display: flex;
  flex-direction: column;
  min-height: 11rem;
  padding: 0.85rem 1rem;
}

.accounts-pulse-v2-card--accounts {
  grid-area: accounts;
}

.accounts-pulse-v2-card--renewal {
  grid-area: renewal;
}

.accounts-pulse-v2-card--new {
  grid-area: new;
}

.accounts-pulse-v2-card h3 {
  color: var(--kpi-ink);
  font-size: 0.94rem;
  line-height: 1.2;
  margin: 0;
}

.accounts-pulse-v2-card__title-row,
.accounts-pulse-v2-account-head,
.accounts-pulse-v2-account-row > div {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.accounts-pulse-v2-card__title-row {
  gap: 0.45rem;
  min-height: 2.25rem;
}

.accounts-pulse-v2-card__title-row > span {
  color: var(--kpi-muted);
  font-size: 0.65rem;
  white-space: nowrap;
}

.accounts-pulse-v2-card__subtitle {
  color: var(--kpi-ink);
  font-size: 0.72rem;
  font-weight: 700;
  margin: 0.65rem 0 0.2rem;
}

.accounts-pulse-v2-account-head {
  font-size: 0.68rem;
  font-weight: 700;
  margin: 0.9rem 0 0.5rem;
}

.accounts-pulse-v2-account-list {
  display: grid;
  gap: 0.45rem;
}

.accounts-pulse-v2-account-row {
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  padding: 0;
  text-align: left;
  width: 100%;
}
.accounts-pulse-v2-account-row:hover:not(:disabled) strong,
.accounts-pulse-v2-account-row:focus-visible strong { color: var(--kpi-brand); text-decoration: underline; }
.accounts-pulse-v2-account-row:focus-visible { outline: 2px solid var(--kpi-brand); outline-offset: 2px; }
.accounts-pulse-v2-account-row:disabled { cursor: default; }

.accounts-pulse-v2-account-row > div {
  font-size: 0.72rem;
  margin-bottom: 0.15rem;
}

.accounts-pulse-v2-account-row strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.accounts-pulse-v2-account-meter {
  display: block;
  width: 100%;
}

.accounts-pulse-v2-concentration {
  background: #fff0ed;
  color: var(--kpi-danger);
  font-size: 0.66rem;
  font-weight: 700;
  margin-top: auto;
  padding: 0.32rem 0.5rem;
  text-align: center;
}

.accounts-pulse-v2-urgency-list {
  display: grid;
}

.accounts-pulse-v2-urgency-row {
  align-items: center;
  border-bottom: 1px solid var(--kpi-border);
  display: grid;
  font-size: 0.8rem;
  gap: 0.35rem;
  grid-template-columns: minmax(4.65rem, 0.7fr) minmax(3.4rem, 0.52fr) minmax(0, 1.15fr);
  min-height: 2.55rem;
}

.accounts-pulse-v2-days { font-size: 0.8rem; font-weight: 700; white-space: nowrap; }
.accounts-pulse-v2-workload-count {
  background: transparent;
  border: 0;
  color: var(--kpi-brand);
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 800;
  justify-self: end;
  padding: 0.3rem 0.15rem;
  text-decoration: underline;
  white-space: nowrap;
}
.accounts-pulse-v2-workload-count:disabled { color: var(--kpi-muted); cursor: default; text-decoration: none; }
.accounts-pulse-v2-workload-list { background: var(--kpi-soft); list-style: none; margin: 0; padding: 0.35rem 0.5rem; }
.accounts-pulse-v2-workload-list button { background: transparent; border: 0; cursor: pointer; display: flex; gap: 0.5rem; justify-content: space-between; padding: 0.38rem; text-align: left; width: 100%; }
.accounts-pulse-v2-workload-list button:hover strong,
.accounts-pulse-v2-workload-list button:focus-visible strong { color: var(--kpi-brand); text-decoration: underline; }
.accounts-pulse-v2-workload-list span { color: var(--kpi-muted); font-size: 0.72rem; }

.accounts-pulse-v2-urgency-row strong {
  font-size: 0.67rem;
  justify-self: end;
  white-space: nowrap;
}

.accounts-pulse-v2-urgency-row--new {
  grid-template-columns: 5.75rem minmax(0, 1fr);
}

.accounts-pulse-v2-pill {
  border-radius: 999px;
  font-size: 0.61rem;
  font-weight: 800;
  padding: 0.34rem 0.42rem;
  text-align: center;
  text-transform: uppercase;
}

.accounts-pulse-v2-pill--critical { background: #fde7e3; color: #d33a2c; }
.accounts-pulse-v2-pill--attention { background: #fff0dc; color: #b65d00; }
.accounts-pulse-v2-pill--upcoming { background: #e9f2f7; color: #356f91; }

.accounts-pulse-v2-action {
  display: grid;
  font-size: 0.68rem;
  gap: 0.3rem 0.7rem;
  margin-top: auto;
  min-height: 2.25rem;
  padding: 0.48rem 0.75rem;
}

.accounts-pulse-v2-action--critical {
  align-items: center;
  background: #fff0ed;
  grid-template-columns: auto minmax(0, 1fr);
}

.accounts-pulse-v2-action--critical span { color: var(--kpi-danger); font-weight: 800; }

.accounts-pulse-v2-action--attention {
  background: #fff6e9;
  grid-template-columns: minmax(0, 1fr) auto;
}

.accounts-pulse-v2-action--attention span,
.accounts-pulse-v2-action--attention strong { grid-column: 1; }
.accounts-pulse-v2-action--attention em {
  align-self: end;
  color: #a05a12;
  font-style: normal;
  font-weight: 800;
  grid-column: 2;
  grid-row: 1 / span 2;
}

.accounts-pulse-v2__note {
  color: var(--kpi-muted);
  font-size: 0.64rem;
  margin: -0.25rem 0 0;
}

.accounts-pulse-v2__unavailable {
  align-items: center;
  background: var(--kpi-soft);
  border: 1px solid var(--kpi-border);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  justify-content: center;
  min-height: 12rem;
  padding: 2rem;
  text-align: center;
}

.accounts-pulse-v2__unavailable strong { font-size: 1rem; }
.accounts-pulse-v2__unavailable span { color: var(--kpi-muted); font-size: 0.78rem; }

@media (max-width: 1250px) {
  .accounts-pulse-v2__metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .accounts-pulse-v2__grid { gap: 0.65rem; }
  .accounts-pulse-v2-card { padding-inline: 0.78rem; }
}

@media (max-width: 720px) {
  .accounts-pulse-v2 {
    padding: 1rem 0.85rem;
  }

  .accounts-pulse-v2__header {
    gap: 0.75rem;
  }

  .accounts-pulse-v2__concept {
    display: none;
  }

  .accounts-pulse-v2__metrics,
  .accounts-pulse-v2__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .accounts-pulse-v2__grid {
    grid-template-areas:
      "new"
      "renewal"
      "accounts";
  }

  .accounts-pulse-v2-card {
    min-height: auto;
  }

  .accounts-pulse-v2-urgency-row,
  .accounts-pulse-v2-urgency-row--new {
    gap: 0.18rem 0.6rem;
    grid-template-columns: minmax(5.35rem, 0.85fr) minmax(0, 1.35fr);
    min-height: auto;
    padding: 0.55rem 0;
  }

  .accounts-pulse-v2-urgency-row > .accounts-pulse-v2-pill {
    grid-column: 1;
    grid-row: 1;
  }

  .accounts-pulse-v2-urgency-row:not(.accounts-pulse-v2-urgency-row--new) > span:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
    padding-inline-start: 0.2rem;
  }

  .accounts-pulse-v2-workload-count {
    align-self: center;
    grid-column: 2;
    grid-row: 1 / span 2;
    justify-self: end;
    text-align: end;
  }
}

/* Accounts & Workloads: Redwood-aligned spreadsheet workspace. */
.accounts-workloads-page {
  --accounts-workloads-viewport-offset: calc(4rem + var(--kpi-footer-reserved-height) + 3rem);
  background: var(--kpi-surface);
  border: 1px solid var(--kpi-border);
  border-radius: 0.2rem;
  box-shadow: var(--kpi-shadow);
  height: calc(100dvh - var(--accounts-workloads-viewport-offset));
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
  padding: 1.15rem;
}

.accounts-workloads-header {
  align-items: flex-start;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin-bottom: 1rem;
  position: relative;
  z-index: 40;
}

.accounts-workloads-header h2 {
  font-size: clamp(1.55rem, 2.3vw, 2.05rem);
  margin: 0.25rem 0 0;
}

.accounts-workloads-fx {
  flex: 0 0 auto;
  position: relative;
}

.accounts-workloads-fx__button {
  align-items: flex-start;
  background: #fbf8f6;
  border: 1px solid #d8d2cc;
  border-left: 4px solid var(--kpi-brand);
  border-radius: 0.2rem;
  color: var(--kpi-ink);
  cursor: pointer;
  display: grid;
  font: inherit;
  gap: 0.2rem;
  min-width: 15rem;
  padding: 0.65rem 0.85rem;
  text-align: left;
}

.accounts-workloads-fx__button span,
.accounts-workloads-fx-popover label span {
  color: var(--kpi-muted);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.accounts-workloads-fx__button strong { font-size: 0.95rem; }

.accounts-workloads-fx-popover {
  background: #fff;
  border: 1px solid rgba(22, 21, 19, 0.18);
  border-radius: 0.2rem;
  box-shadow: 0 18px 42px rgba(22, 21, 19, 0.18);
  display: grid;
  gap: 0.7rem;
  padding: 0.9rem;
  position: absolute;
  right: 0;
  top: calc(100% + 0.5rem);
  width: 18rem;
  z-index: 50;
}

.accounts-workloads-fx-popover label,
.accounts-workloads-search,
.accounts-workloads-switch {
  color: var(--kpi-muted);
  display: grid;
  font-size: 0.75rem;
  font-weight: 900;
  gap: 0.32rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.accounts-workloads-fx-popover input,
.accounts-workloads-search input,
.accounts-workloads-edit-field {
  background: #fff;
  border: 1px solid var(--kpi-border);
  border-radius: 0.2rem;
  color: var(--kpi-ink);
  font: inherit;
  letter-spacing: 0;
  min-height: 2.35rem;
  padding: 0.48rem 0.58rem;
  text-transform: none;
  width: 100%;
}

.accounts-workloads-jet-date {
  --oj-core-border-radius-md: 0.2rem;
  --oj-core-border-radius-lg: 0.2rem;
  --oj-text-field-border-radius: 0.2rem;
  --oj-text-field-height: 2.35rem;
  display: block;
  min-width: 11rem;
  padding: 0;
}

.accounts-workloads-jet-date--add {
  min-width: 9.5rem;
}

.accounts-workloads-fx-popover p {
  color: var(--kpi-muted);
  font-size: 0.78rem;
  line-height: 1.35;
  margin: 0;
}

.accounts-workloads-search__control {
  align-items: stretch;
  display: flex;
  flex-wrap: nowrap;
  min-width: 0;
  width: 100%;
}

.accounts-workloads-search__control input {
  border-radius: 0.2rem 0 0 0.2rem;
  flex: 1 1 auto;
  min-width: 0;
}

.accounts-workloads-search__control button {
  align-items: center;
  background: #f2efec;
  border: 1px solid var(--kpi-border);
  border-left: 0;
  border-radius: 0 0.2rem 0.2rem 0;
  color: var(--kpi-ink);
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  justify-content: center;
  min-width: 2.5rem;
}

.accounts-workloads-search__control button:focus-visible {
  box-shadow: 0 0 0 3px rgba(47, 111, 159, 0.22);
  outline: none;
}

.accounts-workloads-toolbar {
  align-items: end;
  background: #f7f4f1;
  border: 1px solid #ebe7e3;
  border-radius: 0.2rem;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: minmax(15rem, 1fr) auto auto auto;
  margin-bottom: 0.9rem;
  padding: 0.8rem;
}

.accounts-workloads-switch {
  align-items: center;
  grid-template-columns: auto auto;
  padding-bottom: 0.2rem;
}

.accounts-workloads-actions,
.accounts-workloads-actions--compact,
.accounts-workloads-popover-actions,
.accounts-workloads-save-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.accounts-workloads-actions--compact {
  gap: 0.25rem;
  min-height: 2.1rem;
}

.accounts-workloads-actions--compact > .accounts-workloads-button { min-height: 2rem; padding: .35rem .7rem; }

.accounts-workloads-jet-button {
  --oj-button-sm-height: 1.95rem;
  --oj-button-sm-font-size: 0.76rem;
  --oj-button-sm-padding: 0 0.58rem;
  font-size: 0.76rem;
  margin-inline-end: -0.32rem;
  transform: scale(0.82);
  transform-origin: left center;
}

.accounts-workloads-selected-count {
  align-self: center;
  color: var(--kpi-muted);
  font-size: 0.82rem;
  font-weight: 800;
  white-space: nowrap;
}

.accounts-workloads-grid-shell {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  margin-top: 0.45rem;
  min-height: 0;
  position: relative;
}

.accounts-workloads-table-meta { color: var(--kpi-muted); font-size: 0.78rem; font-weight: 700; margin-top: 0.7rem; }

.accounts-workloads-scroll-hint {
  color: var(--kpi-muted);
  font-size: 0.76rem;
  line-height: 1.35;
  margin: 0 4.1rem 0.35rem 0;
}

.accounts-workloads-scroll-controls {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
  position: fixed;
  right: max(0.75rem, env(safe-area-inset-right));
  top: 50%;
  transform: translateY(-50%);
  z-index: 18;
}

.accounts-workloads-scroll-control {
  align-items: center;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(22, 21, 19, 0.18);
  border-radius: 0.2rem;
  box-shadow: 0 10px 24px rgba(22, 21, 19, 0.14);
  color: var(--kpi-ink);
  cursor: pointer;
  display: inline-flex;
  font-size: 1.55rem;
  font-weight: 800;
  height: 2.55rem;
  justify-content: center;
  line-height: 1;
  width: 2.55rem;
}

.accounts-workloads-scroll-control:hover:not(:disabled),
.accounts-workloads-scroll-control:focus-visible {
  border-color: rgba(199, 70, 52, 0.55);
  box-shadow: 0 0 0 3px rgba(199, 70, 52, 0.12), 0 10px 24px rgba(22, 21, 19, 0.14);
  outline: none;
}

.accounts-workloads-scroll-control:disabled {
  cursor: not-allowed;
  opacity: 0.38;
}

.accounts-workloads-grid-wrap {
  border: 1px solid #d9d4ce;
  border-radius: 0.2rem;
  flex: 1 1 auto;
  height: 100%;
  max-width: 100%;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
}

.accounts-workloads-grid-wrap::-webkit-scrollbar {
  display: none;
}

.accounts-workloads-grid {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.82rem;
  min-width: 142rem;
  width: 100%;
}

.accounts-workloads-grid th,
.accounts-workloads-grid td {
  background: var(--kap-grid-cell-bg);
  border-bottom: 1px solid var(--kap-grid-border);
  border-right: 1px solid var(--kap-grid-border);
  color: var(--kpi-ink);
  max-width: 18rem;
  padding: 0.55rem 0.58rem;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.accounts-workloads-grid td.accounts-workloads-notes-cell {
  max-width: 24rem;
  min-width: 16rem;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

.accounts-workloads-notes-content {
  display: block;
  max-width: 23rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.accounts-workloads-loading {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  justify-content: center;
  min-height: 20rem;
}

.accounts-workloads-grid th {
  background: var(--kap-grid-header-bg);
  color: var(--kpi-muted);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  position: sticky;
  text-transform: uppercase;
  top: 0;
  z-index: 20;
}

.accounts-workloads-grid th button {
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  padding: 0;
  text-align: left;
  text-transform: inherit;
  width: 100%;
}

.accounts-workloads-source-status {
  border: 1px solid;
  font-size: 0.82rem;
  margin: -0.35rem 0 1rem;
  padding: 0.7rem 0.85rem;
}

.accounts-workloads-source-status--fallback {
  background: #fff8e5;
  border-color: #e3bd55;
  color: #6b4f00;
}

.accounts-workloads-source-status--error {
  background: #fff0ed;
  border-color: #f3b8ad;
  color: var(--kpi-danger);
}

.accounts-workloads-save-error {
  background: #fff0ed;
  border: 1px solid #f3b8ad;
  color: var(--kpi-danger);
  font-size: 0.78rem;
  font-weight: 700;
  margin: 0 1.15rem 0.75rem;
  padding: 0.65rem 0.8rem;
}

.accounts-workloads-saving-dialog,
.accounts-workloads-delete-dialog {
  --oj-dialog-border-radius: 0.4rem;
  --oj-dialog-width: min(22rem, calc(100vw - 2rem));
}

.accounts-workloads-saving-content {
  align-items: center;
  display: flex;
  font-weight: 800;
  gap: 0.75rem;
  justify-content: center;
  min-height: 4.5rem;
  padding: 0.75rem 1rem;
}

.accounts-workloads-delete-content {
  display: grid;
  gap: 1rem;
  max-width: 20rem;
  padding: 0.5rem 1rem 1rem;
}

.accounts-workloads-delete-content p {
  color: var(--kpi-muted);
  line-height: 1.45;
  margin: 0;
}

.accounts-workloads-grid .accounts-workloads-cell--center { text-align: center; }
.accounts-workloads-grid .accounts-workloads-cell--right { text-align: right; }
.accounts-workloads-grid .accounts-workloads-cell--left { text-align: left; }
.accounts-workloads-grid th.accounts-workloads-cell--center button { text-align: center; }
.accounts-workloads-grid th.accounts-workloads-cell--right button { text-align: right; }
.accounts-workloads-grid td.accounts-workloads-cell--center input,
.accounts-workloads-grid td.accounts-workloads-cell--center textarea { text-align: center; }
.accounts-workloads-grid td.accounts-workloads-cell--right input,
.accounts-workloads-grid td.accounts-workloads-cell--right textarea { text-align: right; }

.accounts-workloads-grid tr:hover td { background: var(--kap-grid-hover-bg); }
.accounts-workloads-grid tr.is-important td { background: var(--kap-grid-reflected-bg); }
.accounts-workloads-grid tr.is-deleted td { background: #f3f0ed; color: #7d746d; text-decoration: line-through; }
.accounts-workloads-grid tr.is-adding-row td { background: #f7fbff; text-decoration: none; }
.accounts-workloads-grid td.is-editing-cell { background: #fffdf7; box-shadow: inset 0 0 0 2px rgba(199, 70, 52, 0.24); }
.accounts-workloads-grid td.is-unsaved-cell { background: var(--kap-grid-draft-bg); color: var(--kap-grid-draft-ink); position: relative; }
.accounts-workloads-grid td.is-unsaved-cell .accounts-workloads-update-summary::after { content: " • unsaved"; color: #9b4f19; font-size: 0.72rem; font-weight: 900; }

.accounts-workloads-grid .is-sticky {
  position: sticky;
  z-index: 2;
}

.accounts-workloads-grid th.is-sticky { z-index: 4; }
.accounts-workloads-selection-col { left: 0; min-width: 3.3rem; width: 3.3rem; }
.accounts-workloads-no-col { left: 3.3rem; min-width: 3rem; width: 3rem; }
.accounts-workloads-important-col { left: 6.3rem; min-width: 3rem; text-align: center; width: 3rem; }
.accounts-workloads-plan-col,
.accounts-workloads-grid td:nth-child(4) { left: 9.3rem; min-width: 10.5rem; }
.accounts-workloads-account-col,
.accounts-workloads-grid td:nth-child(5) { left: 19.8rem; min-width: 12rem; }
.accounts-workloads-grid td:nth-child(4),
.accounts-workloads-grid td:nth-child(5) { position: sticky; z-index: 2; }

.accounts-workloads-important-badge {
  align-items: center;
  background: #f5c542;
  border: 1px solid #d39c00;
  border-radius: 999px;
  color: #4f3700;
  display: inline-flex;
  font-weight: 1000;
  height: 1.3rem;
  justify-content: center;
  width: 1.3rem;
}

.accounts-workloads-latest-cell {
  max-width: 22rem;
  min-width: 22rem;
  overflow: visible;
  position: relative;
}

.accounts-workloads-update-trigger {
  display: inline-block;
  max-width: 21rem;
  outline: none;
  position: relative;
}

.accounts-workloads-update-summary {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.accounts-workloads-update-popup {
  background: #312d2a;
  border-radius: 0.2rem;
  bottom: calc(100% + 0.45rem);
  box-shadow: 0 18px 42px rgba(22, 21, 19, 0.24);
  color: #fff;
  left: 0;
  line-height: 1.45;
  max-width: 28rem;
  min-width: 22rem;
  opacity: 0;
  padding: 0.7rem 0.8rem;
  pointer-events: none;
  position: absolute;
  transform: translateY(0.25rem);
  transition: opacity 140ms ease, transform 140ms ease;
  white-space: normal;
  z-index: 20;
}

.accounts-workloads-update-trigger:hover .accounts-workloads-update-popup,
.accounts-workloads-update-trigger:focus .accounts-workloads-update-popup,
.accounts-workloads-update-trigger:focus-visible .accounts-workloads-update-popup {
  opacity: 1;
  transform: translateY(0);
}

.accounts-workloads-edit-field--textarea {
  min-height: 5rem;
  min-width: 21rem;
  resize: vertical;
  white-space: normal;
}

.accounts-workloads-footer-actions {
  align-items: center;
  background: #fbfaf8;
  border: 1px solid #ebe7e3;
  border-radius: 0.2rem;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin-top: 0.9rem;
  padding: 0.75rem 0.85rem;
}

.accounts-workloads-rule-note {
  color: var(--kpi-muted);
  font-size: 0.82rem;
  line-height: 1.4;
}

.accounts-workloads-button {
  background: #fff;
  border: 1px solid var(--kpi-border);
  border-radius: 0.2rem;
  color: var(--kpi-ink);
  cursor: pointer;
  font: inherit;
  font-weight: 850;
  min-height: 2.25rem;
  padding: 0.45rem 0.78rem;
}

.accounts-workloads-button--primary {
  background: var(--kpi-brand);
  border-color: var(--kpi-brand);
  color: #fff;
}

.accounts-workloads-button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.my-customers-360-page {
  background: var(--kpi-surface);
  border: 1px solid var(--kpi-border);
  border-radius: 0.2rem;
  box-shadow: var(--kpi-shadow);
  min-width: 0;
  padding: 1.15rem;
}

.my-customers-360-page__header {
  align-items: flex-start;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.my-customers-360-page__header h2 { margin: 0.25rem 0 0; }
.my-customers-360-page__total {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
}
.my-customers-360-page__total strong { color: var(--kpi-brand); font-size: 1.9rem; }
.my-customers-360-page__total span { color: var(--kpi-muted); font-size: 0.75rem; font-weight: 800; }
.my-customers-360-table-wrap { border: 1px solid var(--kpi-border); border-radius: 0.2rem; overflow: auto; }
.my-customers-360-table { border-collapse: collapse; min-width: 48rem; width: 100%; }
.my-customers-360-table th,
.my-customers-360-table td { border-bottom: 1px solid var(--kpi-border); padding: 0.7rem 0.8rem; text-align: left; }
.my-customers-360-table thead th { background: #f4f1ee; color: var(--kpi-muted); font-size: 0.72rem; text-transform: uppercase; }
.my-customers-360-table tbody th { font-weight: 800; }
.my-customers-360-table .is-numeric { text-align: right; }
.my-customers-360-account-link { background: transparent; border: 0; color: var(--kpi-brand); cursor: pointer; font: inherit; font-weight: 800; padding: 0; text-align: left; }
.my-customers-360-account-link:hover,
.my-customers-360-account-link:focus-visible { text-decoration: underline; }

@media (max-width: 640px) {
  .my-customers-360-page__header { flex-direction: column; }
  .my-customers-360-page__total { align-items: flex-start; }

  .accounts-workloads-scroll-controls {
    bottom: 5rem;
    flex-direction: column;
    right: max(0.35rem, env(safe-area-inset-right));
    top: auto;
    transform: none;
  }

  .accounts-workloads-scroll-control {
    font-size: 1.2rem;
    height: 2.15rem;
    width: 2.15rem;
  }

  .accounts-workloads-scroll-hint {
    margin-right: 2.6rem;
  }
}

@media (max-width: 1024px) {
  .accounts-workloads-footer-actions { align-items: stretch; flex-direction: column; }
  .accounts-workloads-toolbar { grid-template-columns: 1fr; }
  .accounts-workloads-fx { width: 100%; }
  .accounts-workloads-fx__button { width: 100%; }
  .accounts-workloads-fx-popover { left: 0; right: auto; width: min(100%, 18rem); }
}

/* Minimal account and user administration — Redwood-first app-owned layout. */
.kap-login__modes { display: grid; gap: .25rem; grid-template-columns: repeat(3, 1fr); margin-bottom: 1rem; }
.kap-login__modes button { background: transparent; border: 0; border-bottom: 2px solid var(--kpi-border); color: var(--kpi-muted); cursor: pointer; font: inherit; font-size: .78rem; font-weight: 800; padding: .55rem .25rem; }
.kap-login__modes button.is-active { border-bottom-color: var(--kpi-brand); color: var(--kpi-brand); }
.kap-account-page { background: var(--kpi-surface); border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); box-shadow: var(--kpi-shadow); padding: clamp(1rem, 2vw, 1.5rem); }
.kap-account-page h2 { margin: .25rem 0; }
.kap-profile-header { align-items: center; display: flex; gap: 1rem; justify-content: space-between; }
.kap-profile-fields { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1.25rem 0; }
.kap-profile-fields div { background: var(--kpi-soft); border: 1px solid var(--kpi-border); padding: .85rem; }
.kap-profile-fields dt { color: var(--kpi-muted); font-size: .75rem; font-weight: 800; margin-bottom: .35rem; }
.kap-profile-fields dd { font-weight: 800; margin: 0; overflow-wrap: anywhere; }
.kap-password-form { border-top: 1px solid var(--kpi-border); display: grid; gap: .75rem; max-width: 32rem; padding-top: 1rem; }
.kap-password-form h3 { margin: 0; }
.kap-password-dialog { --oj-dialog-width: min(32rem, calc(100vw - 2rem)); }
.kap-password-dialog__body { display: grid; gap: .85rem; min-width: min(28rem, 74vw); }
.kap-password-policy-hint { color: var(--oj-core-text-color-secondary, var(--kpi-muted)); font-size: .78rem; line-height: 1.45; margin: 0; }
.kap-form-message { background: color-mix(in srgb, var(--kpi-green) 10%, var(--kpi-surface)); border-left: .25rem solid var(--kpi-green); padding: .7rem; }
.kap-form-message--error { background: #fff2f0; border-left-color: var(--kpi-danger); color: var(--kpi-danger); }
.kap-destructive-warning { background: var(--oj-core-danger-1, #fff2f0); border-left: .25rem solid var(--oj-core-danger-3, #9b1c1c); color: var(--oj-core-text-color-primary, #161513); line-height: 1.45; padding: .75rem; }
.kap-users-header { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; }
.kap-users-header p { color: var(--kpi-muted); margin: .35rem 0 0; }
.kap-users-table-wrap { border: 1px solid var(--kpi-border); margin-top: 1rem; overflow-x: auto; }
.kap-users-table { border-collapse: collapse; min-width: 64rem; width: 100%; }
.kap-users-table th, .kap-users-table td { border-bottom: 1px solid var(--kpi-border); padding: .7rem; text-align: left; }
.kap-last-login { white-space: nowrap; }
.kap-users-table th { background: var(--kpi-soft); color: var(--kpi-muted); font-size: .75rem; text-transform: uppercase; }
.kap-users-table tbody tr:hover { background: var(--kap-grid-hover-bg); }
.kap-users-table td { vertical-align: middle; }
.kap-access-badge { background: var(--oj-core-neutral-10, #f4f2f0); border: 1px solid var(--kpi-border); border-radius: 999px; display: inline-flex; font-size: .72rem; font-weight: 800; padding: .25rem .55rem; }
.kap-status { border-radius: 999px; display: inline-flex; font-size: .72rem; font-weight: 850; padding: .25rem .55rem; }
.kap-status--active { background: #e6f4ea; color: #176b3a; }
.kap-status--invited { background: #eaf2fb; color: #245879; }
.kap-status--locked { background: #fff0cc; color: #7b5100; }
.kap-status--disabled { background: #eeebe8; color: #5f5853; }
.kap-user-actions { display: flex; flex-wrap: wrap; gap: .35rem; }
.kap-user-actions button { background: var(--kpi-surface); border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); color: var(--kpi-ink); cursor: pointer; font: inherit; font-size: .75rem; font-weight: 750; padding: .35rem .5rem; }
.kap-user-actions button:disabled { cursor: not-allowed; opacity: .5; }
.kap-empty-state { align-items: center; color: var(--kpi-muted); display: flex; flex-direction: column; justify-content: center; min-height: 14rem; padding: 2rem; text-align: center; }
.kap-empty-state h2, .kap-empty-state h3 { color: var(--kpi-ink); margin: .6rem 0 .25rem; }
.kap-dialog-backdrop { align-items: center; background: rgba(22,21,19,.45); display: flex; inset: 0; justify-content: center; padding: 1rem; position: fixed; z-index: 80; }
.kap-action-dialog { background: var(--kpi-surface); border: 1px solid var(--kpi-border); box-shadow: 0 28px 70px rgba(22,21,19,.3); max-height: 90vh; overflow: auto; padding: 1.25rem; width: min(30rem, 100%); }
.kap-action-dialog form { display: grid; gap: .8rem; }
.kap-action-dialog h3 { margin: 0; }
.kap-action-dialog label { color: var(--kpi-muted); display: grid; font-size: .75rem; font-weight: 800; gap: .3rem; }
.kap-action-dialog input, .kap-action-dialog select { border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); color: var(--kpi-ink); font: inherit; min-height: 2.5rem; padding: .5rem; }
.kap-action-dialog footer { display: flex; gap: .5rem; justify-content: flex-end; }
.kap-dialog-note { color: var(--kpi-muted); font-size: .78rem; margin: 0; }
@media (max-width: 720px) {
  .kap-profile-fields { grid-template-columns: 1fr; }
  .kap-users-header { align-items: stretch; flex-direction: column; }
  .kap-users-table-wrap { border: 0; overflow: visible; }
  .kap-users-table { display: block; min-width: 0; }
  .kap-users-table thead { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
  .kap-users-table tbody, .kap-users-table tr, .kap-users-table td { display: block; width: 100%; }
  .kap-users-table tr { background: var(--kpi-surface); border: 1px solid var(--kpi-border); box-shadow: 0 .25rem .8rem rgb(22 21 19 / 6%); margin-top: .75rem; padding: .75rem; }
  .kap-users-table td { align-items: start; border: 0; display: grid; gap: .75rem; grid-template-columns: minmax(6.5rem, 34%) minmax(0, 1fr); padding: .45rem 0; }
  .kap-users-table td { min-width: 0; overflow-wrap: anywhere; white-space: normal; word-break: break-word; }
  .kap-users-table td::before { color: var(--kpi-muted); content: attr(data-label); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
  .kap-user-actions { display: grid; gap: .25rem; margin-top: -.25rem; min-width: 0; width: 100%; }
  .kap-user-actions oj-button { max-width: 100%; width: 100%; }
}

.accounts-workloads-clone-content { display: grid; gap: 1rem; min-width: min(36rem, 80vw); }
.accounts-workloads-clone-groups { display: grid; gap: .75rem; max-height: 50vh; overflow-y: auto; }
.accounts-workloads-clone-groups fieldset { border: 1px solid var(--kpi-border); display: grid; gap: .5rem; padding: .75rem; }
.accounts-workloads-clone-groups label { align-items: center; display: flex; gap: .5rem; }
.accounts-workloads-clone-groups label.is-skipped { color: var(--kpi-muted); }
.accounts-workloads-clone-status { font-size: .72rem; margin-left: auto; order: 3; }

/* Weekly Activities — Redwood-first app-owned layout. */
.weekly-activities-page {
  background: var(--kpi-surface);
  border: 1px solid var(--kpi-border);
  border-radius: 0.35rem;
  box-shadow: var(--kpi-shadow);
  min-width: 0;
  padding: clamp(1rem, 2vw, 1.5rem);
}

.weekly-activities-page__header,
.weekly-activities-page__footer,
.weekly-activity-card__header,
.weekly-activity-inline-editor__actions {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}

.weekly-activities-page__header h2 { margin: 0.25rem 0; }
.weekly-activities-page__header p { color: var(--kpi-muted); margin: 0; }

.weekly-activity-filters {
  align-items: end;
  background: var(--kpi-soft);
  border: 1px solid var(--kpi-border);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(10rem, 0.75fr) minmax(10rem, 0.75fr) minmax(14rem, 1.5fr) auto;
  margin: 1.25rem 0;
  padding: 1rem;
}

.weekly-activity-filters__actions { display: flex; gap: 0.5rem; }
.weekly-activity-list { display: grid; gap: 0.85rem; }

.weekly-activity-card {
  background: var(--kpi-surface);
  border: 1px solid var(--kpi-border);
  border-left: 0.3rem solid var(--kpi-brand);
  border-radius: 0.3rem;
  overflow: hidden;
}

.weekly-activity-card--editing { border-color: var(--kpi-brand); box-shadow: 0 0 0 2px color-mix(in srgb, var(--kpi-brand) 18%, transparent); }
.weekly-activity-card__header { background: var(--kpi-soft); min-height: 3.25rem; padding: 0.55rem 0.8rem; }
.weekly-activity-card__header--expandable { cursor: pointer; }
.weekly-activity-card__header h3 { flex: 1; font-size: 1rem; margin: 0; }

.weekly-activity-disclosure {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 0.2rem;
  color: var(--kpi-ink);
  cursor: pointer;
  display: inline-flex;
  height: 2.75rem;
  justify-content: center;
  width: 2.75rem;
}
.weekly-activity-disclosure:focus-visible { outline: 2px solid var(--kpi-brand); outline-offset: 1px; }

.weekly-activity-card__sections {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  padding: 1rem;
}

.weekly-activity-card__sections > section,
.weekly-activity-edit-column {
  background: var(--kpi-surface);
  border: 1px solid var(--kpi-border);
  border-radius: 0.25rem;
  min-width: 0;
  padding: 0.85rem;
}

.weekly-activity-card__sections h4,
.weekly-activity-edit-column h4 { color: var(--kpi-ink); font-size: 0.9rem; margin: 0; }
.weekly-activity-card__rich-text,
.weekly-activity-preview__content { overflow-wrap: anywhere; }
.weekly-activity-rich-text,
.weekly-activity-rich-text.ql-container {
  font-family: inherit;
  font-size: 16px;
  line-height: 1.5;
}
.weekly-activity-rich-text .ql-editor {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
.weekly-activity-card__rich-text--editable {
  border-radius: 0.2rem;
  cursor: text;
  margin: 0.25rem -0.35rem -0.35rem;
  padding: 0.35rem;
  transition: background-color 120ms ease;
}
.weekly-activity-card__rich-text--editable:hover { background: var(--kpi-soft); }
.weekly-activity-section-label {
  align-items: center;
  border-left: 0.2rem solid currentColor;
  border-radius: 999px;
  display: inline-flex;
  font-size: 0.86rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1;
  min-height: 1.9rem;
  padding: 0.35rem 0.7rem;
}
h4.weekly-activity-section-label--this-week,
.weekly-activity-section-label--this-week {
  background: color-mix(in srgb, var(--kpi-brand) 9%, var(--kpi-surface));
  color: #8f3327;
}
h4.weekly-activity-section-label--next-week,
.weekly-activity-section-label--next-week {
  background: color-mix(in srgb, var(--kpi-blue) 9%, var(--kpi-surface));
  color: #245879;
}
.weekly-activity-direction { display: none; }

.weekly-activity-card__actions { align-items: center; display: flex; gap: 0.25rem; }
.weekly-activity-card__date-editor { flex: 0 1 18rem; margin-inline-end: auto; max-width: 18rem; }
.weekly-activity-card__inline-edit { padding: 1rem; }
.weekly-activity-inline-editor { border-top: 1px solid var(--kpi-border); padding: 1rem; }
.weekly-activity-week-date { margin-bottom: 1rem; max-width: 18rem; }
.weekly-activity-editor-composition { display: grid; gap: 0.75rem; }

.weekly-activity-toolbar {
  align-items: center;
  background: var(--kpi-soft);
  border: 1px solid var(--kpi-border);
  border-radius: 0.25rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem;
  min-height: 3rem;
  padding: 0.35rem 0.5rem;
}

.weekly-activity-toolbar > button,
.weekly-activity-toolbar .ql-picker {
  align-items: center;
  display: inline-flex;
  height: 2.5rem;
  justify-content: center;
  margin: 0;
  min-height: 2.5rem;
  min-width: 2.5rem;
  padding: 0.45rem;
}
.weekly-activity-toolbar .ql-size { width: 6rem; }
.weekly-activity-toolbar .ql-color { width: 2.5rem; }
.weekly-activity-toolbar .ql-picker-label {
  align-items: center;
  display: inline-flex;
  height: 100%;
  justify-content: center;
  padding: 0.45rem;
  width: 100%;
}
.weekly-activity-toolbar .ql-size .ql-picker-label {
  align-items: center;
  flex-direction: row;
  gap: 0.35rem;
  justify-content: center;
  white-space: nowrap;
}
.weekly-activity-toolbar .ql-size .ql-picker-label::before { flex: 0 0 auto; text-align: left; }
.weekly-activity-toolbar .ql-size .ql-picker-label::before,
.weekly-activity-toolbar .ql-size .ql-picker-item::before { content: attr(data-value); }
.weekly-activity-toolbar.ql-snow.ql-toolbar > button svg,
.weekly-activity-toolbar.ql-snow.ql-toolbar .ql-picker-label svg,
.weekly-activity-toolbar > button > span {
  font-size: 1.125rem;
  flex: 0 0 1.125rem;
  height: 1.125rem;
  line-height: 1.125rem;
  min-width: 1.125rem;
  width: 1.125rem;
}
.weekly-activity-toolbar.ql-snow.ql-toolbar > button svg { position: static; }
.weekly-activity-toolbar.ql-snow.ql-toolbar .ql-picker-label svg {
  margin-top: 0;
  position: static;
  top: auto;
}
.weekly-activity-toolbar .weekly-activity-list-icon {
  fill: currentColor;
  height: 1.125rem;
  overflow: visible;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-width: 1.5;
  width: 1.125rem;
}
.weekly-activity-toolbar .weekly-activity-list-icon text {
  fill: currentColor;
  font-family: inherit;
  font-size: 5px;
  font-weight: 800;
  stroke: none;
}

.weekly-activity-edit-columns {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.weekly-activity-edit-columns--thisWeek .weekly-activity-edit-column--active { grid-column: 1; grid-row: 1; }
.weekly-activity-edit-columns--thisWeek .weekly-activity-edit-column--inactive { grid-column: 2; grid-row: 1; }
.weekly-activity-edit-columns--nextWeek .weekly-activity-edit-column--active { grid-column: 2; grid-row: 1; }
.weekly-activity-edit-columns--nextWeek .weekly-activity-edit-column--inactive { grid-column: 1; grid-row: 1; }
.weekly-activity-edit-column { min-height: 14rem; position: relative; }
.weekly-activity-edit-column--active { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--kpi-brand) 24%, transparent); }
.weekly-activity-edit-column--active:focus-within {
  border-color: var(--kpi-brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--kpi-brand) 20%, transparent);
  outline: none;
}
.weekly-activity-edit-column--inactive { color: var(--kpi-ink); }
.weekly-activity-edit-column--inactive:hover,
.weekly-activity-edit-column--inactive:focus-within { border-color: var(--kpi-brand); }
.weekly-activity-edit-column__select {
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: block;
  font: inherit;
  padding: 0;
  text-align: left;
  width: 100%;
}
.weekly-activity-edit-column__select:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--kpi-brand) 38%, transparent);
  outline-offset: 2px;
}
.weekly-activity-edit-column__heading { display: block; font-size: 0.82rem; font-weight: 800; }
.weekly-activity-edit-column__heading.weekly-activity-section-label { display: inline-flex; }
.weekly-activity-edit-column__status { color: var(--kpi-brand); display: block; font-size: 0.72rem; font-weight: 800; margin: 0.2rem 0 0.65rem; }
.weekly-activity-edit-column--active .ql-container { border-color: var(--kpi-border); height: auto; min-height: 12rem; }
.weekly-activity-edit-column--active .ql-editor { min-height: 12rem; }
.weekly-activity-edit-column--active .ql-editor li > .ql-ui::before {
  color: var(--weekly-list-marker-color, currentColor);
  font-size: var(--weekly-list-marker-size, inherit);
  font-weight: var(--weekly-list-marker-weight, inherit);
}
.weekly-activity-preview__content { display: block; }
.weekly-activity-inline-editor__actions { justify-content: flex-end; padding-top: 0.75rem; }

.weekly-activity-delete-dialog { --oj-dialog-border-radius: 0.4rem; --oj-dialog-width: min(28rem, calc(100vw - 2rem)); }
.weekly-activity-delete-content { display: grid; gap: 1rem; padding: 0.5rem 1rem 1rem; }
.weekly-activity-delete-content p { color: var(--kpi-muted); line-height: 1.45; margin: 0; }
.weekly-activity-delete-actions { display: flex; gap: 0.5rem; justify-content: flex-end; }
.weekly-activity-message--row { margin: 0 1rem 1rem; }

.weekly-activity-message { margin: 0.75rem 0; padding: 0.75rem; }
.weekly-activity-message--error { background: #fff2f0; border-left: 0.25rem solid #b3261e; color: #7a1a14; }
.weekly-activity-message--warning { align-items: center; background: #fff8e7; border-left: 0.25rem solid #8a5b00; color: var(--kpi-ink); display: flex; gap: 0.75rem; justify-content: space-between; }
.weekly-activity-state { align-items: center; display: flex; gap: 0.75rem; justify-content: center; min-height: 12rem; }
.weekly-activities-page__footer { color: var(--kpi-muted); margin-top: 1rem; }

@media (max-width: 1024px) {
  .weekly-activity-filters { grid-template-columns: 1fr 1fr; }
  .weekly-activity-filters oj-input-text { grid-column: 1 / -1; }
  .weekly-activity-filters__actions { grid-column: 1 / -1; justify-content: flex-end; }
}

@media (max-width: 640px) {
  .weekly-activities-page__header { align-items: stretch; flex-direction: column; }
  .weekly-activity-filters { grid-template-columns: minmax(0, 1fr); }
  .weekly-activity-filters oj-input-text,
  .weekly-activity-filters__actions { grid-column: 1; }
  .weekly-activity-filters__actions { display: grid; grid-template-columns: 1fr 1fr; }
  .weekly-activity-card__sections,
  .weekly-activity-edit-columns { grid-template-columns: minmax(0, 1fr); }
  .weekly-activity-edit-columns--thisWeek .weekly-activity-edit-column--active { grid-column: 1; grid-row: 1; }
  .weekly-activity-edit-columns--thisWeek .weekly-activity-edit-column--inactive { grid-column: 1; grid-row: 2; }
  .weekly-activity-edit-columns--nextWeek .weekly-activity-edit-column--inactive { grid-column: 1; grid-row: 1; }
  .weekly-activity-edit-columns--nextWeek .weekly-activity-edit-column--active { grid-column: 1; grid-row: 2; }
  .weekly-activity-direction { color: var(--kpi-brand); display: block; font-size: 1.4rem; font-weight: 800; text-align: center; }
  .weekly-activity-card__header { align-items: stretch; flex-wrap: wrap; }
  .weekly-activity-card__date-editor { max-width: none; min-width: 12rem; }
  .weekly-activity-card__actions { margin-inline-start: auto; }
  .weekly-activity-toolbar button,
  .weekly-activity-toolbar .ql-picker,
  .weekly-activity-toolbar .ql-picker-label { min-height: 2.75rem; min-width: 2.75rem; }
  .weekly-activity-week-date { max-width: none; }
}

/* KAP KPI: Redwood-first responsive spreadsheet workspace. */
.kpi-spreadsheet-page { background: var(--kpi-surface); border: 1px solid var(--kpi-border); box-shadow: var(--kpi-shadow); min-width: 0; padding: 1.15rem; }
.kpi-spreadsheet-page > header { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; }
.kpi-spreadsheet-page h2 { margin: .25rem 0; }
.kpi-spreadsheet-page header p { color: var(--kpi-muted); margin: .25rem 0 0; }
.kpi-sheet-tabs { border-bottom: 1px solid var(--kpi-border); display: flex; gap: .15rem; margin: 1.1rem 0; overflow-x: auto; }
.kpi-sheet-tabs button { background: transparent; border: 0; border-bottom: 3px solid transparent; color: var(--kpi-muted); cursor: pointer; font: inherit; font-weight: 800; min-width: 3.4rem; padding: .65rem .8rem; }
.kpi-sheet-tabs button.is-active { border-bottom-color: var(--kpi-brand); color: var(--kpi-ink); }
.kpi-sheet-overview { display: grid; gap: .65rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kpi-sheet-overview article { background: var(--kpi-soft); border: 1px solid var(--kpi-border); border-left: 4px solid var(--kpi-brand); display: grid; gap: .35rem; padding: .75rem; }
.kpi-sheet-overview article > span { color: var(--kpi-muted); font-size: .8rem; }
.kpi-sheet-overview article div { display: grid; gap: .35rem; grid-template-columns: repeat(4, 1fr); }
.kpi-sheet-overview article div span { background: #fff; border: 1px solid #ebe7e3; font-size: .75rem; padding: .4rem; text-align: center; }
.kpi-sheet-summary { background: #f7f4f1; border: 1px solid var(--kpi-border); margin-bottom: .9rem; padding: .8rem; }
.kpi-sheet-summary[hidden] { display: none; }
.kpi-sheet-summary h3 { font-size: .9rem; margin: 0 0 .65rem; }
.kpi-sheet-summary h3 small { color: var(--kpi-muted); font-weight: 500; }
.kpi-quarter-summary, .kpi-month-summary { display: grid; gap: .55rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpi-quarter-summary > button, .kpi-month-summary article { background: #fff; border: 1px solid #ebe7e3; color: inherit; display: grid; font: inherit; gap: .25rem; padding: .55rem; text-align: left; }
.kpi-quarter-summary b { font-size: 1.2rem; }
.kpi-sheet-summary__heading, .kpi-quarter-card__heading { align-items: center; display: flex; justify-content: space-between; }
.kpi-sheet-summary__heading h3 { margin-bottom: .65rem; }
.kpi-sheet-summary__heading button { background: transparent; border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); cursor: pointer; font: inherit; padding: .3rem .55rem; }
.kpi-quarter-card, .kpi-d1-progress-quarter { cursor: pointer; }
.kpi-quarter-card.is-selected, .kpi-d1-progress-quarter.is-selected { border-color: var(--kpi-brand); box-shadow: inset 0 0 0 2px var(--kpi-brand); }
.kpi-quarter-card__heading em { font-size: .68rem; font-style: normal; font-weight: 700; }
.kpi-quarter-status-label, .kpi-quarter-count-label { border-radius: 999px; display: inline-flex; font-weight: 800; justify-content: center; padding: .25rem .55rem; width: fit-content; }
.kpi-quarter-status-label--achieved { background: #e6f4ea; color: #176b3a; }
.kpi-quarter-status-label--not-achieved { background: #fde7e3; color: #a63122; }
.kpi-quarter-status-label--in-progress { background: #fff0cc; color: #7b5100; }
.kpi-quarter-status-label--not-started { background: #eeebe8; color: #5f5853; }
.kpi-quarter-count-label { min-width: 2.25rem; }
.kpi-quarter-card small { color: var(--kpi-muted); }
.kpi-month-summary article span { display: flex; font-size: .75rem; justify-content: space-between; }
.kpi-month-summary .is-total { border-top: 1px solid var(--kpi-border); font-weight: 800; margin-top: .2rem; padding-top: .3rem; }
.kpi-d1-matrix { display: grid; grid-template-columns: repeat(4, minmax(5rem, 1fr)); }
.kpi-d1-matrix > * { border-bottom: 1px solid var(--kpi-border); padding: .45rem; text-align: right; text-transform: capitalize; }
.kpi-sheet-table-wrap { border: 1px solid var(--kpi-border); overflow-x: auto; }
.kpi-sheet-table { border-collapse: collapse; min-width: 62rem; width: 100%; }
.kpi-sheet-table th, .kpi-sheet-table td { border-bottom: 1px solid var(--kpi-border); padding: .6rem; text-align: left; white-space: nowrap; }
.kpi-sheet-table th { background: #f4f1ee; color: var(--kpi-muted); font-size: .72rem; text-transform: uppercase; }
.kpi-sheet-table button, .kpi-sheet-cards button { background: #fff; border: 1px solid var(--kpi-border); cursor: pointer; font: inherit; font-size: .75rem; margin-right: .3rem; padding: .3rem .5rem; }
.kpi-sheet-cards { display: none; }
.kpi-sheet-empty { color: var(--kpi-muted); padding: 1rem; text-align: center; }
.kpi-sheet-editor-overlay { align-items: center; background: rgba(22,21,19,.45); display: flex; inset: 0; justify-content: center; padding: 1rem; position: fixed; z-index: 70; }
.kpi-sheet-editor { background: #fff; border: 1px solid var(--kpi-border); box-shadow: 0 28px 70px rgba(22,21,19,.3); max-height: 92vh; overflow: auto; padding: 1rem; width: min(42rem, 100%); }
.kpi-sheet-editor > header, .kpi-sheet-editor > footer { align-items: center; display: flex; justify-content: space-between; }
.kpi-sheet-editor > header h3 { margin: 0; }
.kpi-sheet-editor > header button { background: transparent; border: 0; cursor: pointer; font-size: 1.6rem; }
.kpi-sheet-editor > div { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1rem 0; }
.kpi-sheet-editor label { color: var(--kpi-muted); display: grid; font-size: .75rem; font-weight: 800; gap: .3rem; text-transform: uppercase; }
.kpi-sheet-editor input, .kpi-sheet-editor select { border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); font: inherit; min-height: 2.5rem; padding: .5rem; text-transform: none; width: 100%; }
.kpi-sheet-editor footer { gap: .5rem; justify-content: flex-end; }
.kpi-sheet-editor footer button { border: 1px solid var(--kpi-border); cursor: pointer; font: inherit; padding: .5rem .8rem; }

@media (max-width: 720px) {
  .kpi-spreadsheet-page > header { flex-direction: column; }
  .kpi-sheet-overview, .kpi-quarter-summary, .kpi-month-summary { grid-template-columns: minmax(0, 1fr); }
  .kpi-sheet-table-wrap { display: none; }
  .kpi-sheet-cards { display: grid; gap: .7rem; }
  .kpi-sheet-cards article { border: 1px solid var(--kpi-border); border-left: 4px solid var(--kpi-brand); padding: .75rem; }
  .kpi-sheet-cards article > div { display: grid; gap: .3rem; grid-template-columns: minmax(7rem, .8fr) minmax(0, 1.2fr); padding: .3rem 0; }
  .kpi-sheet-cards article span { color: var(--kpi-muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
  .kpi-sheet-cards article strong { overflow-wrap: anywhere; }
  .kpi-sheet-cards footer { border-top: 1px solid var(--kpi-border); margin-top: .45rem; padding-top: .55rem; }
  .kpi-sheet-editor > div { grid-template-columns: minmax(0, 1fr); }
  .kpi-d1-matrix { font-size: .7rem; grid-template-columns: repeat(4, minmax(3.4rem, 1fr)); }
}

/* KPI Activities phase 1: approved Redwood Spreadsheet Overview + route shells. */
.kpi-spreadsheet-page__header { align-items: flex-end; }
.kpi-spreadsheet-page__fiscal-year { align-items: center; display: flex; gap: .65rem; white-space: nowrap; }
.kpi-spreadsheet-page__fiscal-year span { color: var(--kpi-muted); font-size: .78rem; font-weight: 700; }
.kpi-spreadsheet-page__fiscal-year strong { border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); padding: .55rem .75rem; }
.kpi-sheet-tabs button { align-items: center; display: inline-flex; gap: .45rem; white-space: nowrap; }
.kpi-sheet-tab-code { align-items: center; background: #eeebe8; border-radius: 999px; color: #403b37; display: inline-flex; font-size: .68rem; font-weight: 800; height: 1.55rem; justify-content: center; min-width: 1.55rem; padding: 0 .35rem; }
.kpi-overview-metrics { display: grid; gap: .65rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpi-overview-metrics > button { background: #fff; border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); color: var(--kpi-ink); cursor: pointer; display: grid; font: inherit; gap: .35rem; padding: .8rem; text-align: left; }
.kpi-overview-metrics > button:hover, .kpi-overview-metrics > button:focus-visible { border-color: #8b817a; box-shadow: 0 0 0 1px #8b817a; }
.kpi-overview-metrics > button.is-selected { background: #fff8f5; border-color: var(--kpi-brand); box-shadow: inset 0 0 0 1px var(--kpi-brand); }
.kpi-overview-metrics > button span { color: var(--kpi-muted); font-size: .78rem; }
.kpi-overview-metrics > button strong { font-size: 1.6rem; }
.kpi-overview-metrics > button small { color: var(--kpi-muted); font-size: .7rem; line-height: 1.35; min-height: 1.9em; }
.kpi-overview-filtered-activities { margin-top: 1rem; }
.kpi-overview-filtered-activities__heading { align-items: center; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: .55rem; }
.kpi-overview-filtered-activities__heading h3 { font-size: .95rem; margin: 0; }
.kpi-overview-filtered-activities__heading span { color: var(--kpi-muted); font-size: .75rem; }
.kpi-overview-filtered-activities__heading > button { background: #fff; border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); color: var(--kpi-ink); cursor: pointer; font: inherit; font-size: .78rem; font-weight: 700; padding: .4rem .65rem; }
.kpi-overview-filtered-activities__table-wrap { border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); max-height: 24rem; overflow: auto; }
.kpi-overview-filtered-activities table { border-collapse: collapse; min-width: 68rem; width: 100%; }
.kpi-overview-filtered-activities th, .kpi-overview-filtered-activities td { border-bottom: 1px solid var(--kpi-border); padding: .65rem; text-align: left; vertical-align: top; }
.kpi-overview-filtered-activities th { background: var(--kap-grid-header-bg); position: sticky; top: 0; z-index: 1; }
.kpi-overview-filtered-activities tbody tr:last-child td { border-bottom: 1px solid var(--kpi-border); }
.kpi-overview-portfolio { margin-top: 1rem; }
.kpi-overview-portfolio__heading { align-items: center; display: flex; gap: 1rem; justify-content: space-between; }
.kpi-overview-portfolio__heading h3 { font-size: .95rem; margin: 0 0 .65rem; }
.kpi-overview-portfolio__heading span { color: var(--kpi-muted); font-size: .78rem; }
.kpi-overview-portfolio__table-wrap { border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); overflow-x: auto; }
.kpi-overview-portfolio table { border-collapse: collapse; min-width: 58rem; width: 100%; }
.kpi-overview-portfolio th, .kpi-overview-portfolio td { border-bottom: 1px solid var(--kpi-border); padding: .7rem; text-align: left; }
.kpi-overview-portfolio tbody tr:last-child td { border-bottom: 1px solid var(--kpi-border); }
.kpi-overview-route-link { align-items: center; background: transparent; border: 0; color: inherit; cursor: pointer; display: inline-flex; font: inherit; gap: .5rem; padding: 0; text-align: left; }
.kpi-overview-route-link:hover strong, .kpi-overview-route-link:focus-visible strong { text-decoration: underline; }
.kpi-overview-status { background: #fff0cc; border-radius: 999px; color: #7b5100; display: inline-block; font-size: .72rem; font-weight: 800; padding: .25rem .55rem; white-space: nowrap; }
.kpi-spreadsheet-page .kpi-route-page { margin-top: 0; min-height: 16rem; }

@media (max-width: 720px) {
  .kpi-spreadsheet-page__header { align-items: flex-start; }
  .kpi-overview-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-overview-portfolio__heading { align-items: flex-start; flex-direction: column; gap: 0; }
}

/* KPI Activities phase 2: API-backed activity grids and stable workload selection. */
.kpi-activity-toolbar { align-items: center; display: flex; flex-wrap: wrap; gap: .75rem; justify-content: space-between; margin: 0 0 .9rem; }
.kpi-activity-toolbar__left, .kpi-activity-toolbar__right { align-items: center; display: flex; flex-wrap: wrap; gap: .45rem; }
.kpi-activity-toolbar button { background: #fff; border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); color: var(--kpi-ink); cursor: pointer; font: inherit; font-weight: 700; min-height: 2.35rem; padding: .45rem .75rem; }
.kpi-activity-toolbar__left button:first-child, .kpi-activity-toolbar__right button:first-child { background: var(--kpi-brand); border-color: var(--kpi-brand); color: #fff; }
.kpi-activity-toolbar__left button.kpi-summary-toggle { background: #fff; border-color: var(--kpi-border); color: var(--kpi-ink); }
.kpi-activity-toolbar__right button:last-child { border-color: #c74634; color: #a63122; }
.kpi-activity-toolbar button:disabled { cursor: default; opacity: .45; }
.kpi-status-badge { border-radius: 999px; display: inline-block; font-size: .72rem; font-weight: 800; padding: .25rem .55rem; white-space: nowrap; }
.kpi-status-badge--achieved { background: #e6f4ea; color: #176b3a; }
.kpi-status-badge--in-progress { background: #fff0cc; color: #7b5100; }
.kpi-status-badge--not-achieved { background: #fde7e3; color: #a63122; }
.kpi-status-badge--not-started { background: #f5f5f5; color: #6f6f6f; }
.kpi-month-summary .is-combined { color: var(--kpi-brand); font-weight: 700; }
.kpi-inline-editor { background: #f7f4f1; border: 1px solid var(--kpi-border); border-left: 4px solid var(--kpi-brand); margin: 0 0 .9rem; padding: .85rem; }
.kpi-inline-editor__fields { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kpi-inline-editor label { color: var(--kpi-muted); display: grid; font-size: .75rem; font-weight: 800; gap: .3rem; text-transform: uppercase; }
.kpi-inline-editor input, .kpi-inline-editor select { background: #fff; border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); font: inherit; min-height: 2.5rem; padding: .5rem; text-transform: none; width: 100%; }
.kpi-workload-selector { grid-column: 1 / -1; }
.kpi-workload-selector__current { color: var(--kpi-muted); font-size: .8rem; margin: .45rem 0; }
.kpi-workload-selector__results { background: #fff; border: 1px solid var(--kpi-border); max-height: 12rem; overflow-y: auto; }
.kpi-workload-selector__results > button { align-items: start; background: #fff; border: 0; border-bottom: 1px solid #ebe7e3; cursor: pointer; display: grid; gap: .15rem; padding: .55rem .65rem; text-align: left; width: 100%; }
.kpi-workload-selector__results > button:hover, .kpi-workload-selector__results > button:focus { background: #f4f1ee; }
.kpi-workload-selector__results span, .kpi-workload-selector__results small { color: var(--kpi-muted); }
.kpi-workload-selector__results p { color: var(--kpi-muted); margin: 0; padding: .65rem; }
.kpi-sheet-table tr.is-selected td { background: #f0f6f5; }
.kpi-sheet-table td:first-child, .kpi-sheet-table th:first-child { text-align: center; width: 2.5rem; }
@media (max-width: 760px) {
  .kpi-inline-editor__fields { grid-template-columns: minmax(0, 1fr); }
  .kpi-activity-toolbar { align-items: stretch; flex-direction: column; }
  .kpi-activity-toolbar__left, .kpi-activity-toolbar__right { justify-content: space-between; width: 100%; }
}

/* KPI-only Preact-owned native table. Accounts & Workloads remains untouched. */
.kpi-activities-table-wrap { border: 1px solid var(--kpi-border); box-sizing: border-box; max-width: 100%; min-width: 0; overflow-x: auto; width: 100%; }
.kpi-activities-table { border-collapse: collapse; min-width: 100%; table-layout: fixed; width: max-content; }
.kpi-activities-table th, .kpi-activities-table td { background: var(--kap-grid-cell-bg); border-bottom: 1px solid var(--kap-grid-border); border-right: 1px solid var(--kap-grid-border); box-sizing: border-box; min-height: 3rem; vertical-align: middle; }
.kpi-activities-table thead th { background: var(--kap-grid-header-bg); position: sticky; top: 0; z-index: 4; }
.kpi-activities-table tbody tr:last-child td { border-bottom: 1px solid var(--kpi-border); }
.kpi-activities-table tbody tr:hover td { background: var(--kap-grid-hover-bg); }
.kpi-activities-table tbody tr.kpi-manage-time-reflected-row td, .kpi-activities-table td.kpi-manage-time-reflected-row { background: var(--kap-grid-kpi-reflected-bg); }
.kpi-activities-table tbody tr.is-selected td, .kpi-activities-table td.is-selected { background: var(--kap-grid-selected-bg); }
.kpi-grid-cell { box-sizing: border-box; height: 3rem; min-height: 3rem; padding: .5rem; position: relative; }
.kpi-grid-cell.is-unsaved-row { font-weight: inherit; }
.kpi-grid-cell.is-unsaved-cell { background: var(--kap-grid-draft-bg); color: var(--kap-grid-draft-ink); }
.kpi-grid-cell.is-unsaved-cell::after { background: var(--kap-grid-draft-line); bottom: 0; content: ""; height: 3px; left: .35rem; position: absolute; right: .35rem; z-index: 2; }
.kpi-grid-cell > span { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kpi-clipped-cell-text { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kpi-clipped-cell-tooltip { background: #252525; border-radius: .25rem; box-sizing: border-box; color: #fff; font-size: 1rem; font-weight: 600; line-height: 1.4; max-width: min(32rem, calc(100vw - 1rem)); overflow: auto; overflow-wrap: anywhere; padding: .6rem .75rem; pointer-events: none; position: fixed; white-space: pre-wrap; z-index: 1000; }
.kpi-grid-cell--fixed > span { overflow: visible; text-overflow: clip; white-space: nowrap; }
.kpi-grid-cell--fixed > .kpi-clipped-cell-text { overflow: hidden; text-overflow: ellipsis; }
.kpi-cell-description { display: -webkit-box; line-height: 1.45; max-height: 7.25rem; overflow: hidden; overflow-wrap: anywhere; white-space: pre-wrap; -webkit-box-orient: vertical; -webkit-line-clamp: 5; }
.kpi-grid-column-header { background: var(--kap-grid-header-bg); border-right: 1px solid var(--kap-grid-border); box-sizing: border-box; height: 100%; min-width: 0; width: 100%; }
.kpi-grid-sort-button { align-items: center; background: transparent; border: 0; color: var(--kap-grid-header-ink); cursor: pointer; display: grid; font: inherit; font-weight: 800; gap: .55rem; grid-template-columns: minmax(max-content, 1fr) auto; height: 100%; letter-spacing: .01em; padding: .4rem .65rem; text-align: left; width: 100%; }
.kpi-grid-sort-button:hover, .kpi-grid-sort-button:focus-visible { background: color-mix(in srgb, #475569 10%, transparent); }
.kpi-grid-sort-indicator { flex: 0 0 auto; font-size: .72rem; justify-self: end; }
.kpi-grid-header-title { color: inherit; min-width: max-content; overflow: visible; text-overflow: clip; white-space: nowrap; }
.kpi-description-popup { max-width: min(34rem, 80vw); padding: .65rem; white-space: pre-wrap; }
.kpi-draft-validation { background: #fff8e7; border-left: .25rem solid #8a5b00; color: #5f3f00; margin: 0 0 .8rem; padding: .65rem; }
.kpi-dialog-actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; }
.kpi-selector-cell { min-width: 3rem !important; text-align: center; width: 3rem; }
.kpi-select-all-header { align-items: center; display: flex; justify-content: center; min-height: 2.5rem; width: 100%; }
.kpi-grid-cell > .kpi-reflected-status-badge { align-items: center; border: 1px solid; border-radius: 999px; display: inline-flex; font-size: .7rem; font-weight: 750; gap: .3rem; justify-content: center; margin: 0 auto; min-height: 1.55rem; padding: .16rem .48rem; width: max-content; }
.kpi-reflected-status-badge.is-reflected { background: #dcefe9; border-color: #8bbcaf; color: #205b4f; }
.kpi-reflected-status-badge.is-not-reflected { background: #f8fafc; border-color: #9aa9b8; color: #526273; }
.kpi-reflected-status-badge > [class*="oj-ux-ico-"] { align-items: center; display: inline-flex; flex: 0 0 auto; font-size: .82rem; line-height: 1; }
.kpi-reflected-status-badge > span:last-child { align-items: center; display: inline-flex; line-height: 1; }
.kpi-new-activity-fiscal-year { align-items: center; display: inline-flex; gap: .4rem; }
.kpi-new-activity-fiscal-year > span { color: var(--kpi-muted); font-size: .72rem; font-weight: 800; }
.kpi-new-activity-fiscal-year select { background: var(--kap-grid-cell-bg); border: 1px solid var(--kap-grid-border); border-radius: .2rem; color: var(--kpi-ink); font: inherit; min-height: 2.25rem; padding: .3rem 1.8rem .3rem .55rem; }
.kpi-activity-toolbar__right button.kpi-reflected-action { background: var(--kap-grid-cell-bg); border-color: var(--kap-grid-border); color: var(--kpi-ink); }
.kpi-summary-toggle, .kpi-guide-toggle { align-items: center; display: inline-flex; gap: .35rem; }
.kpi-toggle-chevron { display: inline-block; font-size: 1.15rem; font-weight: 800; line-height: 1; width: .8rem; }
.kpi-activity-guide { background: #fbfaf9; border: 1px solid var(--kpi-border); border-left: 4px solid var(--kpi-brand); margin: 0 0 .9rem; padding: 1rem; }
.kpi-activity-guide[hidden] { display: none; height: 0; margin: 0; padding: 0; }
.kpi-activity-guide__heading { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: .85rem; }
.kpi-activity-guide__heading h3 { margin: .15rem 0 0; }
.kpi-activity-guide__heading > span { color: var(--kpi-muted); font-size: .78rem; font-weight: 800; }
.kpi-activity-guide__facts { display: grid; gap: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.kpi-activity-guide__facts > div { border: 1px solid #e4ded8; display: grid; grid-template-columns: minmax(8rem, 32%) minmax(0, 1fr); margin: -1px 0 0 -1px; }
.kpi-activity-guide__facts dt { background: #f4f1ee; color: var(--kpi-muted); font-size: .75rem; font-weight: 800; padding: .6rem; }
.kpi-activity-guide__facts dd { margin: 0; padding: .6rem; white-space: pre-line; }
.kpi-activity-guide__detail { color: var(--kpi-muted); line-height: 1.45; padding-top: .75rem; }
.kpi-activity-guide__detail p { margin: .35rem 0 0; white-space: pre-line; }
.kpi-activity-guide__error { color: #a63122; }

@media (max-width: 720px) {
  .kpi-activity-guide__facts { grid-template-columns: minmax(0, 1fr); }
}
.kpi-cell-editor-overlay { background: #fff; border: 2px solid #2f6f9f; box-shadow: 0 8px 24px rgba(22,21,19,.2); box-sizing: border-box; display: flex; padding: .2rem; position: fixed; z-index: 120; }
.kpi-cell-editor-overlay--textarea { min-height: 8rem; overflow: auto; padding: .75rem; }
.kpi-cell-editor-overlay--date { border: 0; box-shadow: none; padding: 0; }
.kpi-cell-editor-overlay--date .kpi-cell-editor-control--date { box-sizing: border-box; display: block; height: 100%; margin: 0; max-height: 100%; max-width: 100%; min-height: 0; padding: 0; width: 100%; }
.kpi-cell-editor-control, .kpi-workload-launcher > input { background: #fff; border: 1px solid var(--kpi-border); box-sizing: border-box; font: inherit; height: 100%; min-height: 2.4rem; padding: .5rem; width: 100%; }
.kpi-cell-editor-control--textarea { line-height: 1.5; min-height: 8rem; overflow: auto; padding: .75rem; resize: none; white-space: pre-wrap; }
.kpi-cell-editor-control--date { align-self: stretch; }
.kpi-workload-launcher { min-width: 0; position: relative; width: 100%; }
.kpi-workload-results-popup { box-sizing: border-box; max-width: calc(100vw - 2rem); width: min(32rem, calc(100vw - 2rem)); }
.kpi-workload-cell-editor__results { background: #fff; border: 1px solid var(--kpi-border); box-shadow: 0 10px 24px rgba(22,21,19,.16); box-sizing: border-box; max-height: min(16rem, var(--kpi-workload-popup-max-height, 16rem)); overflow: auto; position: static; width: 100%; }
.kpi-workload-cell-editor__results button { background: #fff; border: 0; border-bottom: 1px solid var(--kpi-border); cursor: pointer; display: grid; gap: .15rem; min-width: max-content; padding: .55rem; text-align: left; width: 100%; }
.kpi-workload-cell-editor__results button strong { white-space: nowrap; }
.kpi-workload-cell-editor__results button:hover, .kpi-workload-cell-editor__results button:focus-visible { background: #f3f1ef; }
.kpi-workload-cell-editor__results span { color: var(--kpi-muted); display: block; padding: .55rem; }
.kpi-saving-dialog { --oj-dialog-width: min(24rem, calc(100vw - 2rem)); }
.kpi-saving-content { align-items: center; display: flex; gap: .8rem; padding: .75rem 1rem 1rem; }
.kpi-saving-content span { font-weight: 700; }
.kpi-activity-toolbar__right button.kpi-delete-button { background: #b42318; border-color: #b42318; color: #fff; }
.kpi-activity-toolbar__right button.kpi-delete-button:hover, .kpi-activity-toolbar__right button.kpi-delete-button:focus-visible { background: #8f1b12; color: #fff; }

.kpi-d1-progress-grid { display: grid; gap: .75rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpi-d1-progress-quarter { background: #fff; border: 1px solid var(--kpi-border); color: inherit; display: block; font: inherit; padding: .75rem; text-align: left; }
.kpi-d1-progress-quarter h4 { margin: 0 0 .65rem; }
.kpi-d1-progress-item + .kpi-d1-progress-item { margin-top: .6rem; }
.kpi-d1-progress-label { align-items: center; display: flex; font-size: .78rem; gap: .5rem; justify-content: space-between; }
.kpi-d1-progress-label strong { font-variant-numeric: tabular-nums; }
.kpi-d1-progress-track { background: #e9e6e3; border-radius: 999px; display: block; height: .72rem; margin-top: .28rem; overflow: hidden; }
.kpi-d1-progress-fill { display: block; height: 100%; min-width: 0; }
.kpi-d1-progress-fill--identified { background: #2f6f9f; }
.kpi-d1-progress-fill--validated { background: #8b63a6; }
.kpi-d1-progress-fill--onboarded { background: #2f7d4b; }

@media (max-width: 760px) {
  .kpi-d1-progress-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Consumption — Redwood-first Signal-integrated Pulse. */
.consumption-page {
  background: #fff;
  border: 1px solid #dedad4;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
  box-sizing: border-box;
  display: grid;
  gap: 1rem;
  min-width: 0;
  overflow-x: clip;
  padding: .75rem;
}
.consumption-page__header { align-items: flex-start; display: flex; gap: 1.25rem; justify-content: space-between; }
.consumption-page__header h1 { font-size: clamp(1.8rem, 3vw, 2.35rem); letter-spacing: -.035em; margin: .2rem 0; }
.consumption-page__header p, .consumption-section-heading p { color: var(--kpi-muted); line-height: 1.45; margin: .25rem 0 0; }
.consumption-import-actions { align-items: center; display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: .75rem; justify-content: flex-end; }
.consumption-import-actions.is-compact { gap: .4rem; }
.consumption-import-actions.is-compact oj-button { font-size: .74rem; min-height: 2.25rem; }
.consumption-import-actions.is-compact oj-button [slot="startIcon"] { font-size: .9rem; }
.consumption-pillar-selector { align-items: center; display: inline-flex; gap: .2rem; margin-top: .4rem; }
.consumption-range-pillar { color: var(--kpi-muted); display: grid; font-size: .72rem; font-weight: 800; gap: .2rem; }
.consumption-range-pillar .consumption-pillar-selector { margin-top: 0; }
.consumption-pillar-selector button { background: #fff; border: 1px solid var(--kpi-border); box-sizing: border-box; color: var(--kpi-ink); cursor: pointer; font: inherit; font-size: .75rem; font-weight: 750; height: var(--kap-consumption-control-height); min-height: var(--kap-consumption-control-height); padding: .3rem .65rem; }
.consumption-pillar-selector button[aria-pressed="true"] { background: var(--kpi-surface-alt); border-color: var(--kpi-brand); color: var(--kpi-brand); }
.consumption-pillar-selector button:disabled { cursor: not-allowed; opacity: .55; }
.consumption-data-center { align-items: center; display: inline-flex; flex-wrap: wrap; gap: .25rem; }
.consumption-import-file-list { display: grid; gap: .5rem; margin-block: .65rem; max-height: 18rem; overflow: auto; }
.consumption-import-file-list article { background: #f8f6f4; border: 1px solid var(--kpi-border); display: grid; gap: .2rem; padding: .55rem .65rem; }
.consumption-import-file-list span { color: var(--kpi-muted); font-size: .75rem; }
.consumption-import-conflicts { color: var(--kpi-danger); }
.consumption-import-overwrites { background: var(--kpi-surface-alt); border-left: .25rem solid var(--kpi-warning); color: var(--kpi-ink); max-height: 16rem; overflow: auto; padding: .65rem .8rem; }
.consumption-import-overwrites p { color: var(--kpi-muted); margin: .3rem 0; }
.consumption-import-overwrites ul { margin: .45rem 0 0; padding-left: 1.25rem; }
.consumption-import-preview .consumption-import-decision-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.consumption-import-technical-details, .consumption-import-update-details { border-top: 1px solid var(--kpi-border); margin-top: .75rem; padding-top: .6rem; }
.consumption-import-technical-details > summary, .consumption-import-update-details > summary { color: var(--kpi-brand); cursor: pointer; font-size: .78rem; font-weight: 800; }
.consumption-import-hard-conflict { background: #fff1ef; border-left: .25rem solid var(--kpi-danger); color: #8f2417; margin-top: .75rem; max-height: 16rem; overflow: auto; padding: .65rem .8rem; }
.consumption-import-hard-conflict p { margin: .3rem 0; }
.consumption-import-hard-conflict ul { margin: .45rem 0 0; padding-left: 1.25rem; }
.consumption-range-bar { align-items: end; background: #f8f6f4; border: 1px solid var(--kpi-border); display: flex; flex-wrap: wrap; column-gap: .75rem; padding: .5rem .75rem; row-gap: .5rem; }
.consumption-range-bar label, .consumption-account-selector { color: var(--kpi-muted); display: grid; font-size: .72rem; font-weight: 800; gap: .2rem; }
.consumption-range-bar select, .consumption-range-bar input, .consumption-account-selector input, .consumption-account-selector select { background: #fff; border: 1px solid var(--kpi-border); box-sizing: border-box; color: var(--kpi-ink); font: inherit; height: var(--kap-consumption-control-height); min-height: var(--kap-consumption-control-height); padding: .35rem .6rem; }
.consumption-range-apply { -webkit-tap-highlight-color: transparent; background: var(--kpi-brand); border: 1px solid var(--kpi-brand); box-sizing: border-box; color: #fff; cursor: pointer; font: inherit; font-weight: 750; height: var(--kap-consumption-control-height); min-height: var(--kap-consumption-control-height); padding: .35rem .9rem; touch-action: manipulation; }
.consumption-range-apply:hover,
.consumption-range-apply:active,
.consumption-range-apply:focus-visible,
.consumption-range-apply:disabled { background: var(--kpi-brand); border-color: var(--kpi-brand); color: #fff; }
.consumption-range-apply:focus-visible { outline: 2px solid var(--oj-core-focus-border-color, #0572ce); outline-offset: 2px; }
.consumption-range-apply:disabled { cursor: not-allowed; opacity: .55; }
.consumption-record-search { flex: 0 1 17rem; max-width: 17rem; }
.consumption-range-error { color: var(--kpi-danger); font-size: .78rem; font-weight: 750; }
.consumption-range-note { color: var(--kpi-muted); font-size: .78rem; }
.consumption-summary-cards { display: grid; gap: .75rem; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.consumption-summary-cards article { display: grid; gap: .25rem; margin: 0; padding: .85rem; }
.consumption-summary-cards span, .consumption-summary-cards small { color: var(--kpi-muted); font-size: .7rem; }
.consumption-summary-cards strong { font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.consumption-account-selector { min-width: 16rem; position: relative; }
.consumption-account-options { background: #fff; border: 1px solid var(--kpi-border); box-shadow: 0 .5rem 1.25rem rgb(0 0 0 / 12%); display: grid; left: 0; max-height: 14rem; overflow-y: auto; position: absolute; right: 0; top: 100%; z-index: 20; }
.consumption-account-options button { background: #fff; border: 0; color: var(--kpi-ink); cursor: pointer; font: inherit; padding: .55rem .65rem; text-align: left; }
.consumption-account-options button:hover, .consumption-account-options button:focus-visible, .consumption-account-options button[aria-selected="true"] { background: #f7f5f2; }
.consumption-file-input { display: none; }
.consumption-import-status, .consumption-import-error { border-left: .25rem solid #2f6f9f; font-size: .82rem; padding: .65rem .8rem; }
.consumption-import-status { background: #eef5fa; color: #245777; }
.consumption-import-error { background: #fff1ef; border-left-color: var(--kpi-danger); color: #8f2417; }
.consumption-pulse-layout { display: grid; gap: 1rem; grid-template-columns: minmax(25rem, .9fr) minmax(30rem, 1.1fr); min-width: 0; }
.consumption-pulse-group { display: grid; gap: .65rem; min-width: 0; }
.consumption-disclosure { align-items: center; background: transparent; border: 0; color: var(--kpi-ink); cursor: pointer; display: flex; font: inherit; gap: .55rem; padding: .25rem 0; text-align: left; }
.consumption-disclosure:hover, .consumption-disclosure:focus-visible { color: var(--kpi-brand); outline: none; }
.consumption-pulse-toggle { font-size: 1.05rem; font-weight: 850; }
.consumption-table-toggle { align-items: center; display: flex; gap: .65rem; }
.consumption-table-toggle > span:last-child { display: grid; gap: .15rem; }
.consumption-table-toggle .consumption-table-title { display: block; }
.consumption-mtd-switch {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--oj-button-outlined-chrome-text-color, #312d2a);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: .78rem;
  font-weight: 700;
  gap: .55rem;
  justify-content: space-between;
  min-height: 2.5rem;
  padding: 0;
  white-space: nowrap;
}
.consumption-mtd-switch:hover:not(:disabled) { background: transparent; }
.consumption-mtd-switch:focus-visible { outline: 2px solid var(--oj-core-focus-border-color, #0572ce); outline-offset: 2px; }
.consumption-mtd-switch:disabled { cursor: not-allowed; opacity: .5; }
.consumption-mtd-switch__track { background: #aca8a4; border-radius: 999px; display: inline-flex; height: 1.2rem; padding: .125rem; transition: background-color .15s ease; width: 2.15rem; }
.consumption-mtd-switch__track > span { background: #fff; border-radius: 50%; box-shadow: 0 1px 2px rgb(0 0 0 / 25%); height: .95rem; transform: translateX(0); transition: transform .15s ease; width: .95rem; }
.consumption-mtd-switch[aria-checked="true"] .consumption-mtd-switch__track { background: var(--oj-core-brand-color-1, #0572ce); }
.consumption-mtd-switch[aria-checked="true"] .consumption-mtd-switch__track > span { transform: translateX(.95rem); }
.consumption-signal-panel, .consumption-trend-panel, .consumption-table-panel { margin: 0; min-width: 0; }
.consumption-section-heading { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: .65rem; }
.consumption-section-heading h2 { font-size: clamp(1.35rem, 2vw, 1.75rem); letter-spacing: -.02em; margin: .15rem 0 0; }
.consumption-overview-context { align-items: flex-end; display: flex; flex-direction: column; gap: .25rem; }
.consumption-help { color: var(--kpi-muted); font-size: .76rem; max-width: min(22rem, 72vw); }
.consumption-help summary { align-items: center; color: var(--kpi-brand); cursor: pointer; display: inline-flex; font-size: 1rem; justify-content: center; list-style: none; min-height: 2rem; min-width: 2rem; }
.consumption-help summary::-webkit-details-marker { display: none; }
.consumption-help summary:focus-visible { outline: 2px solid var(--kpi-brand); outline-offset: 2px; }
.consumption-help p { background: #f8f6f4; border-left: .2rem solid var(--kpi-brand); line-height: 1.4; margin: .25rem 0 0; padding: .55rem .65rem; white-space: normal; }
.consumption-na-value { align-items: center; display: inline-flex; gap: .15rem; white-space: nowrap; }
.consumption-row-help { display: inline-block; text-align: left; vertical-align: middle; }
.consumption-row-help[open] { display: block; white-space: normal; }
.consumption-count-badge { align-items: center; background: #f0eeeb; border-radius: 999px; display: inline-flex; font-size: .78rem; font-weight: 800; justify-content: center; min-height: 1.8rem; min-width: 1.8rem; padding: .2rem .5rem; }
.consumption-signal-inbox { border: 1px solid var(--kpi-border); max-height: 23rem; overflow-x: hidden; overflow-y: auto; }
.consumption-signal { align-items: start; background: #fff; border: 0; border-bottom: 1px solid var(--kpi-border); color: var(--kpi-ink); cursor: pointer; display: grid; font: inherit; gap: .45rem .8rem; grid-template-columns: minmax(0, 1fr) auto; padding: .75rem; text-align: left; width: 100%; }
.consumption-signal:last-child { border-bottom: 0; }
.consumption-signal:hover, .consumption-signal:focus-visible { background: #f7f5f2; }
.consumption-signal.is-selected { background: #fff5f2; box-shadow: inset .22rem 0 0 var(--kpi-brand); }
.consumption-signal-main, .consumption-signal-metrics { display: grid; gap: .15rem; min-width: 0; }
.consumption-signal-main strong, .consumption-signal-main span, .consumption-signal-main small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.consumption-signal-main span, .consumption-signal-metrics span, .consumption-signal-change span { color: var(--kpi-muted); font-size: .72rem; }
.consumption-signal-main small { color: var(--kpi-muted); font-size: .68rem; }
.consumption-signal-metrics { justify-items: end; }
.consumption-signal-metrics span { font-size: .9rem; font-weight: 800; }
.consumption-signal-status { align-items: center; display: flex; gap: .4rem; grid-column: 1 / -1; }
.consumption-signal-type { border-radius: 999px; font-size: .67rem; font-weight: 850; letter-spacing: .025em; padding: .24rem .42rem; white-space: nowrap; }
.consumption-signal-type.is-above-usual { background: #fde6df; color: #a52b16; }
.consumption-signal-type.is-below-usual { background: #e4f0f8; color: #175b8e; }
.consumption-signal-type.is-new-usage { background: #eee7f6; color: #5b3f88; }

.consumption-signal-direction { align-items: center; display: inline-flex; font-size: .7rem; font-weight: 850; gap: .2rem; white-space: nowrap; }
.consumption-signal-direction.is-increased { color: var(--oj-palette-success-100, #356b31); }
.consumption-signal-direction.is-decreased { color: var(--kpi-danger); }
.consumption-signal-direction.is-unchanged { color: var(--kpi-muted); }
.consumption-signal-change { justify-items: end; }
.consumption-sparkline { height: 2rem; overflow: visible; width: 5.75rem; }
.consumption-sparkline polyline { fill: none; stroke: var(--kpi-brand); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.25; vector-effect: non-scaling-stroke; }
.consumption-signal-grade { border-radius: 999px; font-size: .64rem; font-weight: 850; letter-spacing: .025em; padding: .24rem .42rem; white-space: nowrap; }
.consumption-signal-grade.is-critical { background: #fde7e3; color: #a63122; }
.consumption-signal-grade.is-high { background: #fff0cc; color: #7b5100; }
.consumption-signal-grade.is-watch { background: #e9f2f8; color: #245777; }
.consumption-empty-state { color: var(--kpi-muted); margin: 0; padding: 1.5rem; text-align: center; }
.consumption-trend-panel oj-chart { display: block; height: 17rem; width: 100%; }
.consumption-signal-reason { align-items: flex-start; background: #f8f6f4; border-left: .22rem solid var(--kpi-brand); display: flex; gap: .7rem; margin-top: .5rem; padding: .7rem; }
.consumption-signal-reason p { color: var(--kpi-muted); line-height: 1.4; margin: .2rem 0 0; }
.consumption-table-heading { align-items: center; margin-bottom: .5rem; }
.consumption-analysis-mtd-control {
  display: grid;
  justify-items: center;
  gap: .35rem;
}
.consumption-table-heading__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .75rem;
  margin-inline-start: auto;
}
.consumption-table-title { font-size: clamp(1.35rem, 2vw, 1.75rem); letter-spacing: -.02em; }
.consumption-table-plan-count { color: var(--kpi-muted); font-size: .78rem; font-weight: 750; letter-spacing: 0; margin-left: .35rem; white-space: nowrap; }
.consumption-table-content { display: grid; flex: 1 1 auto; grid-template-rows: minmax(18rem, 1fr) 3.75rem; min-height: 0; position: relative; }
.consumption-draft-actions { align-items: center; display: flex; flex: 0 0 auto; gap: .5rem; }
.consumption-draft-actions > span { color: var(--kap-grid-draft-ink); font-size: .76rem; font-weight: 800; }
.consumption-table-panel { background: transparent; border: 0; border-radius: 0; box-shadow: none; display: flex; flex-direction: column; min-height: max(24rem, calc(100dvh - 15rem)); padding: 0; position: relative; }
.consumption-table-scroll { border: 1px solid var(--kpi-border); height: auto; max-width: 100%; min-height: 18rem; overflow-x: auto; overflow-y: auto; position: relative; scrollbar-color: #8b8b8b #f2f2f2; scrollbar-width: thin; width: 100%; }
.consumption-table-scroll.is-scrollable-y { overflow: auto; scrollbar-color: #8b8b8b #f2f2f2; scrollbar-width: thin; }
.consumption-table-scroll::-webkit-scrollbar { display: none; }
.consumption-table-scroll.is-scrollable-y::-webkit-scrollbar { display: block; height: .65rem; width: .65rem; }
.consumption-table-scroll.is-scrollable-y::-webkit-scrollbar-thumb { background: #8b8b8b; border: 2px solid #f2f2f2; border-radius: 999px; }
.consumption-table-scroll.is-scrollable-y::-webkit-scrollbar-track { background: #f2f2f2; }

@media (min-width: 64rem) {
  .kpi-shell:has(.consumption-page) { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; height: 100dvh; min-height: 0; overflow: hidden; }
  .kpi-shell__body:has(.consumption-page) { flex: 1 1 0; min-height: 0; overflow: hidden; }
  .kpi-content:has(.consumption-page) { grid-template-rows: minmax(0, 1fr); min-height: 0; overflow: hidden; }
  .consumption-page { gap: .5rem; grid-template-rows: auto auto minmax(0, 1fr); height: 100%; min-height: 0; overflow: hidden; padding-block: .45rem; }
  .consumption-page__header h1 { margin: 0; }
  .consumption-range-bar { padding: .4rem .65rem; }
  .consumption-range-bar select,
  .consumption-range-bar input { min-height: var(--kap-consumption-control-height); padding-block: .35rem; }
  .consumption-table-panel { min-height: 0; overflow: hidden; padding: 0; }
  .consumption-table-content { min-height: 0; }
  .consumption-table-scroll { min-height: 0; min-width: 0; overflow-x: auto; overflow-y: auto; }
  .consumption-table-heading { margin-bottom: .25rem; }
  .consumption-table-title { font-size: 1.25rem; }
}
.consumption-scroll-controls { align-items: center; display: flex; flex-direction: column; gap: .38rem; position: absolute; right: .65rem; top: 50%; transform: translateY(-50%); z-index: 18; }
.consumption-scroll-controls button { background: rgb(255 255 255 / 95%); border: 1px solid var(--kpi-border); box-shadow: 0 .6rem 1.5rem rgb(0 0 0 / 14%); color: var(--kpi-ink); cursor: pointer; font-size: 1.35rem; height: 2.55rem; width: 2.55rem; }
.consumption-scroll-controls button:disabled { color: var(--kpi-muted); cursor: default; opacity: .45; }
.consumption-table { --consumption-grid-font-size: .88rem; border-collapse: separate; border-spacing: 0; min-width: 100%; table-layout: fixed; width: max-content; }
.consumption-table th, .consumption-table td { background: var(--kap-grid-cell-bg); border-bottom: 1px solid var(--kap-grid-border); border-right: 1px solid var(--kap-grid-border); height: 2.75rem; min-width: 7rem; padding: .3rem .48rem; }
.consumption-table thead th { background: var(--kap-grid-header-bg); color: var(--kap-grid-header-ink); font-size: var(--consumption-grid-font-size); font-weight: 800; text-align: center; }

.consumption-table thead tr:first-child th { border-bottom-color: #d7dde2; }
.consumption-table thead tr:first-child th { position: sticky; top: 0; z-index: 7; }
.consumption-table thead tr:first-child th { height: 2.6rem; }
.consumption-table thead tr:nth-child(2) th { height: 2.9rem; position: sticky; top: 2.6rem; z-index: 7; }
.consumption-table tbody tr:hover > td, .consumption-table tbody tr:hover > th { background: var(--kap-grid-hover-bg); }
.consumption-table tbody tr.is-context > td, .consumption-table tbody tr.is-context > th { background: #fff7f3; }
.consumption-account-column { left: 0; min-width: 19rem !important; position: sticky; text-align: left !important; width: 19rem; z-index: 3; }
.consumption-table thead .consumption-account-column { font-size: var(--consumption-grid-font-size); padding-left: 2.35rem; text-align: left; z-index: 6; }
.consumption-table thead tr:first-child .consumption-account-column { background: #efebe7; z-index: 9; }
.consumption-account-row .consumption-account-column { background: #f7f5f2; }
.consumption-account-toggle { background: transparent; border: 0; border-radius: var(--oj-core-border-radius-sm); color: inherit; cursor: pointer; display: block; font: inherit; min-height: 2.25rem; padding: .05rem; text-align: left; width: 100%; }
.consumption-account-toggle:hover { background: var(--oj-core-bg-color-hover, #eeebe8); }
.consumption-account-toggle:focus-visible { box-shadow: 0 0 0 2px var(--oj-core-focus-border-color, #0572ce); outline: none; }
.consumption-leading { align-items: start; display: grid; gap: .05rem .4rem; grid-template-columns: 1.25rem minmax(0, 1fr); min-width: 0; width: 100%; }
.consumption-disclosure-slot { align-items: center; display: inline-flex; grid-column: 1; grid-row: 1 / 3; justify-content: center; min-height: 1.2rem; width: 1.25rem; }
.consumption-leading-copy { display: grid; gap: .05rem; grid-column: 2; line-height: 1.2; min-width: 0; }
.consumption-account-plan-count { color: var(--oj-core-text-color-secondary); font-size: .68rem; font-weight: 500; }
.consumption-leading strong { font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.consumption-account-toggle small, .consumption-account-column > small, .consumption-leading-copy > small { color: var(--kpi-muted); font-size: .7rem; font-weight: 600; line-height: 1.15; }
.consumption-plan-row .consumption-account-column { padding-left: 1.65rem; }
.consumption-end-user { display: block; font-size: .98rem; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.consumption-clipped-text { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.consumption-clipped-tooltip { background: #252525; border-radius: .25rem; color: #fff; font-size: 1rem; font-weight: 600; line-height: 1.35; max-width: min(28rem, calc(100vw - 1rem)); overflow-wrap: anywhere; padding: .55rem .7rem; pointer-events: none; position: fixed; white-space: normal; z-index: 1000; }
.consumption-metric-help { border-bottom: 1px dotted currentColor; cursor: help; font-weight: 750; }
.consumption-value-cell { font-size: var(--consumption-grid-font-size); font-variant-numeric: tabular-nums; text-align: right; }
.consumption-value-cell small { color: var(--kpi-muted); display: block; font-size: .58rem; line-height: 1.05; margin-top: .05rem; text-transform: uppercase; }
.consumption-quarter-total { background: #f5f7f8 !important; font-weight: 800; }
.consumption-preq-gap { background: #faf8f5 !important; font-weight: 750; }
.consumption-forecast-cell { background: #eaf3f8 !important; box-shadow: none; cursor: cell; }
.consumption-quarter-heading.is-forecast { background: #dbeaf3 !important; color: #184f73; }
.consumption-month-heading.is-forecast { background: #e4f0f6 !important; color: #184f73; }
.consumption-quarter-total.is-forecast { background: #dfeef5 !important; color: #184f73; }
.consumption-preq-gap.is-forecast { background: #e8f3f8 !important; color: #184f73; }
.consumption-forecast-cell.is-draft { background: var(--kap-grid-draft-bg) !important; box-shadow: none; color: var(--kap-grid-draft-ink); }
.consumption-quarter-heading, .consumption-table thead .consumption-account-column { color: #26343d; font-size: var(--consumption-grid-font-size); font-weight: 800; }
.consumption-quarter-heading { border-block: 1px solid var(--kpi-border) !important; letter-spacing: .025em; }
.consumption-quarter-label { display: inline-block; font-size: .88rem; font-weight: 850; line-height: 1.2; }
.consumption-month-heading { color: #34434d; font-size: var(--consumption-grid-font-size); font-weight: 800; padding-block: .42rem !important; }
.consumption-month-heading.is-actual,
.consumption-month-heading.is-forecast,
.consumption-month-heading.is-mtd { box-shadow: none; }
.consumption-month-label { display: block; font-size: .82rem; font-weight: 850; letter-spacing: .035em; line-height: 1.15; }
.consumption-month-status { border: 1px solid currentColor; border-radius: .2rem; display: inline-flex; font-size: .62rem; font-weight: 800; justify-content: center; letter-spacing: .035em; line-height: 1; margin-top: .22rem; min-width: 3.65rem; padding: .18rem .3rem; }
.consumption-month-status.is-actual { background: #f2f7ef; color: #34601f; }
.consumption-month-status.is-forecast { background: #edf6fb; color: #175b8e; }
.consumption-month-status.is-mtd { background: #fff4e9; color: #a5470a; }
.consumption-quarter-total small { display: block; font-size: .68rem; font-weight: 850; }
.consumption-quarter-total small.is-actual { color: #34601f; }
.consumption-quarter-total small.is-forecast { color: #175b8e; }
.consumption-quarter-total small.is-incomplete, .consumption-quarter-total small.is-mixed { color: #9a4f00; }
.consumption-forecast-editor { background: #fff; border: 2px solid #2f6f9f; font: inherit; font-variant-numeric: tabular-nums; height: 2.25rem; min-width: 6rem; padding: .35rem; text-align: right; width: 100%; }
.consumption-forecast-composition-popover { background: #fff; border: 1px solid var(--oj-core-divider-color, #b8b8b8); border-radius: .35rem; box-shadow: 0 .3rem 1rem rgb(0 0 0 / 18%); box-sizing: border-box; left: 0; padding: .55rem .65rem; position: fixed; top: 0; visibility: hidden; width: min(15.5rem, calc(100vw - 1rem)); z-index: 1200; }
.consumption-forecast-composition-popover[style] { visibility: visible; }
.consumption-forecast-composition-popover form { display: grid; gap: .45rem; margin: 0; }
.consumption-forecast-composition-popover header { align-items: flex-start; border-bottom: 1px solid var(--oj-core-divider-color, #dedede); display: flex; gap: .5rem; justify-content: space-between; padding-bottom: .35rem; }
.consumption-forecast-composition-popover header > span { display: grid; min-width: 0; }
.consumption-forecast-composition-popover header strong { font-size: .76rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.consumption-forecast-composition-popover header small { color: var(--kpi-muted); font-size: .66rem; }
.consumption-forecast-composition-unit { background: #eef4f8; border-radius: .2rem; color: #31566f !important; flex: 0 0 auto; font-weight: 800; padding: .08rem .3rem; }
.consumption-forecast-composition-fields { display: grid; gap: .28rem; }
.consumption-forecast-composition-fields label { align-items: center; display: grid; font-size: .72rem; font-weight: 750; gap: .12rem .4rem; grid-template-columns: 4.3rem minmax(0, 1fr); }
.consumption-forecast-composition-fields input { border: 1px solid var(--oj-core-divider-color, #b8b8b8); border-radius: .22rem; box-sizing: border-box; font: inherit; font-variant-numeric: tabular-nums; height: 1.8rem; padding: .2rem .4rem; text-align: right; width: 100%; }
.consumption-forecast-composition-fields input:focus { border-color: #2878a8; box-shadow: 0 0 0 1px #2878a8; outline: none; }
.consumption-forecast-composition-fields input[aria-invalid="true"] { border-color: var(--oj-core-danger-3, #b3261e); }
.consumption-forecast-composition-fields label > small { color: var(--oj-core-danger-3, #b3261e); font-size: .62rem; font-weight: 700; grid-column: 2; line-height: 1.15; }
.consumption-forecast-composition-popover footer { display: flex; gap: .35rem; justify-content: flex-end; padding-top: .1rem; }
.consumption-forecast-composition-popover button { border: 1px solid #8b979f; border-radius: .22rem; cursor: pointer; font: inherit; font-size: .7rem; font-weight: 750; min-height: 1.7rem; padding: .18rem .55rem; }
.consumption-forecast-composition-popover button.is-secondary { background: #fff; color: #26343d; }
.consumption-forecast-composition-popover button.is-primary { background: #2d668c; border-color: #2d668c; color: #fff; }
.consumption-account-single { display: grid; gap: .2rem; min-width: 0; }
.consumption-account-single strong, .consumption-account-single small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.consumption-account-single small { color: var(--kpi-muted); font-size: .68rem; font-weight: 600; }
#consumptionImportDialog,
#consumptionForecastImportDialog { box-sizing: border-box; max-width: calc(100vw - 3rem); width: min(68rem, calc(100vw - 3rem)); }
.consumption-import-dialog-body { background: var(--kpi-surface); box-sizing: border-box; max-block-size: calc(100dvh - 12rem); min-block-size: min(28rem, calc(100dvh - 12rem)); min-width: 0; overflow-y: auto; width: 100%; }
.consumption-import-progress { align-items: center; display: flex; gap: 1rem; min-height: min(28rem, calc(100dvh - 12rem)); padding-inline: clamp(.25rem, 6vw, 4rem); }
.consumption-import-progress p, .consumption-import-preview > p, .consumption-import-result p { color: var(--kpi-muted); line-height: 1.45; margin: .35rem 0 0; }
.consumption-import-preview dl { display: grid; gap: .5rem; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 1rem 0; }
.consumption-import-preview dl > div { background: #f7f5f2; border-radius: .25rem; padding: .7rem; }
.consumption-import-preview dt { color: var(--kpi-muted); font-size: .72rem; }
.consumption-import-preview dd { font-size: 1.1rem; font-weight: 800; margin: .2rem 0 0; }
.consumption-import-preview .consumption-import-decision-summary { grid-template-columns: repeat(5, minmax(7.5rem, 1fr)); overflow-x: auto; padding-bottom: .25rem; }
.consumption-import-decision-summary small { color: var(--kpi-muted); display: block; font-size: .68rem; margin-top: .18rem; white-space: nowrap; }
.consumption-import-inline-error { background: var(--oj-core-danger-secondary-1, #fff4f2); border-left: .2rem solid var(--oj-core-danger-3, #b3261e); margin-bottom: .8rem; padding: .65rem .75rem; }
.consumption-import-inline-error p { margin: .2rem 0 0; }
.consumption-import-footer { align-items: center; display: flex; gap: .75rem; justify-content: flex-end; width: 100%; }
.consumption-import-footer-summary { margin-inline-end: auto; }
.consumption-import-footer-actions { align-items: center; display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; }
.consumption-import-preview-scroll { max-block-size: min(20rem, 42dvh); overflow: auto; }
.consumption-import-compare-table { border-collapse: collapse; font-variant-numeric: tabular-nums; min-width: 54rem; width: 100%; }
.consumption-import-compare-table th, .consumption-import-compare-table td { border-bottom: 1px solid var(--kpi-border); padding: .55rem .65rem; text-align: right; vertical-align: top; white-space: nowrap; }
.consumption-import-compare-table thead th { background: #f7f5f2; color: var(--kpi-muted); font-size: .72rem; position: sticky; top: 0; z-index: 1; }
.consumption-import-compare-table th:nth-child(-n+2), .consumption-import-compare-table td:nth-child(-n+2) { text-align: left; }
.consumption-import-compare-table tbody th { white-space: normal; }
.consumption-import-compare-table tbody th strong, .consumption-import-compare-table tbody th small { display: block; }
.consumption-import-compare-table tbody th small { color: var(--kpi-muted); font-size: .68rem; font-weight: 600; margin-top: .16rem; }
.consumption-import-status { background: #f0efed; border-radius: 1rem; color: var(--kpi-muted); display: inline-block; font-size: .7rem; font-weight: 800; padding: .16rem .5rem; }
.consumption-import-status.is-changed { background: #edf3f7; color: #255773; }
.consumption-import-status.is-new { background: #edf5eb; color: #315c2d; }
.consumption-import-update-details { border-top: 1px solid var(--kpi-border); margin-top: .8rem; padding-top: .7rem; }
.consumption-import-update-details > summary { cursor: pointer; font-weight: 800; }
.consumption-import-overwrites { margin-top: .65rem; }
.consumption-sales-rep-preview { border-top: 1px solid var(--kpi-border); margin-top: .8rem; padding-top: .75rem; }
.consumption-sales-rep-heading { align-items: baseline; display: flex; flex-wrap: wrap; gap: .4rem 1rem; justify-content: space-between; }
.consumption-sales-rep-heading span { color: var(--kpi-muted); font-size: .75rem; font-weight: 700; }
.consumption-sales-rep-table-wrap { margin-top: .6rem; max-height: 14rem; overflow: auto; }
.consumption-sales-rep-table { border-collapse: collapse; min-width: 32rem; width: 100%; }
.consumption-sales-rep-table th, .consumption-sales-rep-table td { border-bottom: 1px solid var(--kpi-border); padding: .55rem .65rem; text-align: left; }
.consumption-sales-rep-table thead th { background: #f7f5f2; color: var(--kpi-muted); font-size: .72rem; position: sticky; top: 0; }
.consumption-sales-rep-table tbody th { font-size: .82rem; }
.consumption-sales-rep-table tbody td { font-size: .8rem; }
.consumption-sales-rep-arrow { color: var(--kpi-muted); padding: 0 .45rem; }
.consumption-sales-rep-status { border-radius: 1rem; display: inline-block; font-size: .7rem; font-weight: 800; padding: .15rem .5rem; }
.consumption-sales-rep-table .is-changed .consumption-sales-rep-status { background: #e9f4e7; color: var(--oj-palette-success-120, #315c2d); }
.consumption-sales-rep-table .is-unchanged { color: var(--kpi-muted); }
.consumption-sales-rep-table .is-unchanged .consumption-sales-rep-status { background: #f0efed; color: var(--kpi-muted); }
.consumption-import-preview .consumption-sales-rep-empty { background: #f7f5f2; border-left: .2rem solid var(--kpi-border); margin-top: .55rem; padding: .5rem .65rem; }
.consumption-import-result { display: grid; gap: .45rem; justify-items: start; padding: .65rem 0; }
.consumption-import-result > span { font-size: 1.5rem; }
.consumption-import-result.is-success > span { color: var(--oj-palette-success-90, #3b6f36); }
.consumption-import-result.is-error > span { color: var(--oj-palette-danger-100, #b13b2e); }

.kap-user-link-meta { align-items: center; background: #f7f5f2; border-radius: .25rem; display: flex; gap: .75rem; justify-content: space-between; padding: .7rem .8rem; }
.kap-user-link-meta span, .kap-field__hint { color: var(--kpi-muted); font-size: .78rem; }
.kap-success { background: #eef6ec; border-left: 3px solid var(--oj-palette-success-90, #3b6f36); color: #285524; padding: .65rem .75rem; }

@media (max-width: 1120px) {
  .consumption-pulse-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .consumption-page { padding: .7rem; }
  .consumption-page__header, .consumption-table-heading { align-items: stretch; flex-direction: column; }
  .consumption-import-actions { align-self: stretch; justify-content: flex-start; width: 100%; }
  .consumption-summary-cards { grid-template-columns: repeat(5, minmax(9rem, 1fr)); overflow-x: auto; padding-bottom: .25rem; scroll-snap-type: x proximity; }
  .consumption-summary-cards article { scroll-snap-align: start; }
  .consumption-signal { align-items: start; grid-template-columns: minmax(0, 1fr); }
  .consumption-signal > * { grid-column: 1; justify-self: start; max-width: 100%; }
  .consumption-signal-main, .consumption-signal-metrics, .consumption-signal-change, .consumption-signal-direction, .consumption-sparkline { grid-column: 1; justify-items: start; }
  .consumption-signal-change { grid-template-columns: auto auto; gap: .5rem; }
  .consumption-account-column { min-width: 14rem !important; width: 14rem; }
  .consumption-scroll-controls { flex-direction: row; position: absolute; right: .65rem; top: 4.1rem; transform: none; }
  #consumptionImportDialog,
  #consumptionForecastImportDialog {
    left: 50% !important;
    max-width: calc(100vw - 2rem);
    position: fixed !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: calc(100vw - 2rem);
  }
  .consumption-import-dialog-body { min-block-size: min(24rem, calc(100dvh - 10rem)); min-width: 0; width: 100%; }
  .consumption-import-footer { align-items: stretch; flex-direction: column; }
  .consumption-import-footer-summary { line-height: 1.3; overflow-wrap: anywhere; width: 100%; }
  .consumption-import-footer-actions { justify-content: flex-end; width: 100%; }
  .consumption-import-progress { align-items: flex-start; flex-direction: column; justify-content: center; min-height: min(24rem, calc(100dvh - 10rem)); padding-inline: .25rem; }
  .consumption-import-preview .consumption-import-decision-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow-x: visible; }
  .consumption-import-preview-scroll { max-block-size: 38dvh; }
}

/* Consumption Analysis and incremental Consumption Records. */
.consumption-load-more { align-items: center; align-self: end; background: var(--oj-core-bg-color-content); box-sizing: border-box; display: flex; gap: .75rem; height: 3.75rem; justify-content: center; min-height: 3.75rem; padding: .65rem; position: sticky; bottom: 0; width: 100%; z-index: 9; }
.consumption-records-sentinel { height: 1px; width: 100%; }
.consumption-pillar-forecast-note { color: var(--kpi-muted); flex-basis: 100%; font-size: .72rem; margin: 0; }
.consumption-load-more.is-placeholder small { color: var(--kpi-muted); }
.consumption-records-count-value { color: var(--oj-core-text-color-primary, #161513); font-size: 1.08em; font-weight: 850; }
.consumption-records-loading { align-items: center; color: var(--kpi-muted); display: flex; font-size: .78rem; gap: .45rem; justify-content: flex-end; min-height: 1.5rem; min-width: 11.5rem; }
.consumption-load-more button { background: var(--oj-button-outlined-chrome-bg-color); border: 1px solid var(--oj-button-outlined-chrome-border-color); border-radius: var(--oj-core-border-radius-sm); color: var(--oj-button-outlined-chrome-text-color); cursor: pointer; min-height: 2.25rem; padding: .4rem .75rem; }
.consumption-insights-page {
  background: #fff;
  border: 1px solid #dedad4;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
  display: grid;
  gap: .85rem;
  min-width: 0;
  padding: 1rem;
}
.consumption-insights-page > .consumption-insights-header { border-bottom: 0; padding-bottom: 0; }
.consumption-insights-page > .kpi-panel {
  background: transparent;
  border: 0;
  border-top: 1px solid #e7e3de;
  border-radius: 0;
  box-shadow: none;
  padding-inline: 0;
}
.consumption-insights-page > .consumption-insights-composition,
.consumption-insights-page > .consumption-insights-alert-trend {
  background: #fff;
  border: 1px solid #d4cec6;
  border-radius: var(--oj-core-border-radius-md);
  box-shadow: none;
  padding: 1rem;
}
.consumption-insights-page .consumption-insights-kpis { background: #f8f7f5; border-block: 1px solid #e7e3de; gap: 0; }
.consumption-insights-page .consumption-insights-kpis .kpi-panel {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.consumption-insights-page .consumption-insights-kpis .kpi-panel + .kpi-panel { border-left: 1px solid #e7e3de; }
.consumption-insights-page .consumption-insights-performance-grid > .kpi-panel,
.consumption-insights-page .consumption-insights-composition-grid > .kpi-panel,
.consumption-insights-page .consumption-insights-alert-trend > .kpi-panel { background: #fff; border-color: #d4cec6; box-shadow: none; }
.consumption-insights-header { align-items: end; }
.consumption-insights-header p, .consumption-section-heading p { color: var(--kpi-muted); margin: .2rem 0 0; }
.consumption-insights-header-actions { align-items: end; display: flex; flex-wrap: wrap; gap: .75rem; justify-content: flex-end; min-width: 0; }
.consumption-insights-pillar { color: var(--kpi-muted); display: grid; font-size: .72rem; font-weight: 800; gap: .2rem; text-transform: none; }
.consumption-insights-pillar .consumption-pillar-selector { margin-top: 0; }
.consumption-insights-pillar .consumption-pillar-selector button { height: 2.6rem; min-height: 2.6rem; }
.consumption-insights-export { color: var(--kpi-muted); display: grid; font-size: .72rem; font-weight: 800; gap: .25rem; text-transform: uppercase; }
.consumption-insights-context { align-items: end; display: flex; gap: .75rem; min-width: 0; }
.consumption-insights-filter { color: var(--kpi-muted); display: grid; font-size: .72rem; font-weight: 800; gap: .2rem; text-transform: none; }
.consumption-insights-filter > select { background: var(--oj-core-bg-color-content); border: 1px solid var(--oj-core-border-color-enabled); color: var(--oj-core-text-color-primary); min-height: 2.6rem; padding: .45rem 2rem .45rem .65rem; width: max-content; }
.consumption-insights-filter--sales-rep { flex: 0 0 auto; }
.consumption-insights-filter--account { flex: 1 1 18rem; min-width: 18rem; width: min(25rem, 28vw); }
.consumption-insights-combobox { position: relative; }
.consumption-insights-combobox > input { background: var(--oj-core-bg-color-content); border: 1px solid var(--oj-core-border-color-enabled); color: var(--oj-core-text-color-primary); min-height: 2.6rem; padding: .45rem 4rem .45rem .65rem; width: 100%; }
.consumption-insights-clear { background: transparent; border: 0; color: var(--oj-link-text-color); cursor: pointer; font-weight: 750; position: absolute; right: .35rem; top: .35rem; height: 1.9rem; }
.consumption-sales-rep-overview { overflow: hidden; }
.consumption-sales-rep-table { overflow-x: auto; }
.consumption-sales-rep-table table { border-collapse: collapse; font-size: .82rem; min-width: 54rem; width: 100%; }
.consumption-sales-rep-table th, .consumption-sales-rep-table td { border-bottom: 1px solid var(--oj-core-divider-color); padding: .65rem .55rem; text-align: right; white-space: nowrap; }
.consumption-sales-rep-table th:first-child { text-align: left; }
.consumption-sales-rep-table button { background: transparent; border: 0; color: var(--oj-link-text-color); cursor: pointer; font: inherit; font-weight: 800; padding: 0; }
.consumption-sales-rep-table tr.is-selected { background: color-mix(in srgb, var(--oj-core-bg-color-selected) 65%, transparent); }
.consumption-sales-rep-overview .consumption-sales-rep-table thead th {
  background: #e9eef2;
  color: #263746;
  font-size: .82rem;
  font-weight: 800;
}
.consumption-sales-rep-table .is-positive { color: var(--kpi-success); }
.consumption-sales-rep-table .is-negative { color: var(--kpi-danger); }
.consumption-sales-account-review { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.consumption-sales-account-card { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.consumption-sales-movement-columns { display: grid; flex: 1 1 auto; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: 0; }
.consumption-sales-movement-columns > div { min-height: 0; overflow-y: auto; padding-right: .35rem; }
.consumption-sales-movement-columns h3 { color: var(--kpi-muted); font-size: .75rem; margin: 0 0 .45rem; text-transform: uppercase; }
.consumption-sales-movement-columns button, .consumption-sales-attention-list button { align-items: center; background: transparent; border: 0; border-bottom: 1px solid var(--oj-core-divider-color); color: inherit; cursor: pointer; display: flex; gap: .75rem; justify-content: space-between; padding: .55rem 0; text-align: left; width: 100%; }
.consumption-sales-movement-columns button:hover, .consumption-sales-attention-list button:hover { background: var(--oj-core-bg-color-hover); }
.consumption-sales-comparison-guide { color: var(--kpi-muted); font-size: .78rem; margin: 0 0 .7rem; }
.consumption-sales-movement-values { align-items: flex-end; display: flex; flex: 0 0 auto; flex-direction: column; gap: .1rem; text-align: right; }
.consumption-sales-movement-values small { color: var(--kpi-muted); font-size: .68rem; font-weight: 500; white-space: nowrap; }
.consumption-sales-attention-list button { align-items: start; display: grid; grid-template-columns: minmax(0, 1fr) minmax(14rem, .85fr); }
.consumption-sales-attention-list button > span { display: grid; gap: .15rem; min-width: 0; }
.consumption-sales-attention-list button > span:last-child { text-align: right; }
.consumption-sales-attention-list small { color: var(--kpi-muted); overflow-wrap: anywhere; }
.consumption-sales-attention-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding-right: .35rem; }
.consumption-insights-options { background: var(--oj-core-bg-color-content); border: 1px solid var(--oj-core-border-color-enabled); box-shadow: var(--oj-core-box-shadow-md, 0 .5rem 1.5rem rgb(0 0 0 / 16%)); display: grid; left: 0; max-height: 18rem; overflow-y: auto; position: absolute; right: 0; top: calc(100% + .2rem); z-index: 30; }
.consumption-insights-options button { background: transparent; border: 0; border-bottom: 1px solid var(--oj-core-divider-color); color: inherit; cursor: pointer; display: grid; gap: .15rem; padding: .6rem .7rem; text-align: left; }
.consumption-insights-options button:hover, .consumption-insights-options button:focus-visible, .consumption-insights-options button.is-active { background: var(--oj-core-bg-color-hover); outline: none; }
.consumption-insights-options small, .consumption-insights-options p { color: var(--kpi-muted); margin: 0; }
.consumption-insights-refresh { align-items: center; color: var(--kpi-muted); display: flex; font-size: .78rem; gap: .45rem; min-height: 1.5rem; }
.consumption-results-refresh { align-items: center; color: var(--kpi-muted); display: flex; font-size: .82rem; gap: .55rem; min-height: 2.25rem; padding: 0 .1rem .55rem; }
.consumption-insights-kpis { display: grid; gap: .7rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.consumption-insights-kpis article { display: grid; gap: .3rem; padding: .9rem; }
.consumption-insights-kpis article > span { color: var(--kpi-muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.consumption-insights-kpis article > strong { font-size: clamp(1.45rem, 2.2vw, 2rem); letter-spacing: -.035em; }
.consumption-insights-kpis article > small { font-weight: 700; }
.consumption-metric { font-weight: 800; }
.consumption-metric.is-actual { color: #315f75; }
.consumption-metric.is-forecast { color: #2f6f9f; }
.consumption-metric.is-quarter { color: #614f82; }
.consumption-metric.is-positive { color: #2f672c; }
.consumption-metric.is-negative,
.consumption-metric.is-critical { color: #a3352a; }
.consumption-metric.is-high { color: #8b5e00; }
.consumption-insights-performance-grid { display: grid; gap: .85rem; grid-template-columns: minmax(25rem, 1.08fr) minmax(22rem, .92fr); min-width: 0; }
.consumption-insights-total-regions { display: grid; grid-template-columns: minmax(0, .85fr) 1px minmax(0, 1.15fr); min-width: 0; }
.consumption-insights-total-regions h3 { color: var(--kpi-muted); font-size: .75rem; margin: 0; text-transform: uppercase; }
.consumption-insights-fy-total, .consumption-insights-quarter-totals { min-width: 0; padding: .35rem .7rem 0; }
.consumption-insights-totals-divider { background: var(--kpi-border); height: 100%; }
.consumption-insights-totals-chart { display: block; height: 16.5rem; width: 100%; }
.consumption-insights-composition-grid { align-items: stretch; display: grid; gap: .85rem; grid-template-columns: repeat(2, minmax(0, 1fr)); height: 24rem; min-width: 0; }
.consumption-insights-composition-chart { display: grid; grid-template-rows: minmax(0, 1fr) auto; min-height: 0; min-width: 0; }
.consumption-insights-composition-chart__plot { display: block; height: 100%; min-height: 0; width: 100%; }
.consumption-insights-composition-legend { align-items: center; display: flex; flex-wrap: wrap; font-size: .72rem; font-weight: 750; gap: .45rem 1rem; justify-content: center; padding-top: .35rem; }
.consumption-insights-composition-legend span { align-items: center; display: inline-flex; gap: .35rem; }
.consumption-insights-composition-legend i { background: var(--legend-color); border-radius: 2px; display: inline-block; height: .65rem; width: 1.2rem; }
.consumption-insights-composition-warning { background: #fff7e1; border-inline-start: 3px solid #8b5e00; color: #5d4714; font-size: .78rem; margin: .25rem 0 .55rem; padding: .45rem .6rem; }
.consumption-insights-movement-detail { border: 1px solid var(--kpi-border); box-sizing: border-box; display: flex; flex-direction: column; height: 100%; min-height: 0; min-width: 0; overflow: hidden; padding: .65rem .8rem; }
.consumption-insights-movement-heading { align-items: end; display: flex; flex: 0 0 auto; gap: .6rem; justify-content: space-between; margin-bottom: .45rem; min-width: 0; }
.consumption-insights-movement-heading h3 { font-size: .9rem; line-height: 1.2; margin: .12rem 0 0; white-space: nowrap; }
.consumption-insights-composition-selector { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: .25rem; justify-content: flex-end; }
.consumption-insights-composition-selector button { background: #fff; border: 1px solid var(--kpi-border); border-radius: 999px; color: var(--kpi-ink); cursor: pointer; font: inherit; font-size: .72rem; min-height: 1.75rem; padding: .18rem .5rem; }
.consumption-insights-composition-selector button[aria-pressed="true"] { background: var(--kpi-surface-alt); border-color: var(--kpi-brand); color: var(--kpi-brand); font-weight: 700; }
.consumption-insights-movement-list { min-height: 0; overflow: auto; }
.consumption-insights-movement-detail table { border-collapse: collapse; min-width: 100%; }
.consumption-insights-movement-detail th, .consumption-insights-movement-detail td { border-bottom: 1px solid var(--kpi-border); padding: .45rem .35rem; text-align: start; }
.consumption-insights-movement-detail th:not(:first-child), .consumption-insights-movement-detail td:not(:first-child) { text-align: end; white-space: nowrap; }
.consumption-insights-movement-detail thead th { background: var(--oj-core-bg-color-content); position: sticky; top: 0; z-index: 1; }
.consumption-insights-composition-empty { align-content: center; display: grid; min-height: 19rem; }
.consumption-insights-composition-empty h3, .consumption-insights-composition-empty p { margin: .25rem 0; }
.consumption-insights-quarter-labels { display: none; }
.consumption-insights-legend { align-items: center; color: var(--kpi-muted); display: flex; font-size: .7rem; font-weight: 800; gap: .35rem; }
.consumption-insights-legend i { background: #315f75; display: inline-block; height: .65rem; margin-left: .4rem; width: 1.25rem; }
.consumption-insights-legend i.is-forecast, .consumption-insights-split-bar i.is-forecast { background-color: #78abc4; background-image: repeating-linear-gradient(135deg, transparent 0 4px, rgb(255 255 255 / 75%) 4px 7px); }
.consumption-insights-qoq-cards { display: grid; gap: .45rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.consumption-insights-qoq-cards article { border-top: 3px solid var(--oj-palette-success-90, #3b6f36); display: grid; gap: .35rem; min-width: 0; padding: .65rem .5rem; }
.consumption-insights-qoq-cards article.is-negative { border-top-color: var(--kpi-danger); }
.consumption-insights-qoq-cards strong { color: var(--oj-palette-success-110, #2f672c); font-size: 1.25rem; }
.consumption-insights-qoq-cards h3 { color: #614f82; }
.consumption-insights-qoq-cards .is-negative strong { color: var(--kpi-danger); }
.consumption-insights-qoq-cards small, .consumption-insights-note { color: var(--kpi-muted); font-size: .66rem; }
.consumption-insights-alert-trend-grid { align-items: stretch; display: grid; gap: .8rem; grid-template-columns: minmax(17rem, .72fr) minmax(28rem, 1.28fr); min-width: 0; }
.consumption-insights-alert-trend .consumption-signal-inbox { box-sizing: border-box; height: 24rem; max-height: 24rem; overflow-y: auto; }
.consumption-insights-alert-trend .consumption-signal-main > strong { font-size: 1rem; }
.consumption-insights-alert-trend .consumption-signal-main > span:not(.consumption-signal-badges) { font-size: .88rem; font-weight: 700; }
.consumption-insights-alert-trend .consumption-signal-metrics > strong { font-size: 1.2rem; }
.consumption-insights-alert-trend .consumption-signal-metrics > small { font-size: .82rem; font-weight: 800; }
.consumption-signal-badges { align-items: center; display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .2rem; }
.consumption-signal-badges .consumption-signal-type, .consumption-signal-badges .consumption-signal-grade { align-items: center; display: inline-flex; gap: .25rem; }
.consumption-insights-linked-trend { border: 1px solid var(--kpi-border); box-sizing: border-box; display: grid; gap: .5rem; grid-template-rows: auto minmax(0, 1fr) auto; height: 24rem; min-width: 0; overflow: hidden; padding: .7rem; }
.consumption-insights-linked-trend h3, .consumption-insights-linked-trend p { margin: 0; }
.consumption-insights-linked-trend > div > p { color: var(--kpi-ink); font-size: 1rem; font-weight: 750; }
.consumption-insights-actual-chart { display: block; height: 100%; min-height: 15rem; width: 100%; }
.consumption-insights-status { border-radius: var(--oj-core-border-radius-sm); font-size: .64rem; font-weight: 800; justify-self: start; padding: .18rem .4rem; }
.consumption-insights-status.is-actual { background: #e8f3e7; color: #285b28; }
.consumption-insights-status.is-forecast { background: #e4f0f6; color: #175b8e; }
.consumption-insights-status.is-mixed { background: #e4f0f6; color: #175b8e; }
.consumption-insights-status.is-incomplete { background: #fceeed; color: #9a382d; }
.consumption-insights-contribution { display: grid; gap: .45rem; min-width: 0; }
.consumption-insights-contribution-grid { display: grid; gap: .85rem; grid-template-columns: minmax(24rem, 1.08fr) minmax(22rem, .92fr); min-width: 0; }
.consumption-insights-contribution-list, .consumption-insights-plan-list { align-content: start; display: grid; max-height: 25rem; overflow-y: auto; padding-right: .35rem; }
.consumption-insights-contribution-list button { background: transparent; border: 0; border-bottom: 1px solid var(--kpi-border); color: inherit; cursor: pointer; display: grid; gap: .25rem .6rem; grid-template-columns: minmax(0, 1fr) auto; padding: .65rem 0; text-align: left; }
.consumption-insights-account-other { font: inherit; width: 100%; }
.consumption-insights-account-unavailable { border-bottom: 1px solid var(--kpi-border); display: grid; gap: .25rem .6rem; grid-template-columns: minmax(0, 1fr) auto; padding: .65rem 0; }
.consumption-insights-account-unavailable > span { font-size: 1rem; font-weight: 800; }
.consumption-insights-account-unavailable > strong { color: var(--kpi-muted); font-size: 1.05rem; }
.consumption-insights-account-unavailable > small { color: var(--kpi-muted); grid-column: 1 / -1; }
.consumption-insights-contribution-list button.is-selected { background: #fff5f2; box-shadow: inset 3px 0 0 var(--kpi-brand); padding-left: .65rem; }
.consumption-insights-contribution-list button[aria-pressed="true"] { background: #fff5f2; box-shadow: inset 3px 0 0 var(--kpi-brand); padding-left: .65rem; }
.consumption-insights-contribution-list small, .consumption-insights-contribution-list i { grid-column: 1 / -1; }
.consumption-insights-contribution-list button > span { font-size: 1rem; font-weight: 800; }
.consumption-insights-contribution-list button > strong { font-size: 1.05rem; }
.consumption-insights-contribution-list small, .consumption-insights-plan-list small, .consumption-insights-plan-list article > span { color: var(--kpi-muted); font-size: .78rem; }
.consumption-insights-contribution-list i { background: #ece9e6; height: .4rem; }
.consumption-insights-contribution-list i b { background: #315f75; display: block; height: 100%; }
.consumption-insights-workloads { display: flex; gap: .35rem; margin-bottom: .4rem; overflow-x: auto; }
.consumption-insights-workloads button { background: transparent; border: 1px solid var(--kpi-border); color: inherit; cursor: pointer; padding: .35rem .55rem; white-space: nowrap; }
.consumption-insights-workloads button[aria-selected="true"] { background: var(--oj-core-bg-color-selected); border-color: var(--oj-core-focus-border-color); }
.consumption-insights-plan-list article { border-bottom: 1px solid var(--kpi-border); display: grid; gap: .45rem; padding: .7rem 0; }
.consumption-insights-plan-list article > div:first-child { align-items: center; display: flex; justify-content: space-between; }
.consumption-insights-plan-list article > div:first-child > strong { font-size: 1.05rem; }
.consumption-insights-plan-list article small b { color: var(--kpi-ink); font-size: .9rem; }
.consumption-insights-plan-track { background: #ece9e6; height: .55rem; overflow: hidden; width: 100%; }
.consumption-insights-split-bar { display: flex; height: 100%; overflow: hidden; }
.consumption-insights-split-bar i.is-actual { background: #315f75; }

/* Keep the wide-screen chart sized to its quarter count. The detail table
   scrolls within the same bounded row instead of stretching the chart. */
@media (min-width: 1101px) {
  .consumption-insights-composition-grid {
    align-items: start;
    height: auto;
  }
  .consumption-insights-composition-chart {
    gap: .25rem;
    grid-template-rows: auto minmax(0, 1fr);
    height: 18.5rem;
  }
  .consumption-insights-composition-legend {
    justify-content: flex-start;
    padding-top: 0;
  }
  .consumption-insights-movement-detail { height: 18.5rem; }
  .consumption-insights-composition-grid[data-quarter-count="1"] .consumption-insights-composition-chart,
  .consumption-insights-composition-grid[data-quarter-count="1"] .consumption-insights-movement-detail { height: 12.5rem; }
  .consumption-insights-composition-grid[data-quarter-count="2"] .consumption-insights-composition-chart,
  .consumption-insights-composition-grid[data-quarter-count="2"] .consumption-insights-movement-detail { height: 14.5rem; }
  .consumption-insights-composition-grid[data-quarter-count="3"] .consumption-insights-composition-chart,
  .consumption-insights-composition-grid[data-quarter-count="3"] .consumption-insights-movement-detail { height: 16.5rem; }
}

@media (max-width: 1100px) {
  .consumption-insights-performance-grid, .consumption-insights-composition-grid, .consumption-insights-alert-trend-grid, .consumption-insights-contribution-grid { grid-template-columns: minmax(0, 1fr); }
  .consumption-insights-composition-grid { height: auto; }
  .consumption-insights-composition-chart, .consumption-insights-movement-detail { height: 24rem; }
  .consumption-insights-alert-trend .consumption-signal-inbox { height: 22rem; }
}
@media (max-width: 800px) {
  .consumption-insights-page { align-content: start; grid-auto-rows: max-content; padding: .85rem; }
  .consumption-insights-page .consumption-insights-kpis .kpi-panel:nth-child(odd) { border-left: 0; }
  .consumption-insights-page .consumption-insights-kpis .kpi-panel:nth-child(n + 3) { border-top: 1px solid #e7e3de; }
  .consumption-insights-header { align-items: stretch; flex-direction: column; }
  .consumption-insights-header-actions { justify-content: flex-start; width: 100%; }
  .consumption-insights-context { align-items: stretch; flex-direction: column; width: 100%; }
  .consumption-insights-filter--account { flex: 0 0 auto; }
  .consumption-insights-filter--account, .consumption-insights-filter--sales-rep { min-width: 0; width: 100%; }
  .consumption-insights-filter > select { width: 100%; }
  .consumption-sales-account-review, .consumption-sales-movement-columns { grid-template-columns: minmax(0, 1fr); }
  .consumption-insights-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .consumption-insights-total-regions { grid-template-columns: minmax(0, 1fr); }
  .consumption-insights-totals-divider { height: 1px; width: 100%; }
  .consumption-insights-composition-chart {
    gap: .25rem;
    grid-template-rows: auto minmax(0, 1fr);
    height: 18.5rem;
  }
  .consumption-insights-composition-chart[data-quarter-count="1"] { height: 13rem; }
  .consumption-insights-composition-chart[data-quarter-count="2"] { height: 14.5rem; }
  .consumption-insights-composition-chart[data-quarter-count="3"] { height: 16.5rem; }
  .consumption-insights-composition-legend {
    justify-content: flex-start;
    padding-top: 0;
  }
}
@media (min-width: 801px) {
  .consumption-sales-account-card { height: 22.5rem; }
}
@media (max-width: 520px) {
  .consumption-insights-page { padding: .7rem; }
  .consumption-insights-kpis, .consumption-insights-qoq-cards { grid-template-columns: minmax(0, 1fr); }
  .consumption-insights-page .consumption-insights-kpis .kpi-panel + .kpi-panel { border-left: 0; border-top: 1px solid #e7e3de; }
  .consumption-sales-attention-list button { grid-template-columns: minmax(0, 1fr); }
  .consumption-sales-attention-list button > span:last-child { text-align: left; }
}

/* Dense Category Matrix: anchored, modeless Oracle JET popup navigation. */
.kpi-menu-matrix {
  background: var(--oj-core-bg-color-content, var(--kpi-surface));
  color: var(--oj-core-text-color-primary, var(--kpi-ink));
  max-height: min(72vh, 34rem);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.7rem;
  width: min(80rem, calc(100vw - 2rem));
}

.kpi-menu-matrix__header {
  align-items: center;
  border-bottom: 1px solid var(--oj-core-divider-color, var(--kpi-border));
  display: flex;
  justify-content: space-between;
  min-height: 2.4rem;
  padding: 0 0.15rem 0.5rem 0.7rem;
}

.kpi-menu-matrix__title {
  font-size: 0.88rem;
  font-weight: 800;
}

.kpi-menu-matrix__rows {
  display: grid;
  gap: 0.38rem;
  padding-top: 0.55rem;
}

.kpi-menu-group {
  align-items: start;
  border: 0;
  border-bottom: 1px solid #d8d3cf;
  display: grid;
  gap: 0.55rem;
  grid-template-columns: 10.25rem minmax(0, 1fr);
  margin: 0;
  padding: 0.48rem 0.25rem 0.65rem;
}

.kpi-menu-group:last-child {
  border-bottom: 0;
}

.kpi-menu-group--home {
  display: block;
}

.kpi-menu-group__label {
  align-items: center;
  background: var(--kpi-surface-alt);
  border-inline-start: 0.2rem solid var(--kpi-brand);
  color: var(--kpi-ink);
  display: flex;
  font-size: 0.875rem;
  font-weight: 800;
  gap: 0.45rem;
  line-height: 1.35;
  min-height: 2.1rem;
  padding: 0.38rem 0.55rem;
}

.kpi-menu-group__icon {
  color: var(--kpi-brand);
  flex: 0 0 auto;
  font-size: 1rem;
}

.kpi-menu-group__links {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: 0.48rem;
}

.kpi-menu-link {
  align-items: center;
  background: #fff;
  border: 1px solid #bdb6b1;
  border-radius: 999px;
  color: #312d2a;
  cursor: pointer;
  display: inline-flex;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.35;
  min-height: 2.25rem;
  padding: 0.42rem 0.75rem;
  text-align: start;
  text-decoration: none;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}

.kpi-menu-link:hover {
  background: #fbe9e7;
  border-color: #b43b2c;
  box-shadow: inset 3px 0 #c74634;
  color: #6e251b;
  text-decoration: none;
}

.kpi-menu-link:focus-visible {
  background: #fbe9e7;
  border-color: #b43b2c;
  box-shadow: inset 3px 0 #c74634;
  color: #6e251b;
  outline: 3px solid #312d2a;
  outline-offset: 2px;
  text-decoration: none;
}

.kpi-menu-link.is-selected {
  background: #8b2f22;
  border-color: #8b2f22;
  color: #fff;
}

.kpi-menu-link.is-selected:hover {
  background: #6f2118;
  border-color: #6f2118;
  color: #fff;
}

.kpi-menu-link__content {
  align-items: center;
  display: inline-flex;
  gap: 0.4rem;
  min-width: 0;
  white-space: normal;
}

.kpi-menu-link__label {
  order: 2;
}

.kpi-menu-link .kpi-navigation-icon {
  color: currentColor;
  font-size: 1rem;
}

.kpi-menu-link .kpi-navigation-code-badge {
  align-items: center;
  background: #f8efed;
  border-color: #dda89f;
  border-radius: 0.35rem;
  color: #7d2c22;
  font-size: 0.6875rem;
  font-weight: 800;
  justify-content: center;
  letter-spacing: 0.02em;
  line-height: 1.2;
  margin-inline-start: 0;
  min-width: 1.55rem;
  order: 1;
  padding: 0.12rem 0.34rem;
}

.kpi-menu-link:hover .kpi-navigation-code-badge,
.kpi-menu-link:focus-visible .kpi-navigation-code-badge {
  background: #fff;
  border-color: #c74634;
  color: #6e251b;
}

.kpi-menu-link.is-selected .kpi-navigation-code-badge {
  background: #fff7f5;
  border-color: #fff;
  color: #6e251b;
}

/* The popup replaces the former rail while preserving the shell's height contract. */
.kpi-shell__body,
.kpi-shell__body:has(.kpi-side-nav.is-closed) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.kpi-content {
  grid-column: 1;
}

.kpi-shell:has(.kpi-side-nav.is-open) .kpi-footer,
.kpi-shell:has(.kpi-side-nav.is-closed) .kpi-footer,
.kpi-footer {
  position: fixed;
  bottom: 0;
  margin-left: 1.5rem;
  width: calc(100% - 3rem);
  z-index: 19;
}

@media (max-width: 1024px) {
  #navigationToggle { display: inline-flex; }
  .kpi-content { width: 100%; }
  .kpi-footer { margin-left: 1rem; width: calc(100% - 2rem); }
}

@media (max-width: 720px) {
  .kpi-menu-matrix {
    max-height: min(78vh, 36rem);
    padding: 0.55rem;
    width: calc(100vw - 1rem);
  }
  .kpi-menu-group { grid-template-columns: minmax(0, 1fr); }
  .kpi-menu-group__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-menu-link { width: 100%; }
  .kpi-footer { margin-left: 0.75rem; width: calc(100% - 1.5rem); }
}

@media (max-width: 480px) {
  .kpi-header__brand { gap: .5rem; padding-inline-start: .5rem; }
  .kpi-header__brand .demo-oracle-icon { height: auto; width: 96px; }

  .kpi-menu-matrix {
    width: calc(100vw - 3rem);
  }

  .kpi-menu-group__links {
    display: flex;
    flex-wrap: wrap;
  }

  .kpi-menu-link {
    max-width: 100%;
    width: auto;
  }
}
.consumption-forecast-tooltip {
  position: relative;
  display: flex;
  width: 100%;
  color: inherit;
  cursor: help;
  outline-offset: 2px;
  justify-content: flex-end;
  text-align: end;
}
.consumption-forecast-tooltip__content {
  position: absolute;
  z-index: 12;
  inset-block-end: calc(100% + .45rem);
  inset-inline-start: 50%;
  display: none;
  width: max-content;
  max-width: min(24rem, 75vw);
  padding: .65rem .75rem;
  border: 1px solid var(--oj-core-divider-color);
  border-radius: .35rem;
  background: var(--oj-core-bg-color-content, #fff);
  box-shadow: 0 .3rem 1rem rgb(0 0 0 / 20%);
  color: var(--oj-core-text-color-primary);
  text-align: start;
  transform: translateX(-50%);
  white-space: normal;
}
.consumption-forecast-tooltip:hover .consumption-forecast-tooltip__content,
.consumption-forecast-tooltip:focus .consumption-forecast-tooltip__content,
.consumption-forecast-tooltip:focus-within .consumption-forecast-tooltip__content { display: block; }
.consumption-forecast-tooltip__content dl { display: grid; grid-template-columns: auto auto; gap: .2rem .8rem; margin: 0; }
.consumption-forecast-tooltip__content dl div { display: contents; }
.consumption-forecast-tooltip__content dt { font-weight: 600; }
.consumption-forecast-tooltip__content dd { margin: 0; text-align: end; }
.consum...[truncated]

.consumption-movement-bridge__scroll { overflow-x: auto; }
.consumption-movement-bridge table { width: 100%; border-collapse: collapse; }
.consumption-movement-bridge th,
.consumption-movement-bridge td { padding: .65rem .75rem; border-block-end: 1px solid var(--oj-core-divider-color); text-align: end; }
.consumption-movement-bridge th:first-child,
.consumption-movement-bridge td:last-child { text-align: start; }
.consumption-movement-bridge tr.is-unclassified td,
.consumption-movement-bridge tr.is-unavailable td { color: var(--oj-core-text-color-secondary); }

/* Attainment dashboard */
.attainment-page {
  background: #fff;
  border: 1px solid #dedad4;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
  display: grid;
  gap: 1rem;
  min-width: 0;
  padding: 1rem;
}
.attainment-header { align-items: flex-start; }
.attainment-page > .attainment-header { border-bottom: 1px solid #e7e3de; padding-bottom: 1rem; }
.attainment-header h1 { margin: .25rem 0; }
.attainment-header p,
.attainment-chart-card p,
.attainment-budget-form p { margin: .25rem 0 0; color: var(--oj-core-text-color-secondary); }
.attainment-loading { display: flex; align-items: center; justify-content: center; gap: .75rem; }
.consumption-initial-state { display: grid; gap: .75rem; }
.consumption-initial-loading { display: inline-flex; align-items: center; gap: .5rem; min-height: 2rem; color: var(--oj-core-text-color-secondary, #52606d); font-size: .875rem; }
.accounts-workloads-confirmation-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: grid;
  place-items: center;
  padding: 1rem;
  background: rgb(0 0 0 / 0.42);
}

.accounts-workloads-confirmation {
  width: min(34rem, 100%);
  border-radius: var(--oj-core-border-radius-lg, 0.5rem);
  background: var(--oj-core-bg-color-content, #fff);
  color: var(--oj-core-text-color-primary, #161513);
  box-shadow: 0 1rem 3rem rgb(0 0 0 / 0.25);
  padding: 1.25rem;
}

.accounts-workloads-confirmation h2 {
  margin: 0 0 0.75rem;
}

.accounts-workloads-confirmation footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 1.25rem;
}

.accounts-workloads-inline-validation {
  margin-block: 0.5rem;
  color: var(--oj-core-danger-1, #b3261e);
}

.app-message-region,
.consumption-message-region {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 1200;
  width: min(28rem, calc(100vw - 2rem));
}
@media (max-width: 600px) {
  .app-message-region,
  .consumption-message-region {
    top: .5rem;
    right: .5rem;
    width: calc(100vw - 1rem);
  }
}
.consumption-analysis-period { color: var(--oj-core-text-color-secondary, #52606d); font-size: .75rem; line-height: 1.35; }
.attainment-inline-error { padding: .75rem 1rem; border-radius: .5rem; background: var(--oj-core-danger-1); color: var(--oj-core-danger-3); }
.attainment-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.attainment-summary article { display: grid; gap: .5rem; padding: 1rem 1.1rem; border: 1px solid var(--oj-core-divider-color); border-radius: var(--oj-core-border-radius-md); background: var(--oj-core-bg-color-content); box-shadow: var(--oj-core-box-shadow-sm); }
.attainment-summary span { color: var(--oj-core-text-color-secondary); font-size: .82rem; }
.attainment-summary strong { font-size: 1.35rem; }
.attainment-fy-hero { display: grid; grid-template-columns: minmax(7rem, .7fr) repeat(4, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--oj-core-divider-color); border-radius: var(--oj-core-border-radius-md); background: var(--oj-core-divider-color); box-shadow: none; }
.attainment-fy-hero > div { display: grid; align-content: center; gap: .35rem; min-height: 6.75rem; padding: 1rem 1.15rem; background: var(--oj-core-bg-color-content); }
.attainment-fy-hero small { color: var(--oj-core-text-color-secondary); font-weight: 600; }
.attainment-fy-hero strong { color: var(--oj-core-text-color-primary); font-size: clamp(1.35rem, 2.2vw, 1.9rem); font-weight: 750; }
.attainment-fy-hero__title { background: color-mix(in srgb, var(--oj-core-bg-color-content) 82%, var(--oj-palette-brand-rgb-50)) !important; }
.attainment-fy-hero__title span { color: var(--oj-core-text-color-secondary); font-size: .82rem; font-weight: 700; }
.attainment-fy-hero__primary { border-block-start: .25rem solid var(--oj-core-focus-border-color); }
.attainment-fy-hero__primary span { color: var(--oj-core-text-color-secondary); font-size: .78rem; }
.attainment-quarter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .85rem; }
.attainment-quarter-card { display: grid; gap: .65rem; min-width: 0; padding: 1rem; border: 1px solid var(--oj-core-divider-color); border-radius: var(--oj-core-border-radius-md); background: var(--oj-core-bg-color-content); color: var(--oj-core-text-color-primary); box-shadow: none; }
.attainment-quarter-card__heading { display: flex; align-items: center; justify-content: space-between; }
.attainment-quarter-card__heading strong { font-size: 1.05rem; }
.attainment-quarter-card__heading b { padding: .3rem .65rem; border: 1px solid #5b9f72; border-radius: 999px; background: #dff4e5; color: #174f2b; font-size: 1rem; font-weight: 800; letter-spacing: .01em; }
.attainment-quarter-card__metric { display: grid; gap: .18rem; }
.attainment-quarter-card__metric small,
.attainment-quarter-card__actual,
.attainment-quarter-card__pillars,
.attainment-quarter-card__basis { color: var(--oj-core-text-color-secondary); font-size: .82rem; }
.attainment-quarter-card__metric strong { color: var(--oj-core-text-color-primary); font-size: 1.15rem; font-weight: 700; }
.attainment-quarter-card__metric--primary strong { font-size: 1.5rem; font-weight: 800; }
.attainment-quarter-card__actual { color: var(--oj-core-text-color-primary); font-weight: 650; }
.attainment-quarter-card__actual { display: flex; flex-wrap: wrap; gap: .15rem; }
.attainment-quarter-card__basis { font-weight: 650; }
.attainment-quarter-card__pillars { padding-block-start: .55rem; border-block-start: 1px solid var(--oj-core-divider-color); }
.attainment-chart-card { min-width: 0; }
.attainment-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-block-end: .8rem; }
.attainment-section-heading h2 { margin: 0; font-size: 1.1rem; }
.attainment-section-heading > span { color: var(--oj-core-text-color-secondary); font-weight: 600; }

.attainment-chart { width: 100%; height: 22rem; }
.attainment-chart-card p,
.attainment-section-heading p { margin: .25rem 0 0; color: var(--oj-core-text-color-secondary); }
.attainment-chart-card p { font-size: .85rem; }
.attainment-section-heading p { font-size: .82rem; }
.attainment-chart-card.attainment-chart-card { border-inline-start: .25rem solid color-mix(in srgb, var(--oj-core-focus-border-color) 55%, transparent); }
.attainment-chart-card.attainment-chart-card.attainment-chart-card + .attainment-chart-card { border-inline-start-color: var(--oj-core-divider-color); }
.attainment-page > .attainment-chart-card.attainment-chart-card { background: #fff; border: 1px solid #d4cec6; border-radius: var(--oj-core-border-radius-md); box-shadow: none; padding: 1rem; }
.attainment-budget-form { display: grid; gap: 1rem; min-width: min(30rem, 75vw); }
.attainment-budget-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.attainment-budget-fields label { display: grid; gap: .35rem; color: var(--oj-core-text-color-secondary); font-size: .82rem; font-weight: 600; }
.attainment-budget-fields input { box-sizing: border-box; width: 100%; min-height: 2.5rem; padding: .45rem .6rem; border: 1px solid var(--oj-core-divider-color); border-radius: .35rem; background: var(--oj-core-bg-color-content); color: var(--oj-core-text-color-primary); font: inherit; }
.attainment-budget-fields input:focus { outline: 2px solid var(--oj-core-focus-border-color); outline-offset: 1px; }
.attainment-budget-total { display: flex; justify-content: space-between; padding-block-start: .75rem; border-block-start: 1px solid var(--oj-core-divider-color); }
@media (max-width: 900px) {
  .attainment-page { padding: .85rem; }
  .attainment-fy-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .attainment-fy-hero__title { grid-column: 1 / -1; min-height: 4rem !important; }
  .attainment-quarter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .attainment-page { padding: .7rem; }
  .attainment-summary { grid-template-columns: 1fr; }
  .attainment-fy-hero,
  .attainment-quarter-grid { grid-template-columns: 1fr; }
  .attainment-budget-fields { grid-template-columns: 1fr; }
  .attainment-budget-form { min-width: 0; }
}

/* Shared page navigation: Oracle JET borderless toolbar inside every page title surface. */
.kpi-page-menu {
  min-width: 0;
  margin: 0 0 .2rem;
  overflow-x: auto;
  scrollbar-width: none;
}
/* The toolbar's first borderless button has internal inline padding. Pull the
   breadcrumb surface left so its visible first letter aligns with page titles. */
.kap-page-shell__masthead > .kpi-page-menu { margin-inline-start: -.75rem; }
.kpi-page-menu::-webkit-scrollbar { display: none; }
.kpi-page-menu oj-toolbar {
  display: inline-flex;
  min-width: max-content;
  padding: 0;
  column-gap: .4rem;
}
.kpi-page-menu__item {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.kpi-page-menu__chevron { align-self: center; color: var(--oj-core-text-color-secondary, #625f5b); font-size: 1rem; padding: 0; }
.kpi-page-menu__item.is-current {
  color: var(--oj-core-text-color-primary, #161513);
  font-weight: 700;
}
.kpi-page-menu__separator {
  align-self: center;
  margin-inline: .25rem;
  color: var(--oj-core-text-color-secondary, #625f5b);
  font-size: .9rem;
  font-weight: 700;
}
.kpi-page-menu + .kpi-eyebrow { display: none; }
.kpi-page-loading__body {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: .85rem;
  justify-content: center;
  min-height: 16rem;
}

/* Page title = Accounts & Workloads baseline. */
.kpi-content :is(.consumption-page__header, .kap-users-header, .kpi-route-page, .my-customers-360-page__header, .accounts-workloads-header, .weekly-activities-page__header) :is(h1, h2),
.accounts-workloads-page h1,
.weekly-activities-page h1,
.profile-page h1 {
  margin-block: .2rem;
  font-size: clamp(1.4rem, 2vw, 1.65rem);
  line-height: 1.2;
  font-weight: 700;
}

/* Section and card headings: same semantic level, same type scale. */
.kpi-content :is(.consumption-section-heading, .attainment-section-heading) h2,
.kpi-content .accounts-pulse-v2__header h2,
.kpi-content .kpi-panel__header h2,
.kpi-content .kpi-section-header h2 {
  margin-block: 0;
  font-size: 1.1rem;
  line-height: 1.3;
  font-weight: 700;
}
.kpi-content article h3,
.kpi-content .kpi-card h3 {
  font-size: 1rem;
  line-height: 1.35;
  font-weight: 700;
}

.consumption-export-actions { display: flex; align-items: center; justify-content: flex-end; gap: .45rem; flex-wrap: wrap; }
.consumption-export-actions button {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  height: 2.6rem;
  min-height: 2.6rem;
  padding: .35rem .7rem;
  border: 1px solid #b8b2ac;
  border-radius: .35rem;
  background: #fff;
  color: #315f75;
  font: inherit;
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
}
.consumption-export-actions button:hover:not(:disabled) { background: #f1f6f8; border-color: #315f75; }
.consumption-export-actions button:disabled { opacity: .55; cursor: wait; }
.consumption-export-actions oj-progress-circle { width: 1rem; height: 1rem; }
.consumption-export-error { flex-basis: 100%; color: var(--oj-core-danger-3, #8b1d1d); font-size: .75rem; }
.consumption-insights-linked-trend h3 { font-size: 1rem; line-height: 1.35; font-weight: 700; }
.consumption-insights-qoq-cards .consumption-insights-status { justify-self: start; width: fit-content; padding: .18rem .45rem; border-radius: 999px; }

@media (max-width: 700px) {
  .consumption-export-actions { width: 100%; justify-content: flex-start; }
  .consumption-export-actions button { flex: 1 1 7rem; justify-content: center; }
}

/* Home Consumption Overview */
.home-consumption { display: grid; gap: 1rem; min-width: 0; }
.home-consumption__header { align-items: flex-start; }
.home-consumption__header p,
.home-consumption__card-heading p { margin: .25rem 0 0; color: var(--oj-core-text-color-secondary); font-size: .82rem; }
.home-consumption__fy { padding: .3rem .65rem; border-radius: 999px; background: var(--oj-palette-neutral-rgb-20, #f5f4f2); color: var(--oj-core-text-color-secondary); font-size: .78rem; font-weight: 700; white-space: nowrap; }
.home-consumption__header > div:last-child { display: flex; align-items: center; gap: .75rem; }
.home-consumption__pillar-filter { display: inline-flex; gap: .2rem; padding: .18rem; border: 1px solid var(--oj-core-divider-color); border-radius: 999px; background: var(--oj-core-bg-color-content); }
.home-consumption__pillar-filter button { min-width: 2.6rem; padding: .28rem .58rem; border: 0; border-radius: 999px; background: transparent; color: var(--oj-core-text-color-secondary); font: inherit; font-size: .72rem; font-weight: 750; cursor: pointer; }
.home-consumption__pillar-filter button.is-active { background: #312d2a; color: #fff; }
.home-consumption__state { display: flex; align-items: center; justify-content: center; gap: .65rem; min-height: 8rem; color: var(--oj-core-text-color-secondary); }
.home-consumption__state--error { justify-content: flex-start; min-height: 0; padding: .8rem 1rem; border-radius: .45rem; background: var(--oj-core-danger-1); color: var(--oj-core-danger-3); }
.home-consumption__coverage { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem 1.1rem; padding: .65rem .85rem; border: 1px solid var(--oj-core-divider-color); border-radius: .5rem; color: var(--oj-core-text-color-secondary); font-size: .78rem; }
.home-consumption__coverage span { display: inline-flex; align-items: center; gap: .35rem; }
.home-consumption__coverage strong { margin-inline-start: auto; color: #8b5f00; }
.home-consumption__mtd-guidance { margin: 0; padding: .65rem .85rem; border: 1px solid #d6a436; border-radius: .5rem; background: #fff8e5; color: #704d00; font-size: .78rem; }
.home-consumption__legend { width: .7rem; height: .7rem; border-radius: .2rem; }
.home-consumption__legend--actual { background: #287994; }
.home-consumption__legend--mtd { background: #c77700; }
.home-consumption__legend--forecast { background: #8b70b6; }
.home-consumption__metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .85rem; }
.home-consumption__metrics article { display: grid; gap: .35rem; min-width: 0; padding: 1rem; border: 1px solid var(--oj-core-divider-color); border-radius: var(--oj-core-border-radius-md); background: var(--oj-core-bg-color-content); }
.home-consumption__metrics span { color: var(--oj-core-text-color-secondary); font-size: .78rem; font-weight: 650; }
.home-consumption__metrics strong { font-size: clamp(1.35rem, 2.2vw, 1.85rem); line-height: 1.1; }
.home-consumption__metrics small { overflow: hidden; color: var(--oj-core-text-color-secondary); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.home-consumption__metrics .is-positive { color: #237a45; }
.home-consumption__metrics .is-negative { color: #a12626; }
.home-consumption__metrics .is-muted { color: var(--oj-core-text-color-secondary); }
.home-consumption__analysis-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(18rem, .85fr); gap: 1rem; min-width: 0; }
.home-consumption__chart-card,
.home-consumption__alerts { min-width: 0; padding: 1rem; border: 1px solid var(--oj-core-divider-color); border-radius: var(--oj-core-border-radius-md); background: var(--oj-core-bg-color-content); }
.home-consumption__card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-block-end: .85rem; }
.home-consumption__card-heading h3 { margin: 0; }
.home-consumption__quarter-list { display: grid; gap: .85rem; }
.home-consumption__quarter { display: grid; grid-template-columns: 4.5rem minmax(8rem, 1fr); gap: .35rem .75rem; align-items: center; }
.home-consumption__quarter-label { display: grid; }
.home-consumption__quarter-label span { color: var(--oj-core-text-color-secondary); font-size: .72rem; }
.home-consumption__stack { display: grid; gap: .15rem; }
.home-consumption__stack-row { display: block; height: .28rem; overflow: hidden; border-radius: 999px; background: #ece9e5; }
.home-consumption__stack-row i { display: block; height: 100%; border-radius: inherit; }
.home-consumption__stack-actual { background: #287994; }
.home-consumption__stack-mtd { background: #c77700; }
.home-consumption__stack-forecast { background: #8b70b6; }
.home-consumption__quarter-values { grid-column: 2; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .3rem .75rem; color: var(--oj-core-text-color-secondary); font-size: .7rem; }
.home-consumption__quarter-values span { display: inline-flex; align-items: baseline; gap: .25rem; white-space: nowrap; }
.home-consumption__quarter-values strong { color: var(--oj-core-text-color-primary); font-size: .84rem; font-weight: 800; line-height: 1.1; }
.home-consumption__alerts ul { display: grid; gap: .2rem; height: 18rem; margin: 0; padding: 0 .35rem 0 0; overflow-y: auto; scrollbar-gutter: stable; list-style: none; }
.home-consumption__alerts li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .65rem; padding: .7rem 0; border-block-start: 1px solid var(--oj-core-divider-color); }
.home-consumption__alerts li:first-child { border-block-start: 0; }
.home-consumption__alerts li > div { display: grid; min-width: 0; }
.home-consumption__alerts li span { overflow: hidden; color: var(--oj-core-text-color-secondary); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.home-consumption__grade { padding: .2rem .4rem; border-radius: 999px; font-size: .62rem !important; font-weight: 750; }
.home-consumption__grade--critical { background: #f9d8d8; color: #8b1d1d !important; }
.home-consumption__grade--high { background: #f9e3c4; color: #7d4700 !important; }
.home-consumption__grade--watch { background: #e6eef7; color: #315f75 !important; }
.home-consumption__alert-value { justify-items: end; }
.home-consumption__alert-status { margin-block-start: .2rem; padding: .18rem .45rem; border-radius: 999px; font-size: .64rem !important; font-weight: 750; line-height: 1.25; }
.home-consumption__alert-status--above-usual { background: #e1f2e8; color: #24623c !important; }
.home-consumption__alert-status--below-usual { background: #f9d8d8; color: #8b1d1d !important; }
.home-consumption__alert-status--new-usage { background: #e2edf8; color: #245a7a !important; }
.home-consumption__empty { padding: 1rem 0; color: var(--oj-core-text-color-secondary); font-size: .82rem; }
.home-consumption__monthly { overflow: hidden; }
.home-consumption__monthly-legend { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: .45rem .9rem; color: var(--oj-core-text-color-secondary); font-size: .72rem; }
.home-consumption__monthly-legend span { display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; }
.home-consumption__monthly-legend-line { display: inline-block; width: 1.7rem; border-block-start: 3px solid #287994; }
.home-consumption__monthly-legend-dot { display: inline-block; width: .55rem; height: .55rem; border: 2px solid #c77700; border-radius: 50%; background: #fff8e5; }
.home-consumption__monthly-legend-line--forecast { border-block-start-color: #8b70b6; border-block-start-style: dashed; }
.home-consumption__monthly-chart { min-height: 15rem; overflow-x: auto; }
.home-consumption__monthly-svg { display: block; width: 100%; min-width: 44rem; height: auto; overflow: visible; }
.home-consumption__monthly-grid { stroke: var(--oj-core-divider-color); stroke-width: 1; vector-effect: non-scaling-stroke; }
.home-consumption__monthly-line { fill: none; stroke-width: 3; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.home-consumption__monthly-line--actual { stroke: #287994; }
.home-consumption__monthly-line--mtd { stroke: #c77700; stroke-dasharray: 2 5; }
.home-consumption__monthly-line--forecast { stroke: #8b70b6; stroke-dasharray: 8 6; }
.home-consumption__monthly-dot { stroke-width: 2.5; vector-effect: non-scaling-stroke; }
.home-consumption__monthly-dot--actual { fill: #287994; stroke: #287994; }
.home-consumption__monthly-dot--mtd { fill: #fff8e5; stroke: #c77700; }
.home-consumption__monthly-dot--forecast { fill: var(--oj-core-bg-color-content); stroke: #8b70b6; }
.home-consumption__monthly-value,
.home-consumption__monthly-month { text-anchor: middle; }
.home-consumption__monthly-value { fill: var(--oj-core-text-color-primary); font-size: .68rem; font-weight: 700; paint-order: stroke; stroke: var(--oj-core-bg-color-content); stroke-width: 4px; stroke-linejoin: round; }
.home-consumption__monthly-month { fill: var(--oj-core-text-color-primary); font-size: .78rem; font-weight: 800; letter-spacing: .01em; }
.home-consumption__forecast-marker line { stroke: #8b70b6; stroke-width: 1.5; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.home-consumption__forecast-marker text { fill: #705595; font-size: .65rem; font-weight: 700; }
.home-consumption__monthly-table-accessible {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.home-consumption__footnote { margin: .55rem 0 0; color: #8b5f00; font-size: .72rem; }
@media (max-width: 1000px) {
  .home-consumption__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-consumption__analysis-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .home-consumption__header { gap: .5rem; }
  .home-consumption__fy { align-self: flex-start; }
  .home-consumption__coverage strong { flex-basis: 100%; margin-inline-start: 0; }
  .home-consumption__metrics { grid-template-columns: 1fr; }
  .home-consumption__quarter { grid-template-columns: 3.5rem minmax(8rem, 1fr); }
  .home-consumption__alerts li { grid-template-columns: auto minmax(0, 1fr); }
  .home-consumption__alert-value { grid-column: 2; justify-items: start; }
}

.kap-login-native-submit {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.kap-permission-dialog { --oj-dialog-width: min(42rem, calc(100vw - 2rem)); }
.kap-permission-dialog .kap-dialog-body {
  box-sizing: border-box;
  display: block;
  max-block-size: min(32rem, calc(100dvh - 13rem));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-block-end: 1rem;
}
.kap-permission-table-wrap { overflow: auto; }
.kap-permission-table { border-collapse: collapse; width: 100%; }
.kap-permission-table th, .kap-permission-table td { border-bottom: 1px solid var(--oj-core-divider-color); padding: .45rem .75rem; }
.kap-permission-table th { text-align: start; }
.kap-permission-table thead th:not(:first-child), .kap-permission-table td { text-align: center; }
.kap-permission-table input[type="checkbox"] { accent-color: var(--oj-core-brand-color-1); block-size: 1.15rem; inline-size: 1.15rem; }

/* Compact alignment requested for Home, KPI, Activities, and Accounts. */
.kap-header-wordmark {
  background: #fff;
  display: block;
  height: 2.15rem;
  max-height: 2.15rem;
  max-width: none;
  object-fit: contain;
  object-position: left center;
  width: auto;
}
.kap-header-picture { display: block; flex: 0 1 auto; min-width: 0; }

.home-consumption__quarter-list {
  min-height: 18rem;
  grid-template-rows: repeat(4, minmax(0, 1fr));
}
.home-consumption__alerts li > div > strong,
.home-consumption__alert-value > strong { font-size: .82rem; }
.home-consumption__alerts li span { font-size: .68rem; }

.kpi-spreadsheet-page__header h2,
.kpi-guide-dialog__header h2 { font-size: 1.25rem; line-height: 1.25; }
.kpi-activity-toolbar__left > button { font-size: .78rem; }
.kpi-activity-guide__heading h3 { font-size: .9rem; line-height: 1.3; }
.kpi-sheet-tabs button,
.kpi-sheet-table,
.kpi-sheet-cards,
.kpi-guide-list-item,
.kpi-guide-main { font-size: .78rem; }
.kpi-sheet-table th,
.kpi-sheet-table td { font-size: .78rem; }
.kpi-guide-details-heading h3 { font-size: .9rem; }
.kpi-activities-table,
.kpi-overview-portfolio__table-wrap table { font-size: .78rem; }
.kpi-activities-table td,
.kpi-activities-table th { font-size: .78rem; }

.weekly-activity-filters {
  grid-template-columns: 9rem 9rem minmax(12rem, 18rem) auto;
  justify-content: start;
}
.weekly-activity-filters__actions { align-self: end; }
.weekly-activity-filters__actions oj-button { height: 2.25rem; min-height: 2.25rem; }

.consumption-leading strong,
.consumption-end-user { font-size: .78rem; }

.accounts-workloads-toolbar { grid-template-columns: minmax(15rem, 28rem) auto auto auto 1fr; }
.accounts-workloads-search { width: 100%; }

@media (max-width: 1024px) {
  .accounts-workloads-toolbar { grid-template-columns: 1fr; }
  .weekly-activity-filters { grid-template-columns: 9rem 9rem minmax(12rem, 18rem) auto; }
  .weekly-activity-filters oj-input-text,
  .weekly-activity-filters__actions { grid-column: auto; }
}
@media (max-width: 760px) {
  .weekly-activity-filters { grid-template-columns: minmax(0, 1fr); }
  .weekly-activity-filters oj-input-text,
  .weekly-activity-filters__actions { grid-column: 1; }
  .weekly-activity-filters__actions { display: grid; grid-template-columns: 1fr 1fr; }
}

/* FY-independent account/workload/opportunity hierarchy. */
.accounts-hierarchy-page { height: auto; min-height: calc(100dvh - var(--accounts-workloads-viewport-offset)); overflow: visible; }
.accounts-hierarchy-page .accounts-workloads-header h1 { margin: .25rem 0; }
.accounts-hierarchy-page .accounts-workloads-header p { color: var(--kpi-muted); margin: 0; }
.accounts-workloads-banner { background: #f0f7f1; border: 1px solid #b8d7bd; border-radius: .25rem; margin-top: .75rem; padding: .65rem .8rem; }
.accounts-workloads-banner--error { background: #fff3f2; border-color: #e3aaa5; color: #8a251d; padding-right: 3rem; position: relative; }
.accounts-workloads-banner__dismiss { align-items: center; background: transparent; border: 0; color: inherit; cursor: pointer; display: inline-flex; font-size: 1.25rem; height: 2rem; justify-content: center; position: absolute; right: .5rem; top: .45rem; width: 2rem; }
.accounts-workloads-banner__dismiss:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.accounts-workloads-required-marker { color: var(--oj-core-danger-1, #b3261e); font-weight: 900; }
.accounts-workloads-grid { border: 1px solid var(--kpi-border); box-sizing: border-box; margin-top: 1rem; max-width: 100%; min-width: 0; overflow-x: auto; width: 100%; }
.accounts-workloads-grid table { border-collapse: collapse; table-layout: fixed; }
.accounts-workloads-grid__parent { min-width: 76rem; width: 100%; }
.accounts-workloads-grid th { background: #f2efec; border-bottom: 1px solid #c9c4be; color: var(--kpi-ink); font-size: .72rem; font-weight: 800; padding: .55rem .6rem; text-align: left; text-transform: uppercase; }
.accounts-workloads-grid td { border-bottom: 1px solid #e4e0db; padding: .45rem .55rem; vertical-align: top; }
.accounts-workloads-grid__parent > thead > tr > th:nth-child(1) { width: 18rem; }
.accounts-workloads-grid__parent > thead th:nth-child(2) { width: 25rem; }
.accounts-workloads-grid__parent > thead th:nth-child(3) { width: 14rem; }
.accounts-workloads-grid__parent > thead th:nth-child(4) { width: 11rem; }
.accounts-workloads-grid__parent > thead th:nth-child(5) { width: 18rem; }
.accounts-workloads-parent-row { background: #fff; cursor: pointer; }
.accounts-workloads-parent-row:hover, .accounts-workloads-parent-row.is-expanded { background: #faf9f7; }
.accounts-workloads-parent-row.is-draft, .accounts-workloads-opportunities tr.is-draft { background: #fff8e8; }
.accounts-workloads-account-cell { align-items: center; display: grid; gap: .35rem; grid-template-columns: auto minmax(0, 1fr) auto; }
.accounts-workloads-draft-badge { background: #f6df9b; border: 1px solid #d2ad46; border-radius: 1rem; color: #5c4511; font-size: .68rem; font-weight: 800; padding: .15rem .4rem; text-transform: uppercase; }
.accounts-workloads-grid input, .accounts-workloads-grid select, .accounts-workloads-grid textarea { background: #fff; border: 1px solid #c9c4be; border-radius: .2rem; box-sizing: border-box; color: var(--kpi-ink); font: inherit; min-height: 2rem; min-width: 0; padding: .3rem .4rem; width: 100%; }
.accounts-workloads-grid textarea { min-height: 3.1rem; resize: vertical; }
.accounts-workloads-grid button, .accounts-forecast-dialog button { background: #fff; border: 1px solid #9b9690; border-radius: .25rem; color: var(--kpi-ink); cursor: pointer; min-height: 2rem; padding: .3rem .55rem; white-space: nowrap; }
.accounts-workloads-grid button.is-danger { color: #9b2c23; }
.accounts-workloads-grid button:disabled, .accounts-forecast-dialog button:disabled { cursor: not-allowed; opacity: .5; }
.accounts-workloads-expander { float: left; margin-right: .4rem; min-width: 2rem; padding-inline: .35rem !important; }
.accounts-hierarchy__plans { align-items: center; display: flex; flex-wrap: wrap; gap: .3rem; min-height: 2rem; }
.accounts-hierarchy__plan { align-items: center; background: #f2f6f8; border: 1px solid #c9d8e1; border-radius: 1rem; display: inline-flex; gap: .2rem; padding: .15rem .25rem .15rem .55rem; }
.accounts-hierarchy__plan button { border: 0; min-height: 1.3rem; padding: 0 .25rem; }
.accounts-workloads-workload-cell, .accounts-workloads-notes-cell { display: grid; gap: .35rem; }
.accounts-workloads-workload-cell > div { display: flex; flex-wrap: wrap; gap: .3rem; }
.accounts-workloads-child-row > td { background: #f7f6f4; padding: .7rem 1rem 1rem 2.8rem; }
.accounts-workloads-opportunities { border: 1px solid #d7d2cc; max-width: calc(100vw - 6rem); overflow-x: auto; }
.accounts-workloads-opportunities__heading { align-items: center; background: #ebe8e4; display: flex; gap: .75rem; justify-content: space-between; padding: .45rem .6rem; position: sticky; left: 0; }
.accounts-workloads-opportunities table { background: #fff; min-width: 126rem; width: 100%; }
.accounts-workloads-opportunities th:nth-child(1) { width: 16rem; }
.accounts-workloads-opportunities th:nth-child(2) { width: 10rem; }
.accounts-workloads-opportunities th:nth-child(3) { width: 10rem; }
.accounts-workloads-opportunities th:nth-child(4) { width: 7rem; }
.accounts-workloads-opportunities th:nth-child(5) { width: 10rem; }
.accounts-workloads-opportunities th:nth-child(n+6):nth-child(-n+9) { width: 9rem; }
.accounts-workloads-opportunities th:nth-child(10) { width: 8rem; }
.accounts-workloads-opportunities th:nth-child(n+11) { width: 10rem; }
.accounts-workloads-oppty-name { align-items: center; display: flex; gap: .3rem; }
.accounts-workloads-oppty-name .is-danger { min-width: 2rem; padding-inline: .35rem; }
.accounts-workloads-empty { color: var(--kpi-muted); padding: 1rem !important; text-align: center; }
.accounts-workloads-dialog-backdrop { align-items: center; background: rgb(22 21 19 / 45%); display: flex; inset: 0; justify-content: center; padding: 1rem; position: fixed; z-index: 1000; }
.accounts-forecast-dialog { background: #fff; border-radius: .4rem; box-shadow: 0 1rem 3rem rgb(0 0 0 / 28%); display: grid; gap: .8rem; grid-template-rows: auto auto minmax(0, 1fr) auto; max-width: 58rem; overflow: hidden; height: min(44rem, calc(100dvh - 2rem)); padding: 1rem; width: 100%; }
.accounts-forecast-dialog header, .accounts-forecast-dialog footer { align-items: center; display: flex; gap: .75rem; justify-content: space-between; }
.accounts-forecast-dialog footer > div { display: flex; gap: .5rem; }
.accounts-forecast-dialog h2 { margin: 0; }
.accounts-forecast-dialog p { color: var(--kpi-muted); margin: .2rem 0 0; }
.accounts-forecast-toolbar { align-items: center; display: flex; flex-wrap: wrap; gap: .65rem; }
.accounts-forecast-search { flex: 1 1 22rem; margin: 0; min-width: min(22rem, 100%); }
.accounts-forecast-resync { align-items: center; display: inline-flex; gap: .35rem; }
.accounts-forecast-excluded-switch { align-items: center; color: var(--kpi-ink); cursor: pointer; display: inline-flex; font-size: .875rem; font-weight: 600; gap: .45rem; white-space: nowrap; }
.accounts-forecast-excluded-switch input { accent-color: var(--oj-core-text-color-primary, #312d2a); height: 1.05rem; width: 1.8rem; }
.accounts-forecast-row--excluded { background: #f5f4f2; color: var(--kpi-muted); }
.accounts-forecast-exclusion-action { border-color: #c8c2bb !important; color: #6f4b12 !important; }
.accounts-forecast-empty { color: var(--kpi-muted); padding: 1.25rem !important; text-align: center !important; }
.accounts-forecast-list { display: grid; gap: .5rem; overflow-x: auto; }
.accounts-forecast-table-scroll { border: 1px solid var(--kpi-border); overflow: auto; min-height: 0; position: relative; }
.accounts-forecast-candidates-table { border-collapse: collapse; min-width: 44rem; width: 100%; }
.accounts-forecast-candidates-table thead th { background: #fff; position: sticky; top: 0; z-index: 2; }
.accounts-forecast-candidates-table th, .accounts-forecast-candidates-table td { border-bottom: 1px solid var(--kpi-border); padding: .65rem; text-align: left; }
.accounts-forecast-candidates-table th:first-child, .accounts-forecast-candidates-table td:first-child { text-align: center; width: 4rem; }
.accounts-forecast-candidate input[type="checkbox"] { height: 1rem; width: 1rem; }
.accounts-forecast-candidate:hover { background: #faf9f7; }
.accounts-forecast-loading { align-items: center; background: rgb(255 255 255 / 88%); display: flex; gap: .65rem; inset: 2.75rem 0 0; justify-content: center; position: absolute; z-index: 3; }
.accounts-forecast-loading-spinner { animation: accounts-forecast-spin .75s linear infinite; border: 2px solid var(--kpi-border); border-radius: 50%; border-top-color: var(--oj-core-text-color-primary, #312d2a); height: 1.25rem; width: 1.25rem; }
@keyframes accounts-forecast-spin { to { transform: rotate(360deg); } }
@media (max-width: 640px) {
  .accounts-workloads-child-row > td { padding-left: .5rem; }
  .accounts-workloads-opportunities { max-width: calc(100vw - 2rem); }
  .accounts-forecast-dialog { height: calc(100dvh - 1rem); padding: .75rem; }
  .accounts-forecast-toolbar { align-items: stretch; }
  .accounts-forecast-search { flex-basis: 100%; min-width: 100%; }
  .accounts-forecast-resync, .accounts-forecast-excluded-switch { flex: 1 1 auto; justify-content: center; }
  .accounts-forecast-candidates-table { min-width: 38rem; }
}

/* Pure Accounts & Workloads table: restore the pre-opportunity inline-edit layout. */
.accounts-workloads-grid-wrap {
  max-width: 100%;
  overflow: auto;
}
.accounts-workloads-grid.accounts-workloads-grid--aw-only {
  border-collapse: collapse;
  display: table;
  margin-top: 0;
  min-width: 72rem;
  overflow: visible;
  table-layout: fixed;
  width: 100%;
}
.accounts-workloads-grid--aw-only th:nth-child(1) { width: 16rem; }
.accounts-workloads-grid--aw-only th:nth-child(2) { width: 16rem; }
.accounts-workloads-grid--aw-only th:nth-child(3) { width: 11rem; }
.accounts-workloads-grid--aw-only th:nth-child(4) { width: 15rem; }
.accounts-workloads-grid--aw-only th:nth-child(5) { width: 20rem; }
.accounts-workloads-grid--aw-only td:nth-child(4),
.accounts-workloads-grid--aw-only td:nth-child(5) {
  left: auto;
  position: static;
  z-index: auto;
}
.accounts-workloads-grid--aw-only td {
  cursor: default;
  white-space: pre-wrap;
  word-break: break-word;
}
.accounts-workloads-grid--aw-only td.is-editing-cell {
  background: #fffdf7;
  box-shadow: inset 0 0 0 2px rgba(199, 70, 52, 0.24);
}
.accounts-workloads-grid--aw-only td.is-unsaved-cell {
  background: var(--kap-grid-draft-bg);
  color: var(--kap-grid-draft-ink);
  position: relative;
}
.accounts-workloads-grid--aw-only tr.is-adding-row td { background: #f7fbff; }
.accounts-forecast-list > label {
  align-items: center;
  border-bottom: 1px solid var(--kpi-border);
  display: grid;
  gap: .75rem;
  grid-template-columns: auto 1fr;
  padding: .65rem;
}
.accounts-forecast-list > label span { display: grid; gap: .2rem; }
.accounts-forecast-list > label small { color: var(--kpi-muted); }

/* Compact AW hierarchy aligned with the Consumption Records title/toolbar/table rhythm. */
.accounts-hierarchy-page { gap: 10px; }
.accounts-workloads-page.accounts-hierarchy-page {
  height: calc(100dvh - var(--accounts-workloads-viewport-offset));
  min-height: 0;
  overflow: hidden;
}
.accounts-hierarchy-page .accounts-workloads-header { display: block; margin: 0; padding-bottom: 0; }
.accounts-hierarchy-page .accounts-workloads-header h1 { margin: 2px 0 0; }
.accounts-workloads-header-topline {
  align-items: flex-start;
  display: flex;
  gap: .75rem;
  justify-content: space-between;
  min-width: 0;
  width: 100%;
}
.accounts-workloads-header-navigation { flex: 1 1 auto; min-width: 0; overflow: hidden; }
.accounts-workloads-header-navigation .kpi-page-menu {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  width: 100%;
}
.accounts-workloads-header-actions {
  align-items: center;
  align-self: flex-start;
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: .75rem;
  width: auto;
}

.accounts-workloads-fx-rate { align-items: flex-end; display: flex; flex-wrap: wrap; gap: 6px; }
.accounts-workloads-fx-rate label { color: var(--oj-core-text-color-secondary); font-size: .75rem; font-weight: 700; }
.accounts-workloads-fx-rate input { box-sizing: border-box; min-height: 34px; padding: 5px 8px; width: 112px; }
.accounts-workloads-fx-error { color: var(--oj-core-danger-1, #b3261e); font-size: .72rem; max-width: 210px; }
.accounts-workloads-toolbar--compact { align-items: flex-end; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; min-height: 0; padding: 10px 12px; }
.accounts-workloads-toolbar--compact .accounts-workloads-search { flex: 1 1 320px; max-width: 560px; }
.accounts-workloads-toolbar--compact .accounts-workloads-search input { width: 100%; }
.accounts-workloads-grid-wrap--compact { margin-top: 0; max-width: 100%; overflow-x: auto; }
.accounts-workloads-grid.accounts-workloads-aw-grid { border-collapse: collapse; display: table; margin-top: 0; min-width: 1280px; table-layout: fixed; width: 100%; }
.accounts-workloads-aw-grid th,.accounts-workloads-aw-grid td { vertical-align: middle; }
.accounts-workloads-aw-grid th button { background: transparent; border: 0; color: inherit; cursor: pointer; font: inherit; font-weight: 700; min-height: 0; padding: 0; white-space: nowrap; }
.accounts-workloads-aw-grid .accounts-workloads-select-col { width: 38px; }
.accounts-workloads-aw-grid .accounts-workloads-expand-col { width: 42px; }
.accounts-workloads-aw-grid .accounts-workloads-highlight-col { width: 42px; }
.accounts-workloads-aw-grid .is-account { width: 150px; }
.accounts-workloads-aw-grid .is-workload { width: 145px; }
.accounts-workloads-aw-grid .is-plan { width: 118px; }
.accounts-workloads-aw-grid .is-arrUsd,.accounts-workloads-aw-grid .is-acrUsd { width: 100px; }
.accounts-workloads-aw-grid .is-opptyCount { width: 96px; }
.accounts-workloads-aw-grid .is-lastUpdated { width: 215px; }
.accounts-workloads-aw-grid .is-notes { width: 235px; }
.accounts-workloads-parent-row.is-selected > td { box-shadow: inset 0 0 0 1px var(--oj-core-focus-border-color, #0572ce); }
.accounts-workloads-parent-row.is-highlighted > td { background: #fff6d9; }
.accounts-workloads-parent-row.is-pending-delete > td { background: #fff1ed; }
.accounts-workloads-pending-delete {
  background: #fbe3dc;
  border: 1px solid #d87a64;
  border-radius: 999px;
  color: #8c2f20;
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 800;
  margin-left: 0.35rem;
  padding: 0.12rem 0.38rem;
  white-space: nowrap;
}

.accounts-workloads-highlight,.accounts-workloads-expander { background: transparent !important; border: 0 !important; color: var(--oj-core-text-color-primary); cursor: pointer; min-height: 0 !important; padding: 0 !important; }
.accounts-workloads-highlight { color: #a65d00; font-size: 1.15rem; }
.accounts-workloads-number-cell { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.accounts-workloads-ellipsis { display: block; min-width: 0; position: relative; }
.accounts-workloads-ellipsis > span:first-child { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.accounts-workloads-latest-tooltip { background: var(--oj-core-bg-color-content, white); border: 1px solid var(--oj-core-divider-color, #d6d9de); border-radius: 4px; box-shadow: 0 4px 14px rgba(0,0,0,.16); color: var(--oj-core-text-color-primary, #161513); font-size: .78rem; line-height: 1.35; max-height: min(40vh, 320px); max-width: 360px; overflow: auto; overflow-wrap: anywhere; padding: 6px 9px; pointer-events: none; position: fixed; white-space: pre-wrap; width: max-content; z-index: 10000; }
.accounts-workloads-aw-grid td.is-editing-cell { background: #fffdf7; box-shadow: inset 0 0 0 2px rgba(199,70,52,.24); }
.accounts-workloads-aw-grid td.is-unsaved-cell { background: var(--kap-grid-draft-bg); color: var(--kap-grid-draft-ink); position: relative; }
.accounts-workloads-child-row > td { background: #f5f6f7; padding: 14px 14px 14px 62px; }
.accounts-workloads-opportunities { background: #fff; border: 1px solid #d6d9de; border-left: 4px solid #312d2a; border-radius: 6px; max-width: 100%; overflow: hidden; }
.accounts-workloads-opportunities__heading { align-items: center; background: #f5f6f7; border-bottom: 1px solid #d6d9de; display: flex; justify-content: space-between; left: auto; padding: 9px 12px; position: static; }
.accounts-workloads-opportunities__heading div { align-items: baseline; display: flex; gap: 8px; }
.accounts-workloads-opportunities__heading span { color: var(--oj-core-text-color-secondary); font-size: .76rem; }
.accounts-workloads-oppty-scroll { max-width: 100%; overflow-x: auto; position: relative; }
.accounts-workloads-opportunities table.accounts-workloads-oppty-grid { border-collapse: separate; border-spacing: 0; min-width: 1900px; table-layout: fixed; }
.accounts-workloads-oppty-grid th,.accounts-workloads-oppty-grid td { background: #fff; border-bottom: 1px solid #e3e5e8; box-sizing: border-box; min-width: 118px; padding: 7px 8px; width: 118px; }
.accounts-workloads-oppty-grid th:nth-child(1),.accounts-workloads-oppty-grid td:nth-child(1) { left: 0; min-width: 190px; position: sticky; width: 190px; z-index: 5; }
.accounts-workloads-oppty-grid th:nth-child(2),.accounts-workloads-oppty-grid td:nth-child(2) { box-shadow: 4px 0 5px rgba(0,0,0,.08); left: 190px; min-width: 130px; position: sticky; width: 130px; z-index: 5; }
.accounts-workloads-oppty-grid thead th:nth-child(-n+2) { z-index: 7; }
.accounts-workloads-oppty-grid tr.is-draft td { background: #fff9e8; }
.accounts-workloads-oppty-grid input,.accounts-workloads-oppty-grid select,.accounts-workloads-oppty-grid textarea { box-sizing: border-box; width: 100%; }
.accounts-workloads-oppty-actions { white-space: nowrap; }
.accounts-workloads-oppty-actions button + button { margin-left: 5px; }
.accounts-workloads-child-guidance { color: var(--oj-core-text-color-secondary); margin: 0; padding: 14px; }

/* Accounts & Workloads regression restoration. */
.accounts-workloads-toolbar .accounts-workloads-search { flex: 1 1 20rem; margin-right: auto; max-width: 34rem; }
.accounts-workloads-toolbar > button { flex: 0 0 auto; }
.accounts-workloads-table-scroll,.accounts-workloads-oppty-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.accounts-workloads-table > tbody > tr > td { padding-block: .42rem; }
.accounts-workloads-parent-row.is-pending-delete > td,.accounts-workloads-parent-row.is-pending-delete > td * { opacity: .68; text-decoration: line-through; }
.accounts-workloads-parent-row.is-pending-delete > td:first-child,.accounts-workloads-parent-row.is-pending-delete > td:first-child * { opacity: 1; text-decoration: none; }
.accounts-workloads-oppty-grid tr.is-draft-delete td,.accounts-workloads-oppty-grid tr.is-draft-delete td * { text-decoration: line-through; }
.accounts-workloads-editor,.accounts-workloads-oppty-grid input,.accounts-workloads-oppty-grid select,.accounts-workloads-oppty-grid oj-input-date { box-sizing: border-box; min-width: 0; width: 100%; }
.accounts-workloads-permanent-delete-dialog { max-width: 38rem; }
.accounts-workloads-permanent-delete-dialog ul { max-height: 14rem; overflow: auto; padding-inline-start: 1.25rem; }
.accounts-workloads-aw-grid th,.accounts-workloads-aw-grid td { box-sizing: border-box; }
.accounts-workloads-aw-grid th:nth-child(1),.accounts-workloads-aw-grid td:nth-child(1) { left: 0; position: sticky; z-index: 21; }
.accounts-workloads-aw-grid th:nth-child(2),.accounts-workloads-aw-grid td:nth-child(2) { left: 38px; position: sticky; z-index: 21; }
.accounts-workloads-aw-grid th:nth-child(3),.accounts-workloads-aw-grid td:nth-child(3) { left: 80px; position: sticky; z-index: 21; }
.accounts-workloads-aw-grid th:nth-child(4),.accounts-workloads-aw-grid td:nth-child(4) { left: 122px; min-width: 190px; position: sticky; width: 190px; z-index: 21; }
.accounts-workloads-aw-grid th:nth-child(5),.accounts-workloads-aw-grid td:nth-child(5) { box-shadow: 4px 0 5px rgba(0,0,0,.08); left: 312px; min-width: 190px; position: sticky; width: 190px; z-index: 21; }
.accounts-workloads-aw-grid tbody td:nth-child(-n+5) { background: inherit; z-index: 8; }

/* Accounts & Workloads interaction refinements */
.accounts-workloads-toolbar--compact {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 10px;
  box-sizing: border-box;
  max-width: 100%;
  overflow: hidden;
}
.accounts-workloads-toolbar--compact .accounts-workloads-search {
  flex: 0 1 210px;
  width: 210px;
  min-width: 160px;
}
.accounts-workloads-toolbar--compact .accounts-workloads-search input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.accounts-workloads-table-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0;
  color: var(--oj-core-text-color-secondary);
  font-size: 0.82rem;
}
.accounts-workloads-table-summary > div { display: flex; gap: 8px; }
.accounts-workloads-parent-row.is-highlighted > td { background: inherit; }
.accounts-workloads-highlight[aria-pressed="true"] { color: #b56200; }
.accounts-workloads-parent-row.is-selected > td {
  background: #e8f2fb;
  box-shadow: none;
}
.accounts-workloads-parent-row.is-selected.is-pending-delete > td { background: #fff1ed; }
.accounts-workloads-oppty-scroll {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.accounts-workloads-oppty-scroll::-webkit-scrollbar { display: none; }
.accounts-workloads-oppty-grid .is-oppty-sticky-name {
  left: 0;
  width: 220px;
  min-width: 220px;
  max-width: 220px;
  z-index: 4;
  background: var(--oj-core-bg-color-content, #fff);
}
.accounts-workloads-oppty-grid .is-oppty-sticky-id {
  left: 220px;
  width: 140px;
  min-width: 140px;
  max-width: 140px;
  z-index: 4;
  background: var(--oj-core-bg-color-content, #fff);
  box-shadow: 8px 0 10px -10px rgba(22,43,66,.85);
}
.accounts-workloads-oppty-grid tr.is-selected > td,
.accounts-workloads-oppty-grid tr.is-selected > .is-oppty-sticky { background: #e8f2fb; }

/* Four sticky parent columns after removing the empty status column. */
.accounts-workloads-aw-grid th:nth-child(1),.accounts-workloads-aw-grid td:nth-child(1) { left: 0; }
.accounts-workloads-aw-grid th:nth-child(2),.accounts-workloads-aw-grid td:nth-child(2) { left: 38px; }
.accounts-workloads-aw-grid th:nth-child(3),.accounts-workloads-aw-grid td:nth-child(3) { left: 80px; min-width: 190px; width: 190px; }
.accounts-workloads-aw-grid th:nth-child(4),.accounts-workloads-aw-grid td:nth-child(4) { left: 270px; min-width: 190px; width: 190px; box-shadow: 4px 0 5px rgba(0,0,0,.08); }
.accounts-workloads-aw-grid th:nth-child(5),.accounts-workloads-aw-grid td:nth-child(5) { position: static; left: auto; width: auto; min-width: 9rem; box-shadow: none; }
.accounts-workloads-aw-grid tbody td:nth-child(-n+4) { background: inherit; z-index: 8; }

@media (max-width: 840px) {
  .accounts-workloads-toolbar--compact { align-items: stretch; }
  .accounts-workloads-toolbar--compact .accounts-workloads-search { flex-basis: 100%; width: 100%; }
  .accounts-workloads-toolbar--compact .consumption-range-apply { width: auto; }
}

.accounts-workloads-parent-row.is-selected,
.accounts-workloads-parent-row.is-selected > td,
.accounts-workloads-parent-row.is-selected > td:nth-child(-n+4) { background: #e8f2fb; }
.accounts-workloads-parent-row.is-selected.is-pending-delete,
.accounts-workloads-parent-row.is-selected.is-pending-delete > td,
.accounts-workloads-parent-row.is-selected.is-pending-delete > td:nth-child(-n+4) { background: #fff1ed; }

/* Accounts & Workloads additional interaction and layout refinements. */
.accounts-workloads-header-actions { display: none; }
.accounts-workloads-toolbar-spacer { flex: 1 1 auto; }
.accounts-workloads-toolbar--compact { overflow: visible; }
.accounts-workloads-toolbar--compact .accounts-workloads-search { margin-right: 0; }
.accounts-workloads-toolbar--compact .consumption-range-apply {
  align-self: flex-end;
  min-width: 2.35rem;
  padding-inline: .55rem;
}
.accounts-workloads-toolbar--compact .accounts-workloads-button,
.accounts-workloads-toolbar--compact oj-button { font-size: .78rem; }
.accounts-workloads-include-deleted input[type="checkbox"] { block-size: 1rem; inline-size: 1rem; }
.accounts-workloads-expand-all { min-width: 1.75rem !important; }
.accounts-workloads-parent-row.is-highlighted:not(.is-selected) > td { background: #fff4bf; }
.accounts-workloads-parent-row.is-highlighted:hover:not(.is-selected) > td { background: #fff4bf; }
.accounts-workloads-parent-row.is-selected:hover > td,
.accounts-workloads-oppty-grid tr.is-selected:hover > td { background: #e8f2fb; }
.accounts-workloads-parent-row.is-pending-delete > td,
.accounts-workloads-parent-row.is-pending-delete > td:nth-child(-n+4) { background: #fff1ed; }
.accounts-workloads-oppty-grid tr.is-draft-delete > td,
.accounts-workloads-oppty-grid tr.is-draft-delete > td:nth-child(-n+2),
.accounts-workloads-oppty-grid tr.is-draft-delete.is-selected > td,
.accounts-workloads-oppty-grid tr.is-draft-delete.is-selected > td:nth-child(-n+2) { background: #fff1ed; }
.accounts-workloads-aw-grid .is-plan { min-width: 9.5rem; width: 9.5rem; }
.accounts-workloads-aw-grid thead th { top: 0; z-index: 22; }
.accounts-workloads-opportunities { border-left-color: #c74634; }
.accounts-workloads-opportunities__heading { background: #fff1ef; color: #8f2d21; }
.accounts-workloads-oppty-grid th:nth-child(1),
.accounts-workloads-oppty-grid td:nth-child(1),
.accounts-workloads-oppty-grid .is-oppty-sticky-name { min-width: 220px; width: 220px; }
.accounts-workloads-oppty-grid th:nth-child(2),
.accounts-workloads-oppty-grid td:nth-child(2),
.accounts-workloads-oppty-grid .is-oppty-sticky-id { left: 220px; min-width: 140px; width: 140px; }
.accounts-workloads-oppty-grid th:nth-child(n+3),
.accounts-workloads-oppty-grid td:nth-child(n+3) { left: auto; position: static; z-index: auto; }
.accounts-workloads-oppty-grid th:nth-child(-n+2),
.accounts-workloads-oppty-grid td:nth-child(-n+2) {
  background-clip: padding-box;
  position: sticky;
}
.accounts-workloads-oppty-grid thead th:nth-child(-n+2) { z-index: 12; }
.accounts-workloads-oppty-grid tbody td:nth-child(-n+2) { z-index: 8; }
.accounts-workloads-oppty-grid tr.is-selected > td,
.accounts-workloads-oppty-grid tr.is-selected > td:nth-child(-n+2) { background: #fdeceb; }
.kap-header-wordmark { width: auto; }

/* Additional revision 4: one authoritative cascade for the AW workspace. */
.accounts-workloads-header-actions { display: flex; align-self: flex-start; }
.accounts-workloads-recommendations-label--desktop { display: inline; }
.accounts-workloads-recommendations-label--mobile { display: none; }
.accounts-workloads-toolbar--compact {
  display: flex; align-items: flex-end; flex-wrap: wrap; gap: 0;
}
.accounts-workloads-toolbar--compact .accounts-workloads-search {
  flex: 0 1 31rem; width: min(31rem, 58vw); min-width: 20rem;
}
.accounts-workloads-toolbar--compact .accounts-workloads-search input {
  border-radius: .35rem 0 0 .35rem; border-right: 0;
}
.accounts-workloads-toolbar--compact .consumption-range-apply {
  align-self: flex-end; margin: 0 .8rem 0 0; height: 2.25rem;
  border-radius: 0 .35rem .35rem 0; border-color: #8091a5;
  background: #52677f; color: #fff;
}
.accounts-workloads-toolbar--compact .consumption-range-apply:hover { background: #40556d; }
.accounts-workloads-page #accountsWorkloadsTitle { font-size: clamp(1.7rem, 2.2vw, 2.25rem); }

.accounts-workloads-parent-row.is-highlighted:not(.is-selected) > td,
.accounts-workloads-parent-row.is-highlighted:hover:not(.is-selected) > td { background: #fff; }
.accounts-workloads-highlight.is-active,
.accounts-workloads-highlight[aria-pressed="true"] { color: #e1a900; }
.accounts-workloads-aw-grid th:nth-child(4), .accounts-workloads-aw-grid td:nth-child(4) {
  min-width: 270px; width: 270px;
}
.accounts-workloads-aw-grid th:nth-child(5), .accounts-workloads-aw-grid td:nth-child(5),
.accounts-workloads-aw-grid .is-plan {
  left: 540px; min-width: 9.5rem; width: 9.5rem; max-width: 9.5rem;
  position: sticky; z-index: 21; box-shadow: 4px 0 5px rgba(0,0,0,.08);
}
.accounts-workloads-aw-grid th:nth-child(9), .accounts-workloads-aw-grid td:nth-child(9),
.accounts-workloads-aw-grid th:nth-child(10), .accounts-workloads-aw-grid td:nth-child(10) {
  min-width: 240px; width: 240px; max-width: 240px;
}
.accounts-workloads-cell-display, .accounts-workloads-ellipsis {
  display: block; min-width: 0; max-width: 100%; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
}
.accounts-workloads-table-wrap { position: relative; overflow: auto; isolation: isolate; }
.accounts-workloads-aw-grid thead { position: sticky; top: 0; z-index: 30; }
.accounts-workloads-aw-grid thead th { background: #f4f6f8; }
.accounts-workloads-parent-row.is-pending-delete > td,
.accounts-workloads-parent-row.is-pending-delete:hover > td,
.accounts-workloads-parent-row.is-pending-delete > td:nth-child(-n+4),
.accounts-workloads-parent-row.is-pending-delete:hover > td:nth-child(-n+4) { background: #fff1ed; }
.accounts-workloads-parent-row.is-pending-delete.is-selected > td,
.accounts-workloads-parent-row.is-pending-delete.is-selected > td:nth-child(-n+4) { background: #fbd5ce; }

.accounts-workloads-oppty-grid { table-layout: fixed; }
.accounts-workloads-oppty-grid th:nth-child(-n+2),
.accounts-workloads-oppty-grid td:nth-child(-n+2) { background: #fff; background-clip: border-box; }
.accounts-workloads-oppty-grid tbody tr:not(.is-selected):not(.is-draft-delete) > td { background: #fff; }
.accounts-workloads-oppty-grid tr.is-selected > td,
.accounts-workloads-oppty-grid tr.is-selected:hover > td,
.accounts-workloads-oppty-grid tr.is-selected > td:nth-child(-n+2) { background: #fde0dd; }
.accounts-workloads-oppty-grid tr.is-draft-delete > td,
.accounts-workloads-oppty-grid tr.is-draft-delete:hover > td,
.accounts-workloads-oppty-grid tr.is-draft-delete > td:nth-child(-n+2) { background: #fff1ed; }
.accounts-workloads-oppty-grid th:nth-child(5), .accounts-workloads-oppty-grid td:nth-child(5) { min-width: 148px; width: 148px; }
.accounts-workloads-oppty-grid th:nth-child(6), .accounts-workloads-oppty-grid td:nth-child(6) { min-width: 120px; width: 120px; }

/* Additional revision 5: mirror the Consumption toolbar and remove AW-only horizontal scrolling. */
.accounts-workloads-toolbar--compact {
  align-items: center;
  flex-wrap: nowrap;
  gap: .5rem;
  padding: .75rem 1rem;
  min-height: 3.75rem;
  box-sizing: border-box;
}
.accounts-workloads-toolbar--compact .accounts-workloads-search {
  flex: 0 1 17rem;
  width: min(17rem, 32vw);
  min-width: 13rem;
  align-self: center;
}
.accounts-workloads-toolbar--compact .accounts-workloads-add-aw {
  flex: 0 0 auto;
  margin-left: 0;
}
.accounts-workloads-grid-wrap.accounts-workloads-grid-wrap--compact {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scroll-padding-bottom: 1rem;
  max-width: 100%;
}
.accounts-workloads-grid.accounts-workloads-aw-grid {
  table-layout: fixed;
  width: 100%;
  min-width: 0;
}
.accounts-workloads-grid.accounts-workloads-aw-grid th,
.accounts-workloads-grid.accounts-workloads-aw-grid td {
  min-width: 0;
  max-width: none;
}
.accounts-workloads-aw-grid > thead > tr > th,
.accounts-workloads-aw-grid > tbody > tr.accounts-workloads-parent-row > td,
.accounts-workloads-aw-grid > thead > tr > th:nth-child(-n + 5),
.accounts-workloads-aw-grid > tbody > tr.accounts-workloads-parent-row > td:nth-child(-n + 5),
.accounts-workloads-aw-grid > :is(thead, tbody) > tr > .is-plan {
  position: static;
  left: auto;
  z-index: auto;
  box-shadow: none;
}
.accounts-workloads-aw-grid th:nth-child(5),
.accounts-workloads-aw-grid td:nth-child(5),
.accounts-workloads-aw-grid .is-plan {
  position: static;
  left: auto;
  min-width: 0;
  max-width: none;
  box-shadow: none;
}
.accounts-workloads-aw-grid th:nth-child(1), .accounts-workloads-aw-grid td:nth-child(1) { width: 3%; }
.accounts-workloads-aw-grid th:nth-child(2), .accounts-workloads-aw-grid td:nth-child(2) { width: 3%; }
.accounts-workloads-aw-grid th:nth-child(3), .accounts-workloads-aw-grid td:nth-child(3) { width: 11%; }
.accounts-workloads-aw-grid th:nth-child(4), .accounts-workloads-aw-grid td:nth-child(4) { width: 16%; }
.accounts-workloads-aw-grid th:nth-child(5), .accounts-workloads-aw-grid td:nth-child(5) { width: 10%; }
.accounts-workloads-aw-grid th:nth-child(6), .accounts-workloads-aw-grid td:nth-child(6) { width: 9%; }
.accounts-workloads-aw-grid th:nth-child(7), .accounts-workloads-aw-grid td:nth-child(7),
.accounts-workloads-aw-grid th:nth-child(8), .accounts-workloads-aw-grid td:nth-child(8) { width: 8%; }
.accounts-workloads-aw-grid th:nth-child(9), .accounts-workloads-aw-grid td:nth-child(9) { width: 7%; }
.accounts-workloads-aw-grid th:nth-child(10), .accounts-workloads-aw-grid td:nth-child(10),
.accounts-workloads-aw-grid th:nth-child(11), .accounts-workloads-aw-grid td:nth-child(11) { width: 12.5%; min-width: 0; max-width: none; }
.accounts-workloads-parent-row.is-pending-delete > td:nth-child(5),
.accounts-workloads-parent-row.is-pending-delete:hover > td:nth-child(5) { background: #fff1ed; }
.accounts-workloads-parent-row.is-pending-delete.is-selected > td:nth-child(5) { background: #fbd5ce; }
.accounts-workloads-aw-grid th:nth-child(n+3),
.accounts-workloads-aw-grid td:nth-child(n+3),
.accounts-workloads-oppty-grid th,
.accounts-workloads-oppty-grid td { text-align: left; }
.accounts-workloads-aw-grid th:nth-child(7), .accounts-workloads-aw-grid td:nth-child(7),
.accounts-workloads-aw-grid th:nth-child(8), .accounts-workloads-aw-grid td:nth-child(8),
.accounts-workloads-aw-grid th:nth-child(9), .accounts-workloads-aw-grid td:nth-child(9),
.accounts-workloads-oppty-grid th:nth-child(4), .accounts-workloads-oppty-grid td:nth-child(4),
.accounts-workloads-oppty-grid th:nth-child(6), .accounts-workloads-oppty-grid td:nth-child(6),
.accounts-workloads-oppty-grid th:nth-child(7), .accounts-workloads-oppty-grid td:nth-child(7),
.accounts-workloads-oppty-grid th:nth-child(8), .accounts-workloads-oppty-grid td:nth-child(8),
.accounts-workloads-oppty-grid th:nth-child(9), .accounts-workloads-oppty-grid td:nth-child(9) { text-align: right; }
.accounts-workloads-oppty-grid th:nth-child(5),
.accounts-workloads-oppty-grid td:nth-child(5) {
  position: static;
  left: auto;
  z-index: auto;
  box-shadow: none;
}

/* Runtime layout contract: dedicated AW toolbar and deterministic opportunity columns. */
.accounts-workloads-include-deleted {
  align-self: center;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 0.42rem;
  line-height: 1rem;
  margin: 0 0 0 .15rem;
  white-space: nowrap;
}
.accounts-workloads-include-deleted input { margin: 0; }
.accounts-workloads-add-aw {
  background: var(--kpi-brand);
  border: 1px solid var(--kpi-brand);
  border-radius: .25rem;
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: .78rem;
  font-weight: 850;
  min-height: 2.25rem;
  padding: .45rem .78rem;
}
.accounts-workloads-add-aw:disabled { cursor: not-allowed; opacity: .5; }
.accounts-workloads-oppty-grid {
  table-layout: fixed;
  width: 2575px;
  min-width: 2575px;
}
.accounts-workloads-oppty-column--name { width: 260px; }
.accounts-workloads-oppty-column--id { width: 165px; }
.accounts-workloads-oppty-column--revenue { width: 170px; }
.accounts-workloads-oppty-column--probability { width: 150px; }
.accounts-workloads-oppty-column--target { width: 160px; }
.accounts-workloads-oppty-column--arr-usd,
.accounts-workloads-oppty-column--arr-krw,
.accounts-workloads-oppty-column--acr-usd,
.accounts-workloads-oppty-column--acr-krw { width: 155px; }
.accounts-workloads-oppty-column--status { width: 150px; }
.accounts-workloads-oppty-column--date { width: 180px; }
.accounts-workloads-oppty-column--update { width: 360px; }
.accounts-workloads-oppty-grid th:nth-child(1),
.accounts-workloads-oppty-grid td:nth-child(1) {
  left: 0;
  width: 260px;
  min-width: 260px;
  max-width: 260px;
  overflow: hidden;
  position: sticky;
  z-index: 12;
}
.accounts-workloads-oppty-grid th:nth-child(2),
.accounts-workloads-oppty-grid td:nth-child(2) {
  left: 260px;
  width: 165px;
  min-width: 165px;
  max-width: 165px;
  overflow: hidden;
  position: sticky;
  z-index: 12;
}
.accounts-workloads-oppty-grid th:nth-child(n + 3) {
  position: static;
  left: auto;
}
.accounts-workloads-oppty-grid td:nth-child(n + 3) {
  left: auto;
  position: relative;
}
.accounts-workloads-aw-grid .accounts-workloads-oppty-grid td:nth-child(n + 3) {
  z-index: auto;
}
.accounts-workloads-cell-content {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}
.accounts-workloads-aw-grid > tbody > tr.accounts-workloads-parent-row > td.is-unsaved-cell {
  position: relative;
}
.accounts-workloads-aw-grid td.is-unsaved-cell::after,
.accounts-workloads-oppty-grid td.is-unsaved-cell::after {
  background: var(--kap-grid-draft-line);
  bottom: 0;
  content: "";
  height: 3px;
  left: .35rem;
  position: absolute;
  right: .35rem;
  z-index: 2;
}
.accounts-workloads-oppty-grid thead th:nth-child(-n + 2) {
  background: #f4f6f8;
}
.accounts-workloads-table-summary .accounts-workloads-fx {
  width: auto;
}
.accounts-workloads-table-summary .accounts-workloads-fx__button {
  align-items: center;
  display: inline-flex;
  gap: .55rem;
  min-height: 2.1rem;
  min-width: 0;
  padding: .35rem .6rem;
  width: auto;
}
.accounts-workloads-table-summary .accounts-workloads-fx__button span {
  font-size: .65rem;
}
.accounts-workloads-table-summary .accounts-workloads-fx__button strong {
  font-size: .8rem;
  white-space: nowrap;
}
@media (max-width: 1024px) {
  .accounts-workloads-table-summary .accounts-workloads-fx,
  .accounts-workloads-table-summary .accounts-workloads-fx__button { width: auto; }
  .accounts-workloads-table-summary .accounts-workloads-fx-popover { left: auto; right: 0; }
  .accounts-workloads-recommendations-label--desktop { display: none; }
  .accounts-workloads-recommendations-label--mobile { display: inline; }
}

/* Keep the Accounts & Workloads table heading aligned with Consumption Records. */
.accounts-workloads-table-summary {
  margin: .5rem 0 .25rem;
}
.accounts-workloads-table-summary .consumption-table-title {
  color: var(--kpi-ink);
  margin: 0;
}
.accounts-workloads-toolbar--compact { margin-bottom: 0; }
.accounts-workloads-table-summary__meta {
  align-items: center;
  display: flex;
  gap: .5rem;
  margin-inline-start: auto;
  min-width: 0;
}
.accounts-workloads-table-summary .accounts-workloads-fx__button {
  min-height: 1.8rem;
  padding: .2rem .45rem;
}
.consumption-record-search {
  position: relative;
}
.consumption-record-search input {
  box-sizing: border-box;
  padding-inline-end: 2.5rem;
}
.consumption-record-search__submit {
  align-items: center;
  background: transparent;
  border: 0;
  color: var(--kpi-brand);
  cursor: pointer;
  display: inline-flex;
  height: 2.25rem;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: .2rem;
  top: calc(100% - 1.125rem);
  transform: translateY(-50%);
  width: 2.1rem;
}
.consumption-record-search__submit:focus-visible {
  outline: 2px solid var(--oj-core-focus-border-color, #0572ce);
  outline-offset: 1px;
}
.consumption-record-search__submit:disabled {
  color: var(--kpi-muted);
  cursor: not-allowed;
}
.consumption-record-search__submit oj-progress-circle { block-size: 1rem; inline-size: 1rem; }
@media (max-width: 720px) {
  .accounts-workloads-page .accounts-workloads-header {
    text-align: left;
  }
  .kpi-shell:has(.accounts-workloads-page) .kpi-page-menu {
    min-width: 0;
    text-align: left;
    width: 100%;
  }
  .kpi-shell:has(.accounts-workloads-page) .kpi-page-menu oj-toolbar {
    justify-content: flex-start;
    min-width: 0;
  }
  .accounts-workloads-table-summary {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .accounts-workloads-table-summary__meta { margin-inline-start: 0; }
}
.accounts-workloads-toast {
  background: #f0f7f1;
  border: 1px solid #8fbd98;
  border-radius: .3rem;
  bottom: calc(var(--kpi-footer-reserved-height) + 1rem);
  box-shadow: 0 8px 24px rgba(22, 21, 19, .16);
  color: #234b2b;
  font-size: .82rem;
  font-weight: 750;
  left: 1rem;
  max-width: min(24rem, calc(100vw - 2rem));
  padding: .6rem .8rem;
  pointer-events: none;
  position: fixed;
  z-index: 10000;
}

/* Account Management Overview: intentionally page-scoped to avoid changing existing menus. */
.account-management-overview {
  --amo-actual: #1473e6;
  --amo-actual-soft: #edf5ff;
  --amo-target: #6f52c9;
  --amo-target-soft: #f5f1ff;
  --amo-line: #dcd7d1;
  --amo-panel: #fff;
  align-content: start;
  background: var(--oj-core-bg-color-content, #fff);
  box-sizing: border-box;
  color: var(--kpi-ink);
  display: grid;
  gap: 1rem;
  margin: 0 auto;
  max-width: none;
  padding: 1.25rem;
  width: 100%;
}
.account-overview__header { align-items: end; display: flex; justify-content: space-between; }
.account-overview__header h1 { font-size: clamp(1.55rem, 2.2vw, 2.15rem); margin: .2rem 0; }
.account-overview__header p,
.account-overview__section-heading p,
.account-overview__panel-heading p { color: var(--kpi-muted); margin: .15rem 0 0; }
.account-overview__search { background: #fff; border: 1px solid var(--amo-line); border-radius: .45rem; display: grid; gap: .35rem; padding: .8rem 1rem; }
.account-overview__search > label { font-size: .76rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.account-overview__search-field { align-items: center; border: 1px solid #9d9891; border-radius: .3rem; display: flex; min-height: 2.75rem; padding: 0 .75rem; }
.account-overview__search-field:focus-within { border-color: var(--amo-actual); box-shadow: 0 0 0 2px rgba(20, 115, 230, .14); }
.account-overview__search-field input { background: transparent; border: 0; color: inherit; flex: 1; font: inherit; min-width: 0; outline: 0; padding: .7rem; }
.account-overview__search small { color: var(--kpi-muted); }
.account-overview__loading { align-items: center; display: flex; gap: .55rem; justify-content: center; min-height: 5rem; }
.account-overview__exceptions { display: grid; gap: .75rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.account-overview__exceptions button { align-items: center; background: #fff; border: 1px solid var(--amo-line); border-radius: .4rem; color: inherit; cursor: pointer; display: flex; font: inherit; gap: .7rem; min-height: 4.3rem; padding: .7rem .85rem; text-align: left; }
.account-overview__exceptions button:hover { border-color: #b7afa7; box-shadow: 0 2px 8px rgba(33, 31, 29, .08); }
.account-overview__exceptions button.is-selected { background: #f2f7fc; border-color: var(--amo-actual); box-shadow: 0 0 0 2px rgba(20, 115, 230, .16); }
.account-overview__exceptions button.is-selected:hover { border-color: var(--amo-actual); box-shadow: 0 0 0 2px rgba(20, 115, 230, .22); }
.account-overview__exceptions strong,
.account-overview__exceptions small { display: block; }
.account-overview__exceptions strong { font-size: .96rem; font-weight: 750; line-height: 1.25; }
.account-overview__exceptions strong b { color: #22375c; font-size: 1.28rem; font-variant-numeric: tabular-nums; font-weight: 900; margin-right: .16rem; }
.account-overview__exceptions button:first-child strong b { color: #a52c18; }
.account-overview__exceptions small { color: var(--kpi-muted); font-size: .76rem; line-height: 1.35; margin-top: .2rem; }
.account-overview__exception-icon { align-items: center; border-radius: 50%; display: inline-flex; flex: 0 0 1.75rem; font-weight: 900; height: 1.75rem; justify-content: center; }
.account-overview__exception-icon.is-overdue { background: #fde8e2; color: #a52c18; }
.account-overview__exception-icon.is-warning { background: #fff0cc; color: #8a5200; }
.account-overview__section { background: #fff; border: 1px solid var(--amo-line); border-radius: .5rem; display: grid; gap: 1rem; overflow: hidden; padding: 1rem; }
.account-overview__section--actual { border-top: 4px solid var(--amo-actual); }
.account-overview__section--target { border-top: 4px solid var(--amo-target); }
.account-overview__section-heading { align-items: flex-end; display: flex; gap: 1rem; justify-content: space-between; }
.account-overview__section-heading h2 { font-size: 1.45rem; margin: .12rem 0; }
.account-overview__section-kicker { color: var(--amo-actual); font-size: .72rem; font-weight: 900; letter-spacing: .09em; }
.account-overview__section--target .account-overview__section-kicker { color: var(--amo-target); }
.account-overview__period-controls { align-items: end; display: flex; gap: .75rem; }
.account-overview__period-controls label,
.account-overview__target-period { display: grid; font-size: .72rem; font-weight: 800; gap: .2rem; letter-spacing: .03em; text-transform: uppercase; }
.account-overview__period-controls select,
.account-overview__target-period select { background: #fff; border: 1px solid #99938b; border-radius: .25rem; min-height: 2.3rem; padding: .35rem .55rem; }
.account-overview__segments { background: #eef2f6; border-radius: 999px; display: flex; padding: .2rem; }
.account-overview__segments button,
.account-overview__target-tabs button { background: transparent; border: 0; border-radius: 999px; color: inherit; cursor: pointer; font: inherit; font-size: .8rem; font-weight: 750; min-height: 2.25rem; padding: .45rem .75rem; white-space: nowrap; }
.account-overview__segments button.is-selected { background: var(--amo-actual); color: #fff; }
.account-overview__kpis,
.account-overview__pipeline { display: grid; gap: .75rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.account-overview__pipeline { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.account-overview__kpis article,
.account-overview__pipeline article { background: var(--amo-actual-soft); border: 1px solid #cfe1f7; border-radius: .4rem; display: grid; gap: .3rem; min-height: 7.2rem; padding: .85rem 1rem; }
.account-overview__pipeline article { background: var(--amo-target-soft); border-color: #ddd3f6; }
.account-overview__kpis span,
.account-overview__pipeline span { color: #335a82; font-size: .72rem; font-weight: 900; letter-spacing: .04em; }
.account-overview__pipeline span { color: #60489d; }
.account-overview__kpis strong,
.account-overview__pipeline strong { font-size: clamp(1.45rem, 2.3vw, 2rem); font-variant-numeric: tabular-nums; }
.account-overview__kpis small,
.account-overview__pipeline small { color: var(--kpi-muted); }
.account-overview__panel { background: var(--amo-panel); border: 1px solid var(--amo-line); border-radius: .4rem; overflow: hidden; padding: 1rem; }
.account-overview__panel-heading { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: .8rem; }
.account-overview__panel-heading h3 { margin: 0; }
.account-overview__legend { display: flex; flex-wrap: wrap; gap: .8rem; }
.account-overview__legend span { align-items: center; display: inline-flex; font-size: .75rem; gap: .35rem; }
.account-overview__legend span::before { background: currentColor; border-radius: 2px; content: ""; height: .65rem; width: .65rem; }
.account-overview__legend .is-new,
.account-overview__bars .is-new { color: #1677d2; }
.account-overview__legend .is-expansion,
.account-overview__bars .is-expansion { color: #64a9ec; }
.account-overview__legend .is-renewal,
.account-overview__bars .is-renewal { color: #244d7d; }
.account-overview__quarter-list { display: grid; gap: .5rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.account-overview__quarter { border: 1px solid #e2ded8; border-radius: .35rem; display: grid; gap: .65rem; padding: .7rem; }
.account-overview__quarter.is-selected { border-color: var(--amo-actual); box-shadow: inset 0 0 0 1px var(--amo-actual); }
.account-overview__quarter > div:first-child { display: flex; justify-content: space-between; }
.account-overview__quarter small { color: var(--kpi-muted); }
.account-overview__bars { display: grid; gap: .45rem; }
.account-overview__bars span { align-items: center; display: grid; font-size: .69rem; grid-template-columns: minmax(2rem, 1fr) auto; gap: .35rem; }
.account-overview__bars i { background: #ebe8e4; border-radius: 2px; height: .52rem; overflow: hidden; position: relative; }
.account-overview__bars i::after { background: currentColor; border-radius: inherit; content: ""; inset: 0 auto 0 0; position: absolute; width: var(--bar-width); }
.account-overview__bars b { color: var(--kpi-ink); font-variant-numeric: tabular-nums; min-width: 3rem; text-align: right; }
.account-overview__hierarchy-head,
.account-overview__tree-row,
.account-overview__deal-row { align-items: center; display: grid; gap: .6rem; grid-template-columns: minmax(18rem, 2fr) repeat(4, minmax(5.5rem, .7fr)); }
.account-overview__hierarchy-head { border-bottom: 1px solid var(--amo-line); color: var(--kpi-muted); font-size: .7rem; font-weight: 800; padding: .55rem .65rem; text-transform: uppercase; }
.account-overview__hierarchy-head span:not(:first-child) { text-align: right; }
.account-overview__hierarchy-head small { display: block; font-size: .62rem; font-weight: 700; letter-spacing: .04em; margin-top: .12rem; }
.account-overview__tree-row { background: transparent; border: 0; border-bottom: 1px solid #ebe8e4; color: inherit; cursor: pointer; font: inherit; min-height: 2.85rem; padding: .5rem .65rem; text-align: left; width: 100%; }
.account-overview__tree-row:hover { background: #f7f9fb; }
.account-overview__tree-row > span { align-items: center; display: flex; gap: .5rem; }
.account-overview__tree-row i { align-items: center; border: 1px solid #aaa49d; border-radius: 50%; display: inline-flex; font-style: normal; height: 1.2rem; justify-content: center; width: 1.2rem; }
.account-overview__tree-row em { background: #eeeae5; border-radius: 999px; color: #625c55; font-size: .65rem; font-style: normal; padding: .15rem .4rem; }
.account-overview__tree-row b,
.account-overview__deal-row b { font-variant-numeric: tabular-nums; text-align: right; }
.account-overview__tree-row.is-workload { background: #faf9f7; padding-left: 1.7rem; }
.account-overview__deal-row { border-bottom: 1px solid #f0ede9; min-height: 3rem; padding: .5rem .65rem .5rem 3rem; }
.account-overview__deal-row strong,
.account-overview__deal-row small { display: block; }
.account-overview__deal-row small { color: var(--kpi-muted); margin-top: .18rem; }
.account-overview__target-tabs { display: flex; gap: .35rem; overflow-x: auto; padding-bottom: .15rem; scrollbar-width: thin; }
.account-overview__target-tabs button { background: #f1eeeb; min-height: 2.75rem; }
.account-overview__target-tabs button.is-selected { background: var(--amo-target); color: #fff; }
.account-overview__target-period { justify-self: start; }
.account-overview__target-head,
.account-overview__target-row { align-items: center; display: grid; gap: .7rem; grid-template-columns: minmax(15rem, 1.8fr) .6fr .8fr .7fr .75fr .9fr minmax(10rem, 1.2fr); }
.account-overview__target-head { border-bottom: 1px solid var(--amo-line); color: var(--kpi-muted); font-size: .68rem; font-weight: 800; padding: .55rem; text-transform: uppercase; }
.account-overview__target-row { border-bottom: 1px solid #ece9e5; min-height: 4rem; padding: .55rem; }
.account-overview__target-row > span:first-child strong,
.account-overview__target-row > span:first-child small { display: block; }
.account-overview__target-row small { color: var(--kpi-muted); margin-top: .15rem; }
.account-overview__target-row b { font-variant-numeric: tabular-nums; }
.account-overview__status { background: #eeeae6; border-radius: 999px; display: inline-block; font-size: .7rem; font-style: normal; font-weight: 800; padding: .25rem .48rem; }
.account-overview__status.is-overdue { background: #fde6df; color: #9b2e1c; }
.account-overview__status.is-this_quarter { background: #e8f2fe; color: #175f9e; }
.account-overview__status.is-next_quarter { background: #ece8fa; color: #5e469b; }
.account-overview__status.is-target_not_set { background: #fff0ca; color: #855100; }
.account-overview__empty { color: var(--kpi-muted); padding: 1.2rem; text-align: center; }
.account-overview__prototype-note { color: var(--kpi-muted); font-size: .72rem; margin: 0; text-align: right; }

@media (max-width: 900px) {
  .account-overview__section-heading { align-items: flex-start; flex-direction: column; }
  .account-overview__period-controls { align-items: stretch; flex-direction: column; width: 100%; }
  .account-overview__segments { align-self: flex-start; }
  .account-overview__exceptions { grid-template-columns: 1fr; }
  .account-overview__quarter-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .account-overview__hierarchy,
  .account-overview__target-list { overflow-x: auto; }
}

@media (max-width: 520px) {
  .kpi-content:has(.account-management-overview) { padding: 0; }
  .account-management-overview { gap: .75rem; padding: .75rem; }
  .account-overview__header h1 { font-size: 1.55rem; }
  .account-overview__search { padding: .7rem; }
  .account-overview__exceptions { display: flex; gap: .45rem; overflow-x: auto; }
  .account-overview__exceptions button { flex: 0 0 13.5rem; min-height: 3.8rem; }
  .account-overview__section { padding: .75rem; }
  .account-overview__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .account-overview__kpis article { min-height: 6.4rem; padding: .7rem; }
  .account-overview__kpis strong,
  .account-overview__pipeline strong { font-size: 1.35rem; }
  .account-overview__quarter-list { grid-template-columns: 1fr; }
  .account-overview__quarter { grid-template-columns: 4rem minmax(0, 1fr); }
  .account-overview__hierarchy-head { display: none; }
  .account-overview__tree-row,
  .account-overview__deal-row { grid-template-columns: minmax(0, 1fr); }
  .account-overview__tree-row { align-items: start; border: 1px solid #dedad4; border-radius: .35rem; display: grid; gap: .4rem; margin: .45rem 0; }
  .account-overview__tree-row b { display: none; }
  .account-overview__tree-row.is-workload { margin-left: .7rem; padding-left: .65rem; }
  .account-overview__deal-row { background: #fbfaf8; border: 1px solid #e4e0da; border-radius: .35rem; margin: .45rem 0 .45rem 1.4rem; padding: .65rem; }
  .account-overview__deal-row b { display: none; }
  .account-overview__pipeline { grid-template-columns: 1fr; }
  .account-overview__pipeline article { align-items: center; grid-template-columns: 1fr auto; min-height: 0; padding: .7rem; }
  .account-overview__pipeline small { grid-column: 1 / -1; }
  .account-overview__target-tabs button { min-height: 44px; }
  .account-overview__target-head { display: none; }
  .account-overview__target-row { align-items: start; background: #fff; border: 1px solid #ded9d2; border-radius: .4rem; grid-template-columns: 1fr 1fr; margin: .55rem 0; padding: .75rem; }
  .account-overview__target-row > span:first-child { grid-column: 1 / -1; }
  .account-overview__target-row > span:last-child { border-top: 1px solid #ece8e3; grid-column: 1 / -1; padding-top: .5rem; }
  .account-overview__target-row > *::before { color: var(--kpi-muted); display: block; font-size: .62rem; font-weight: 800; letter-spacing: .03em; margin-bottom: .12rem; text-transform: uppercase; }
  .account-overview__target-row > span:nth-child(2)::before { content: "Type"; }
  .account-overview__target-row > span:nth-child(3)::before { content: "Target FY/Q"; }
  .account-overview__target-row > b::before { content: "Amount"; }
  .account-overview__target-row > span:nth-child(5)::before { content: "Status"; }
  .account-overview__target-row > span:nth-child(6)::before { content: "To target-quarter end"; }
  .account-overview__target-row > span:last-child::before { content: "Latest update"; }
}

/* Design-reference alignment overrides; still strictly scoped to this page. */
.account-management-overview { gap: 1rem; padding: 1rem 1.25rem 2rem; background: var(--oj-core-bg-color-content, #fff); font-size: 13px; }
.account-overview__header h1 { font-size: 1.8rem; }
.account-overview__top-row { display: grid; grid-template-columns: minmax(300px,1fr) minmax(600px,1.25fr); gap: .7rem; align-items: stretch; }
.account-overview__search { gap: .3rem; padding: .7rem .8rem; border-radius: 5px; }
.account-overview__search-field { min-height: 34px; border-radius: 4px; }
.account-overview__search small, .account-overview__exceptions small, .account-overview__section-heading p, .account-overview__panel-heading p { font-size: .68rem; }
.account-overview__exceptions { grid-template-columns: repeat(3,minmax(0,1fr)); gap: .55rem; }
.account-overview__exceptions button { min-height: 0; padding: .65rem .7rem; border: 1px solid #e4c9c2; border-radius: 5px; background: #fff9f7; }
.account-overview__exceptions button:nth-child(n+2) { border-color: #eadfb7; background: #fffdf4; }
.account-overview__exceptions strong { font-size: .9rem; line-height: 1.3; white-space: normal; }
.account-overview__exceptions strong b { font-size: 1.65rem; }
.account-overview__exception-icon { width: 25px; height: 25px; flex-basis: 25px; }
.account-overview__section { gap: .7rem; padding: .85rem; border: 1px solid #d8dde6; border-radius: 6px; background: #f3f7fd; }
.account-overview__section--target { background: #f8f5fc; }
.account-overview__section-heading { align-items: center; }
.account-overview__title-lockup { display: flex; align-items: stretch; gap: .65rem; }
.account-overview__title-mark { width: 4px; border-radius: 3px; background: #2b63c4; }
.account-overview__section--target .account-overview__title-mark { background: #6d43c1; }
.account-overview__section-heading h2 { font-size: 1.05rem; color: #253858; }
.account-overview__section--target .account-overview__section-heading h2 { color: #53368f; }
.account-overview__section-heading h2 small { font-size: .7rem; color: #2b63c4; text-transform: uppercase; letter-spacing: .045em; }
.account-overview__section--target .account-overview__section-heading h2 small { color: #6d43c1; }
.account-overview__period-controls { align-items: end; }
.account-overview__segments, .account-overview__target-tabs { gap: 0; border: 1px solid #aeb6c2; border-radius: 4px; overflow: hidden; background: #fff; }
.account-overview__segments button, .account-overview__target-tabs button { min-height: 31px; padding: .3rem .65rem; border: 0; border-right: 1px solid #d7dce4; border-radius: 0; background: #fff; color: #374151; }
.account-overview__segments button:last-child, .account-overview__target-tabs button:last-child { border-right: 0; }
.account-overview__segments button.is-selected { color: #fff; background: #2b63c4; }
.account-overview__target-tabs { flex-wrap: nowrap; }
.account-overview__target-tabs button { display: grid; min-width: 76px; gap: .06rem; }
.account-overview__target-tabs button strong { font-size: .68rem; }
.account-overview__target-tabs button small { font-size: .56rem; color: #697386; }
.account-overview__target-tabs button.is-selected { color: #fff; background: #6d43c1; }
.account-overview__target-tabs button.is-selected small { color: #ede6fb; }
.account-overview__kpis { gap: .6rem; }
.account-overview__kpis article, .account-overview__pipeline article { min-height: 78px; padding: .72rem .8rem; border: 1px solid #d8dde6; border-radius: 5px; background: #fff; box-shadow: 0 1px 2px rgb(15 23 42 / 4%); }
.account-overview__kpis article { border-top: 3px solid #2b63c4; }
.account-overview__pipeline article { border-top: 3px solid #6d43c1; }
.account-overview__kpis strong, .account-overview__pipeline strong { font-size: 1.18rem; color: #22375c; }
.account-overview__pipeline strong { color: #55338e; }
.account-overview__actual-details { display: grid; grid-template-columns: minmax(340px,.9fr) minmax(520px,1.35fr); gap: .7rem; align-items: start; }
.account-overview__actual-details > .account-overview__panel { height: 21rem; }
.account-overview__quarter-chart,
.account-overview__hierarchy { display: flex; flex-direction: column; }
.account-overview__panel { border: 1px solid #d8dde6; border-radius: 5px; overflow: hidden; }
.account-overview__panel-heading { padding: .68rem .75rem .55rem; }
.account-overview__panel-heading h3 { font-size: .8rem; }
.account-overview__legend { font-size: .58rem; }
.account-overview__legend span::before { width: 7px; height: 7px; background: #248cff; }
.account-overview__legend .is-expansion::before { background: #35c6d0; }
.account-overview__legend .is-renewal::before { background: #8b7cff; }
.account-overview__vertical-chart { display: grid; grid-template-columns: 46px 1fr; margin-top: auto; min-height: 245px; padding: .3rem .75rem 1rem .25rem; width: 100%; }
.account-overview__axis { display: flex; flex-direction: column; justify-content: space-between; padding: 0 .4rem 20px 0; color: #697386; font-size: .58rem; text-align: right; }
.account-overview__plot { display: grid; grid-template-columns: repeat(4,1fr); gap: .45rem; align-items: end; height: 230px; padding: 0 .4rem; border-bottom: 1px solid #aeb6c2; background: repeating-linear-gradient(to bottom,#fff 0,#fff 75px,#e6e9ef 76px,#fff 77px); }
.account-overview__bar-group { display: grid; grid-template-rows: 205px 20px; gap: 4px; align-items: end; text-align: center; border-radius: 3px; }
.account-overview__bar-group.is-selected { background: #eef4ff; }
.account-overview__bar-group strong { font-size: .64rem; }
.account-overview__bar-columns { display: flex; align-items: end; justify-content: center; gap: 3px; height: 100%; }
.account-overview__bar-columns i { width: 16%; min-width: 9px; max-width: 18px; min-height: 2px; border-radius: 2px 2px 0 0; background: #2b63c4; }
.account-overview__bar-columns .is-expansion { background: #5d8be0; }
.account-overview__bar-columns .is-renewal { background: #a8c4ef; }
.account-overview__hierarchy-head, .account-overview__tree-row, .account-overview__deal-row { grid-template-columns: minmax(180px,2fr) repeat(4,minmax(75px,.8fr)); gap: .4rem; }
.account-overview__hierarchy-head { padding: .45rem .65rem; background: #f4f6f8; font-size: .58rem; }
.account-overview__tree-row { min-height: 34px; padding: .38rem .65rem; border-radius: 0; border-bottom: 1px solid #eceff3; }
.account-overview__tree-row.is-workload { padding-left: .65rem; }
.account-overview__tree-row.is-workload > span:first-child { padding-left: .95rem; }
.account-overview__deal-row { min-height: 38px; padding: .35rem .65rem; }
.account-overview__deal-row > span:first-child { padding-left: 2rem; }
.account-overview__target-head { background: #f4f1f8; }
.account-overview__target-row { min-height: 38px; font-size: .68rem; }
@media (max-width: 1100px) {
  .account-overview__top-row, .account-overview__actual-details { grid-template-columns: 1fr; }
  .account-overview__section-heading { align-items: flex-start; flex-direction: column; }
  .account-overview__target-tabs { width: 100%; }
  .account-overview__target-tabs button { flex: 1 1 0; }
}
@media (max-width: 520px) {
  .account-overview__exceptions { display: grid; grid-template-columns: 1fr; overflow: visible; }
  .account-overview__exceptions button { min-height: 0; }
  .account-overview__section-heading h2 small { display: block; margin-top: .12rem; }
  .account-overview__target-tabs { display: grid; grid-template-columns: repeat(2,1fr); border: 0; gap: .35rem; background: transparent; overflow: visible; }
  .account-overview__target-tabs button { border: 1px solid #c9c0d7; border-radius: 4px; }
  .account-overview__quarter-chart { overflow-x: auto; }
  .account-overview__vertical-chart { min-width: 340px; }
}

/* Account Management Overview: searchable account scope, measure split, and bounded lists. */
.account-overview__search-field button {
  background: transparent;
  border: 0;
  color: #315f9b;
  cursor: pointer;
  font: inherit;
  font-size: .68rem;
  font-weight: 800;
  padding: .4rem;
}
.account-overview__control-label {
  display: block;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .03em;
  margin-bottom: .2rem;
  text-transform: uppercase;
}
.account-overview__kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.account-overview__metric-lines { display: grid; gap: .25rem; }
.account-overview__metric-lines strong {
  align-items: baseline;
  display: flex;
  gap: .45rem;
}
.account-overview__metric-lines strong small {
  color: #335a82;
  font-size: .67rem;
  font-weight: 900;
  min-width: 2rem;
}
.account-overview__hierarchy-scroll {
  flex: 1 1 auto;
  height: auto;
  max-height: none;
  min-height: 0;
  overflow: auto;
  scrollbar-width: thin;
}
.account-overview__target-list { overflow: hidden; padding-bottom: 0; }
.account-overview__target-scroll {
  height: 24rem;
  max-height: 24rem;
  overflow: auto;
  scrollbar-width: thin;
}
.account-overview__target-footer {
  align-items: center;
  background: #f4f1f8;
  border-top: 1px solid #d8dde6;
  display: flex;
  font-size: .72rem;
  justify-content: space-between;
  margin: 0 -1rem;
  padding: .7rem 1rem;
}
.account-overview__target-footer strong { color: #55338e; font-variant-numeric: tabular-nums; }
.account-overview__latest-update {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.account-overview__latest-tooltip {
  background: #1f2937;
  border-radius: .35rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .24);
  color: #fff;
  font-size: .75rem;
  line-height: 1.35;
  max-width: 21rem;
  padding: .55rem .7rem;
  pointer-events: none;
  position: fixed;
  white-space: normal;
  z-index: 1000;
}
.account-overview__bar-item {
  align-items: center;
  align-self: end;
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  height: 100%;
  justify-content: flex-end;
  min-width: 10px;
  max-width: 28px;
}
.account-overview__bar-item small {
  color: #35465f;
  font-size: .52rem;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  margin-bottom: 3px;
  transform: rotate(-52deg);
  transform-origin: center;
  white-space: nowrap;
}
.account-overview__bar-item b { color: #35465f; font-size: .58rem; margin-top: 3px; }
.account-overview__bar-stack { display: flex; flex-direction: column-reverse; max-width: none; overflow: hidden; width: 72%; }
.account-overview__bar-stack i { display: block; min-height: 0; width: 100%; }
.account-overview__bar-columns .is-new { background: #248cff; }
.account-overview__bar-columns .is-expansion { background: #35c6d0; }
.account-overview__bar-columns .is-renewal { background: #8b7cff; }

.account-overview__search-combobox { position: relative; }
.account-overview__search-options { background: var(--oj-core-bg-color-content); border: 1px solid var(--oj-core-border-color-enabled); box-shadow: var(--oj-core-box-shadow-md, 0 .5rem 1.5rem rgb(0 0 0 / 16%)); display: grid; left: 0; max-height: 18rem; overflow-y: auto; position: absolute; right: 0; top: calc(100% + .2rem); z-index: 30; }
.account-overview__search-options button { background: transparent; border: 0; border-bottom: 1px solid var(--oj-core-divider-color); color: inherit; cursor: pointer; display: grid; gap: .15rem; padding: .6rem .7rem; text-align: left; }
.account-overview__search-options button:hover,
.account-overview__search-options button:focus-visible { background: var(--oj-core-bg-color-hover); outline: none; }
.account-overview__search-options small,
.account-overview__search-options p { color: var(--kpi-muted); margin: 0; }

@media (max-width: 900px) {
  .account-overview__period-controls { flex-direction: row; flex-wrap: wrap; }
  .account-overview__target-head,
  .account-overview__target-row { min-width: 62rem; }
}

@media (max-width: 520px) {
  .account-overview__actual-details > .account-overview__panel { height: auto; min-height: 18rem; }
  .account-overview__kpis { grid-template-columns: 1fr; }
  .account-overview__metric-lines strong { font-size: 1.15rem; }
  .account-overview__hierarchy-scroll { height: 24rem; max-height: 24rem; }
  .account-overview__target-scroll { height: 28rem; max-height: 28rem; }
  .account-overview__target-footer { margin: 0 -.75rem; padding: .7rem .75rem; }
}

/* Account Management Overview: executive readability and opportunity terminology. */
.account-overview__exceptions strong {
  font-size: clamp(.76rem, .85vw, .86rem);
  font-weight: 850;
  line-height: 1.15;
  white-space: nowrap;
}
.account-overview__exceptions strong b {
  color: #22375c;
  font-size: clamp(1.3rem, 1.55vw, 1.6rem);
  font-weight: 900;
  line-height: 1;
  margin-right: .3rem;
}
.account-overview__exceptions button:first-child strong b { color: #a52c18; }
.account-overview__kpis article > span {
  font-size: .92rem;
  letter-spacing: .025em;
}
.account-overview__metric-lines strong,
.account-overview__metric-lines strong small {
  font-size: 1.18rem;
  line-height: 1.2;
}
.account-overview__metric-lines strong small { min-width: 2.5rem; }
.account-overview__won-count b {
  color: #174f9c;
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  font-weight: 900;
}
.account-overview__section { gap: .55rem; padding: .7rem .8rem; }
.account-overview__actual-details { gap: .55rem; }
.account-overview__actual-details > .account-overview__panel { height: 24rem; }
.account-overview__quarter-chart,
.account-overview__hierarchy,
.account-overview__target-list { padding: .65rem; }
.account-overview__quarter-chart .account-overview__panel-heading,
.account-overview__hierarchy .account-overview__panel-heading,
.account-overview__target-list .account-overview__panel-heading {
  margin-bottom: .35rem;
  padding: 0;
}
.account-overview__quarter-chart .account-overview__panel-heading h3,
.account-overview__hierarchy .account-overview__panel-heading h3 { font-size: 1rem; }
.account-overview__legend { font-size: .72rem; font-weight: 800; }
.account-overview__legend .is-new { color: #7fb4df; }
.account-overview__legend .is-expansion { color: #82c7bd; }
.account-overview__legend .is-renewal { color: #b7a6dc; }
.account-overview__legend span::before { background: currentColor; }
.account-overview__vertical-chart {
  grid-template-columns: 62px minmax(560px, 1fr);
  min-height: 360px;
  overflow-x: auto;
  padding: .4rem .75rem 1rem .2rem;
}
.account-overview__axis {
  font-size: .76rem;
  font-weight: 800;
  padding: 0 .55rem 26px 0;
}
.account-overview__plot {
  gap: .7rem;
  height: 342px;
  min-width: 560px;
  padding: 0 .55rem;
}
.account-overview__bar-group { grid-template-rows: 312px 24px; gap: 5px; }
.account-overview__bar-group > strong { font-size: .78rem; }
.account-overview__bar-columns { gap: .45rem; }
.account-overview__bar-item {
  max-width: 68px;
  min-width: 44px;
}
.account-overview__bar-item .account-overview__bar-total {
  color: #263b59;
  font-size: .72rem;
  font-weight: 900;
  line-height: 1.05;
  margin-bottom: 4px;
  transform: none;
}
.account-overview__bar-stack { border-radius: 4px 4px 0 0; width: 62%; }
.account-overview__bar-columns .is-new,
.account-overview__legend .is-new::before { background: #7fb4df; }
.account-overview__bar-columns .is-expansion,
.account-overview__legend .is-expansion::before { background: #82c7bd; }
.account-overview__bar-columns .is-renewal,
.account-overview__legend .is-renewal::before { background: #b7a6dc; }

.account-overview__hierarchy-head { font-size: .72rem; }
.account-overview__target-tabs button {
  align-items: center;
  justify-content: center;
  place-content: center;
}
.account-overview__target-list .account-overview__panel-heading h3 { font-size: 1.08rem; }
.account-overview__target-head {
  font-size: .74rem;
  line-height: 1.25;
}
.account-overview__target-head span:nth-child(6),
.account-overview__target-head span:nth-child(7),
.account-overview__target-row > span:nth-child(6),
.account-overview__latest-update { font-size: .74rem; }
.account-overview__type-badge {
  border-radius: 999px;
  display: inline-block;
  font-size: .68rem;
  font-style: normal;
  font-weight: 850;
  letter-spacing: .02em;
  padding: .24rem .5rem;
}
.account-overview__type-badge.is-new { background: #dcecf9; color: #225f91; }
.account-overview__type-badge.is-expansion { background: #dff2ee; color: #226e65; }
.account-overview__type-badge.is-renewal { background: #eee8f8; color: #674e97; }

@media (max-width: 520px) {
  .account-overview__exceptions strong { font-size: .8rem; }
  .account-overview__exceptions strong b { font-size: 1.4rem; }
  .account-overview__actual-details > .account-overview__panel { height: auto; min-height: 24rem; }
  .account-overview__vertical-chart { min-width: 0; width: 100%; }
  .account-overview__target-row > span:nth-child(6),
  .account-overview__latest-update { font-size: .78rem; }
}

/* Header brand lockup: one KAP variant per app load plus an independent Oracle mark. */
@media (max-width: 720px) {
  .kpi-header__bar { box-sizing: border-box; }
  .kpi-header__brand { flex: 0 1 auto; overflow: hidden; }
  .kap-header-wordmark {
    height: 2rem;
    max-height: 2rem;
    width: auto;
  }
  .kpi-header__end {
    align-items: flex-end;
    flex-direction: column;
    gap: 0;
  }
  .kpi-header__oracle-logo {
    margin: 0 0 .1rem .05rem;
    width: 2.65rem;
  }
  .account-management-overview,
  .account-overview__section,
  .account-overview__panel,
  .account-overview__target-kpis,
  .account-overview__target-kpi,
  .account-overview__target-tabs,
  .account-overview__actual-details {
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
  }
}

.forecast-actual-header-actions { align-items: center; display: flex; flex-wrap: wrap; gap: .35rem .65rem; justify-content: flex-end; }
.forecast-actual-header-actions small { color: var(--oj-core-text-color-secondary); font-size: .72rem; }
.forecast-actual-account-rep { display: none; }

.forecast-actual-filters {
  align-items: end;
  background: var(--oj-core-bg-color-content);
  border: 1px solid var(--oj-core-divider-color);
  border-radius: .65rem;
  display: grid;
  gap: .85rem;
  grid-template-columns: repeat(4, minmax(9rem, 1fr));
  margin: 1rem 0;
  padding: 1rem;
}
.forecast-actual-filters label { color: var(--oj-core-text-color-secondary); display: grid; font-size: .78rem; font-weight: 700; gap: .35rem; }
.forecast-actual-filters input,
.forecast-actual-filters select { border: 1px solid var(--oj-core-divider-color); border-radius: .35rem; box-sizing: border-box; min-height: 2.5rem; padding: .5rem .65rem; width: 100%; }
.forecast-actual-filters .forecast-actual-mode-switch { align-self: stretch; }
.forecast-actual-switch-row { align-items: center; display: flex; gap: .45rem; min-height: 2.5rem; white-space: nowrap; }
.forecast-actual-switch-row > span { font-size: .7rem; }
.forecast-actual-filters .forecast-actual-switch-row input { appearance: none; background: #6b7280; border: 0; border-radius: 999px; cursor: pointer; min-height: 1.35rem; padding: .15rem; position: relative; width: 2.5rem; }
.forecast-actual-filters .forecast-actual-switch-row input::after { background: white; border-radius: 50%; content: ""; display: block; height: 1.05rem; transition: transform .15s ease; width: 1.05rem; }
.forecast-actual-filters .forecast-actual-switch-row input:checked { background: var(--oj-core-brand-color-1); }
.forecast-actual-filters .forecast-actual-switch-row input:checked::after { transform: translateX(1.15rem); }
.forecast-actual-filters .forecast-actual-switch-row input:focus-visible { outline: 2px solid var(--oj-core-focus-border-color); outline-offset: 2px; }
.forecast-actual-account-search { width: 100%; }
.forecast-actual-account-search .consumption-insights-options { max-height: 19rem; overflow-y: auto; }
.forecast-actual-period-note { background: var(--oj-core-bg-color-neutral); border-left: .2rem solid var(--oj-core-brand-color-1); display: flex; flex-wrap: wrap; font-size: .78rem; gap: .3rem 1.25rem; margin: .75rem 0 1rem; padding: .65rem .85rem; }
.forecast-actual-mtd-comparison { background: var(--oj-core-bg-color-neutral); border: 1px solid var(--oj-core-divider-color); border-radius: .5rem; margin: 0 0 .85rem; padding: .6rem .8rem; }
.forecast-actual-mtd-comparison p { align-items: baseline; display: flex; flex-wrap: wrap; gap: .35rem 1rem; margin: 0 0 .65rem; }
.forecast-actual-mtd-comparison p span { color: var(--oj-core-text-color-secondary); font-size: .78rem; }
.forecast-actual-summary { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); margin-bottom: 1rem; }
.forecast-actual-summary article { background: linear-gradient(180deg, color-mix(in srgb, var(--oj-core-brand-color-1) 5%, var(--oj-core-bg-color-content)), var(--oj-core-bg-color-content) 45%); border: 1px solid var(--oj-core-divider-color); border-top: .2rem solid color-mix(in srgb, var(--oj-core-brand-color-1) 65%, var(--oj-core-divider-color)); border-radius: .55rem; box-shadow: 0 1px 3px rgb(0 0 0 / 7%); display: grid; gap: .2rem; min-width: 0; overflow: hidden; padding: .72rem .85rem; }
.forecast-actual-summary article > span,
.forecast-actual-summary small { color: var(--oj-core-text-color-secondary); overflow-wrap: anywhere; }
.forecast-actual-summary strong { font-size: 1.18rem; font-variant-numeric: tabular-nums; }
.forecast-actual-summary .is-negative strong,
.forecast-actual-matrix .is-negative { color: #b42318; }
.forecast-actual-summary .is-positive strong,
.forecast-actual-matrix .is-positive { color: #18794e; }
.forecast-actual-matrix-shell { max-width: 100%; position: relative; }
.forecast-actual-month-scroll { border: 1px solid var(--oj-core-divider-color); border-radius: .55rem; max-height: min(62vh, 38rem); max-width: 100%; overflow: auto; overscroll-behavior: contain; scrollbar-color: var(--oj-core-divider-color) transparent; scrollbar-width: thin; touch-action: pan-x pan-y; }
.forecast-actual-month-scroll:focus-visible { outline: 2px solid var(--oj-core-focus-border-color); outline-offset: 2px; }
.forecast-actual-matrix-shell .consumption-scroll-controls { right: .75rem; top: 5rem; }
.forecast-actual-matrix { border-collapse: separate; border-spacing: 0; min-width: max-content; table-layout: fixed; }
.forecast-actual-matrix th,
.forecast-actual-matrix td { background: var(--oj-core-bg-color-content); border-bottom: 1px solid color-mix(in srgb, var(--oj-core-divider-color) 72%, transparent); border-right: 1px solid var(--oj-core-divider-color); box-sizing: border-box; padding: .55rem .65rem; text-align: left; vertical-align: top; width: 10.5rem; }
.forecast-actual-matrix tbody tr:nth-child(even) > td,
.forecast-actual-matrix tbody tr:nth-child(even) > th { background: color-mix(in srgb, var(--oj-core-bg-color-neutral) 45%, var(--oj-core-bg-color-content)); }
.forecast-actual-matrix thead th { background: color-mix(in srgb, var(--oj-core-brand-color-1) 9%, var(--oj-core-bg-color-neutral)); box-shadow: inset 0 -.1rem 0 var(--oj-core-divider-color); position: sticky; top: 0; z-index: 6; }
.forecast-actual-matrix .is-sticky { position: sticky; z-index: 8; }
.forecast-actual-matrix thead .is-sticky { z-index: 12; }
.forecast-actual-matrix .is-account { left: 0; width: 10rem; }
.forecast-actual-matrix .is-rep { left: 10rem; width: 7.5rem; }
.forecast-actual-matrix .is-summary { box-shadow: .55rem 0 .8rem -.7rem rgb(0 0 0 / 50%); left: 17.5rem; width: 11rem; }
.forecast-actual-sort-button { align-items: center; appearance: none; background: transparent; border: 0; border-radius: .25rem; color: inherit; cursor: pointer; display: inline-flex; font: inherit; font-weight: 750; gap: .45rem; min-height: 2rem; padding: .2rem .3rem; text-align: left; }
.forecast-actual-sort-button:hover { background: var(--oj-core-bg-color-hover); }
.forecast-actual-sort-button:focus-visible { outline: 2px solid var(--oj-core-focus-border-color); outline-offset: 1px; }
.forecast-actual-sort-indicator,
.forecast-actual-chevron { border: solid currentColor; border-width: 0 .12rem .12rem 0; display: inline-block; height: .38rem; width: .38rem; }
.forecast-actual-sort-indicator.is-asc { transform: rotate(225deg) translate(-.05rem, -.05rem); }
.forecast-actual-sort-indicator.is-desc { transform: rotate(45deg) translate(-.05rem, -.05rem); }
.forecast-actual-chevron.is-left { transform: rotate(135deg); }
.forecast-actual-chevron.is-right { transform: rotate(-45deg); }
.forecast-actual-fixed-summary,
.forecast-actual-month-cell__content { display: grid; gap: .28rem; min-height: 0; }
.forecast-actual-fixed-summary > span,
.forecast-actual-month-cell__content > span { align-items: baseline; color: var(--oj-core-text-color-secondary); display: flex; flex-wrap: wrap; font-size: .74rem; gap: .25rem .65rem; justify-content: space-between; }
.forecast-actual-month-cell .forecast-actual-projection { color: var(--oj-core-text-color-secondary); font-style: italic; }
.forecast-actual-fixed-summary > span strong,
.forecast-actual-month-cell__content > span strong { color: var(--oj-core-text-color-primary); font-size: .86rem; font-variant-numeric: tabular-nums; margin-left: auto; text-align: right; white-space: nowrap; }
.forecast-actual-month-cell small { border-top: 1px solid var(--oj-core-divider-color); color: var(--oj-core-text-color-secondary); margin-top: .15rem; padding-top: .35rem; }
.forecast-actual-month-cell.is-provisional { box-shadow: inset .18rem 0 0 #a97818; }
.forecast-actual-month-cell.is-empty { color: var(--oj-core-text-color-secondary); }
.forecast-actual-month-state { display: grid; font-size: .68rem; gap: .12rem; }
.forecast-actual-month-state > strong { color: var(--oj-core-text-color-primary); font-size: .7rem; }
.forecast-actual-secondary { color: var(--oj-core-text-color-secondary); font-size: .78rem; }
.forecast-actual-statuses { align-items: flex-start; display: flex; flex-direction: column; gap: .3rem; }
.forecast-actual-status { background: var(--oj-core-bg-color-neutral); border: 1px solid var(--oj-core-divider-color); border-radius: 999px; display: inline-block; font-size: .68rem; padding: .22rem .5rem; white-space: nowrap; }
.forecast-actual-status.is-confirmed-risk { border-color: #d7a5a0; font-weight: 700; }
.forecast-actual-status.is-projection-watch { border-color: #d7c89e; }
.consumption-analysis-mtd-control small,
.consumption-table-heading__actions > small { color: var(--oj-core-text-color-secondary); display: block; font-size: .72rem; }
.consumption-mtd-applied-date { background: color-mix(in srgb, var(--oj-core-brand-color-1) 9%, var(--oj-core-bg-color-content)); border: 1px solid color-mix(in srgb, var(--oj-core-brand-color-1) 24%, var(--oj-core-divider-color)); border-radius: .4rem; color: var(--oj-core-text-color-primary) !important; font-variant-numeric: tabular-nums; font-weight: 700; padding: .35rem .55rem; white-space: nowrap; }
.forecast-actual-loading { align-items: center; display: flex; gap: .75rem; justify-content: center; min-height: 0; padding: 1.25rem 0; }
.forecast-actual-page .consumption-inline-error { margin: 0; min-height: 0; padding: .75rem 1rem; }
.forecast-actual-fy-summary {
  background: #f7f8f9;
  border: 1px solid var(--oj-core-divider-color);
  border-radius: .5rem;
  display: grid;
  gap: .55rem 1rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0 0 1rem;
  padding: 1rem;
}
.forecast-actual-fy-summary h2 { font-size: 1rem; grid-column: 1 / -1; margin: 0; }
.forecast-actual-fy-summary div { display: grid; gap: .2rem; }
.forecast-actual-fy-summary span { color: var(--oj-core-text-color-secondary); font-size: .78rem; }
.forecast-actual-empty { color: var(--oj-core-text-color-secondary); padding: 2rem !important; text-align: center !important; }

@media (max-width: 900px) {
  .forecast-actual-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .forecast-actual-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .forecast-actual-filters,
  .forecast-actual-summary,
  .forecast-actual-fy-summary { grid-template-columns: 1fr; }
  .forecast-actual-filters { gap: .65rem; margin: .5rem 0 .75rem; }
  .forecast-actual-loading { justify-content: flex-start; padding: .75rem 0; }
  .forecast-actual-filters { padding: .75rem; }
  .forecast-actual-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forecast-actual-summary article { padding: .7rem .75rem; }
  .forecast-actual-matrix .is-account { width: 7.5rem; }
  .forecast-actual-account-rep { color: var(--oj-core-text-color-secondary); display: block; font-size: .68rem; font-weight: 400; margin-top: .25rem; overflow-wrap: anywhere; }
  .forecast-actual-matrix .is-rep { display: none; }
  .forecast-actual-matrix .is-summary { left: 7.5rem; width: 8.5rem; }
  .forecast-actual-matrix th,
  .forecast-actual-matrix td { padding: .65rem; width: 10rem; }
  .forecast-actual-matrix-shell .consumption-scroll-controls { flex-direction: row; right: .4rem; top: 3.4rem; }
}

/* Forecast vs Actual uses the same normal-flow shell as Consumption Analysis. */
.forecast-actual-page {
  display: grid;
  gap: .75rem;
  min-width: 0;
}
.forecast-actual-header {
  align-items: flex-end;
  display: flex;
  gap: .75rem 1rem;
  justify-content: space-between;
  margin: 0;
  min-width: 0;
}
.forecast-actual-title-block { flex: 0 1 auto; min-width: 12rem; }
.forecast-actual-toolbar {
  align-items: flex-end;
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  justify-content: flex-end;
  min-width: 0;
}
.forecast-actual-control { color: var(--oj-core-text-color-secondary); display: grid; font-size: .7rem; font-weight: 700; gap: .2rem; min-width: 6.25rem; }
.forecast-actual-control select,
.forecast-actual-search-panel input { box-sizing: border-box; font-size: .78rem; height: 2rem; min-width: 0; padding-block: .25rem; }
.forecast-actual-mtd-control { align-items: center; display: flex; flex-direction: row; gap: .35rem; min-height: 2rem; min-width: auto; }
.forecast-actual-pillar { min-width: max-content; }
.forecast-actual-pillar .consumption-pillar-selector button { font-size: .72rem; min-height: 2rem; padding: .3rem .55rem; }
.forecast-actual-search-panel { width: min(15rem, 100%); }
.forecast-actual-search-panel .forecast-actual-account-search,
.forecast-actual-search-panel input { width: 100%; }
.forecast-actual-updating { align-self: center; color: var(--oj-core-text-color-secondary); }
.forecast-actual-loading { align-items: center; display: flex; gap: .45rem; min-height: 3rem; }
.forecast-actual-results { display: grid; gap: .65rem; min-width: 0; }
.forecast-actual-results.is-updating { opacity: .75; }
.forecast-actual-summary {
  display: grid;
  gap: .55rem;
  grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
  margin: 0;
}
.forecast-actual-summary article,
.forecast-actual-problem-card {
  align-content: center;
  background: var(--oj-core-bg-color-content);
  border: 1px solid var(--oj-core-divider-color);
  border-radius: .45rem;
  color: var(--oj-core-text-color-primary);
  display: grid;
  gap: .15rem;
  min-height: 4.65rem;
  padding: .6rem .75rem;
  text-align: start;
}
.forecast-actual-problem-card { cursor: pointer; font: inherit; }
.forecast-actual-problem-card:hover { border-color: var(--oj-core-brand-color-1); }
.forecast-actual-problem-card.is-selected { background: color-mix(in srgb, var(--oj-core-brand-color-1) 9%, white); border-color: var(--oj-core-brand-color-1); box-shadow: inset 0 0 0 1px var(--oj-core-brand-color-1); }
.forecast-actual-summary strong { font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.forecast-actual-summary small { color: var(--oj-core-text-color-secondary); font-size: .68rem; }
.forecast-actual-card-guide { color: var(--oj-core-text-color-secondary); font-size: .8rem; line-height: 1.5; margin: -.15rem 0 0; }
.forecast-actual-card-guide strong { color: var(--oj-core-text-color-primary); }
.forecast-actual-matrix-shell { border: 1px solid var(--oj-core-divider-color); border-radius: .4rem; min-width: 0; overflow: hidden; }
.forecast-actual-matrix-toolbar { align-items: center; background: var(--oj-core-bg-color-content); border-bottom: 1px solid var(--oj-core-divider-color); display: flex; justify-content: space-between; min-height: 2.2rem; padding: .25rem .5rem; }
.forecast-actual-unit-note { color: var(--oj-core-text-color-secondary); font-size: .68rem; font-weight: 700; }
.forecast-actual-month-scroll { max-height: min(65vh, 44rem); overflow: auto; scrollbar-width: thin; }
.forecast-actual-matrix { border-collapse: separate; border-spacing: 0; table-layout: fixed; width: max-content; }
.forecast-actual-matrix th,
.forecast-actual-matrix td { border-bottom: 1px solid var(--oj-core-divider-color); border-inline-end: 1px solid var(--oj-core-divider-color); box-sizing: border-box; font-size: .75rem; height: 2.3rem; line-height: 1.2; padding: .3rem .42rem; vertical-align: middle; }
.forecast-actual-matrix thead th { color: var(--oj-core-text-color-primary); font-size: .69rem; font-weight: 800; position: sticky; text-align: center; top: 0; z-index: 7; }
.forecast-actual-matrix .forecast-actual-group-header th { background: #e9eef4; height: 2.05rem; }
.forecast-actual-matrix .forecast-actual-subheader th { background: #f4f7fa; height: 2rem; top: 2.05rem; }
.forecast-actual-matrix .is-account { left: 0; min-width: 10.5rem; width: 10.5rem; }
.forecast-actual-matrix .is-rep { left: 10.5rem; min-width: 8rem; width: 8rem; }
.forecast-actual-matrix thead .is-account,
.forecast-actual-matrix thead .is-rep { background: #dfe8f1; z-index: 11; }
.forecast-actual-matrix tbody .is-account,
.forecast-actual-matrix tbody .is-rep { background: #f8fafc; position: sticky; z-index: 4; }
.forecast-actual-matrix tbody tr:nth-child(odd) .is-account,
.forecast-actual-matrix tbody tr:nth-child(odd) .is-rep { background: #fff; }
.forecast-actual-matrix tbody tr:nth-child(even) .is-account,
.forecast-actual-matrix tbody tr:nth-child(even) .is-rep { background: #f8f7f5; }
.forecast-actual-matrix tbody tr:hover .is-account,
.forecast-actual-matrix tbody tr:hover .is-rep { background: #f3f1ee; }
.forecast-actual-matrix tbody tr[aria-selected="true"] .is-account,
.forecast-actual-matrix tbody tr[aria-selected="true"] .is-rep { background: #eaf2fb; }
.forecast-actual-matrix tbody .is-account { box-shadow: 1px 0 0 var(--oj-core-divider-color); font-size: .82rem; text-align: left; }
.forecast-actual-matrix tbody .is-rep { box-shadow: 2px 0 5px rgb(22 43 66 / 10%); font-size: .76rem; font-weight: 700; }
.forecast-actual-matrix .forecast-actual-period-group { min-width: 28rem; width: 28rem; }
.forecast-actual-matrix .forecast-actual-month-subhead,
.forecast-actual-matrix .forecast-actual-month-value { min-width: 6.25rem; width: 6.25rem; }
.forecast-actual-matrix .forecast-actual-month-subhead.is-difference,
.forecast-actual-matrix .forecast-actual-month-value.is-difference,
.forecast-actual-matrix .forecast-actual-month-subhead.is-status,
.forecast-actual-matrix .forecast-actual-month-value.is-status { min-width: 7.75rem; width: 7.75rem; }
.forecast-actual-matrix .forecast-actual-month-subhead.is-status,
.forecast-actual-matrix .forecast-actual-month-value.is-status { text-align: center; }
.forecast-actual-status-cell { text-align: center; }
.forecast-actual-status-cell small { color: var(--oj-core-text-color-secondary); display: block; font-size: .68rem; line-height: 1.25; margin-top: .22rem; white-space: normal; }
.forecast-actual-number,
.forecast-actual-month-value { font-variant-numeric: tabular-nums; text-align: end; white-space: nowrap; }
.forecast-actual-month-value small { color: var(--oj-core-text-color-secondary); display: block; font-size: .65rem; line-height: 1.25; margin-top: .12rem; white-space: normal; }
.forecast-actual-month-value.is-provisional { background: color-mix(in srgb, var(--oj-core-brand-color-1) 5%, white); }
.forecast-actual-month-value.is-empty { color: var(--oj-core-text-color-secondary); }
.forecast-actual-status { align-items: center; border: 1px solid transparent; border-radius: 999px; display: inline-flex; font-size: .66rem; font-weight: 800; justify-content: center; min-width: 3.7rem; padding: .2rem .38rem; text-align: center; }
.forecast-actual-status.is-on-track { background: #e7f4ea; border-color: #92c39d; color: #216e39; }
.forecast-actual-status.is-shortfall { background: #fce8e6; border-color: #dc9a92; color: #8f2417; }
.forecast-actual-status.is-projection-watch { background: #fff3d8; border-color: #e3bd57; color: #765200; }
.forecast-actual-status.is-unavailable { background: #f0f1f3; border-color: #c9ccd1; color: #5d6470; }
.forecast-actual-empty { color: var(--oj-core-text-color-secondary); min-height: 5rem; text-align: center; }
@media (max-width: 1000px) {
  .forecast-actual-header { align-items: stretch; flex-direction: column; }
  .forecast-actual-toolbar { justify-content: flex-start; width: 100%; }
  .forecast-actual-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .forecast-actual-toolbar { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); }
  .forecast-actual-control,
  .forecast-actual-search-panel { width: 100%; }
  .forecast-actual-mtd-control { flex-wrap: wrap; }
  .forecast-actual-summary { grid-template-columns: 1fr 1fr; }
  .forecast-actual-matrix .is-account { min-width: 8.5rem; width: 8.5rem; }
  .forecast-actual-matrix .is-rep { display: table-cell; left: 8.5rem; min-width: 7rem; width: 7rem; }
}

/* Actual vs Forecast follow-up: stable filters, accessible explanations, and readable columns. */
.forecast-actual-page { max-height: 100%; min-height: min(44rem, calc(100vh - 7rem)); overflow-x: hidden; overflow-y: auto; padding-bottom: 1.5rem; }
.forecast-actual-control select,
.forecast-actual-search-panel input,
.forecast-actual-pillar .consumption-pillar-selector button { height: 2.15rem; min-height: 2.15rem; }
.forecast-actual-mtd-control,
.consumption-analysis-mtd-control {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
  min-height: 2.15rem;
}
.forecast-actual-mtd-control > .consumption-mtd-applied-date,
.consumption-analysis-mtd-control > .consumption-mtd-applied-date { order: 1; }
.forecast-actual-mtd-control > .kpi-section-label,
.consumption-analysis-mtd-control > .kpi-section-label { order: 2; }
.forecast-actual-mtd-control > .consumption-mtd-switch,
.consumption-analysis-mtd-control > .consumption-mtd-switch { order: 3; }
.forecast-actual-summary article,
.forecast-actual-problem-card { position: relative; padding-inline-end: 2rem; }
.forecast-actual-card-action {
  align-items: flex-start;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  font: inherit;
  min-height: 100%;
  padding: 0;
  text-align: start;
  width: 100%;
}
.forecast-actual-info-trigger {
  align-items: center;
  background: transparent;
  border: 1px solid currentColor;
  border-radius: 50%;
  color: var(--oj-core-text-color-secondary);
  cursor: help;
  display: inline-flex;
  font: 800 11px/1 Arial, sans-serif;
  height: 1.125rem;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: .55rem;
  top: .5rem;
  width: 1.125rem;
  z-index: 3;
}
.forecast-actual-info-trigger::after {
  background: #24272c;
  border-radius: .35rem;
  color: #fff;
  content: attr(data-tooltip);
  font: 500 .75rem/1.4 var(--oj-core-font-family, Arial, sans-serif);
  max-width: min(22rem, calc(100vw - 2rem));
  opacity: 0;
  padding: .55rem .65rem;
  pointer-events: none;
  position: absolute;
  right: -.15rem;
  text-align: start;
  top: calc(100% + .4rem);
  transform: translateY(-.15rem);
  transition: opacity .12s ease, transform .12s ease;
  visibility: hidden;
  white-space: normal;
  width: max-content;
  z-index: 20;
}
.forecast-actual-info-trigger:hover::after,
.forecast-actual-info-trigger:focus::after {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
}
.forecast-actual-info-trigger:focus-visible { outline: 2px solid var(--oj-core-focus-border-color, #0572ce); outline-offset: 2px; }
.forecast-actual-card-highlight { color: inherit; font-size: inherit; font-weight: 800; }
.forecast-actual-summary .is-forecast > span,
.forecast-actual-summary .is-forecast > strong { color: #0b6f85; }
.forecast-actual-summary article:nth-child(2) > span,
.forecast-actual-summary article:nth-child(2) > strong,
.forecast-actual-month-value.is-provisional > small.is-mtd-label,
.forecast-actual-problem-card.is-final-shortfall .forecast-actual-card-action > span,
.forecast-actual-problem-card.is-final-shortfall .forecast-actual-card-action > strong { color: #9d2b27; }
.forecast-actual-month-value.is-provisional > small.is-mtd-label { background: #fff0ef; border-color: #e7aaa7; }
.forecast-actual-problem-card.is-mtd-shortfall .forecast-actual-card-action > span,
.forecast-actual-problem-card.is-mtd-shortfall .forecast-actual-card-action > strong { color: #765000; }
.forecast-actual-matrix .forecast-actual-month-subhead.is-forecast,
.forecast-actual-matrix .forecast-actual-month-value.is-forecast { background: #edf7f9; }
.forecast-actual-matrix .forecast-actual-month-subhead.is-actual,
.forecast-actual-matrix .forecast-actual-month-value.is-actual { background: #fff3f1; }
.forecast-actual-matrix .forecast-actual-month-subhead.is-difference,
.forecast-actual-matrix .forecast-actual-month-value.is-difference { background: #f1f4f7; }
.forecast-actual-matrix .forecast-actual-month-subhead.is-status,
.forecast-actual-matrix .forecast-actual-month-value.is-status { background: #f7f5eb; }
.forecast-actual-month-value.is-empty,
.forecast-actual-month-value.is-difference.is-empty { text-align: center; }
.forecast-actual-status[data-tooltip] { cursor: help; position: relative; }
.forecast-actual-status[data-tooltip]::after {
  background: #24272c;
  border-radius: .35rem;
  color: #fff;
  content: attr(data-tooltip);
  font: 500 .75rem/1.4 var(--oj-core-font-family, Arial, sans-serif);
  left: 50%;
  max-width: min(22rem, calc(100vw - 2rem));
  opacity: 0;
  padding: .55rem .65rem;
  pointer-events: none;
  position: absolute;
  top: calc(100% + .4rem);
  transform: translate(-50%, -.15rem);
  transition: opacity .12s ease, transform .12s ease;
  visibility: hidden;
  white-space: normal;
  width: max-content;
  z-index: 30;
}
.forecast-actual-status[data-tooltip]:hover::after,
.forecast-actual-status[data-tooltip]:focus::after {
  opacity: 1;
  transform: translate(-50%, 0);
  visibility: visible;
}
.forecast-actual-status[data-tooltip]:focus-visible { outline: 2px solid var(--oj-core-focus-border-color, #0572ce); outline-offset: 2px; }
.consumption-initial-state { min-height: min(44rem, calc(100vh - 7rem)); }

/* Non-blocking JET fallback used only while the authenticated page surface has not mounted. */
.kap-app-loading {
  left: 0;
  pointer-events: none;
  position: fixed;
  right: 0;
  top: env(safe-area-inset-top);
  z-index: 4000;
}
.kap-app-loading oj-progress-bar { display: block; width: 100%; }
.kap-auth-checking { background: var(--oj-core-bg-color-page, #f4f6f8); }
.kap-auth-checking__header { box-sizing: border-box; }
.kap-auth-checking__header-bar { width: 100%; }
.kap-auth-checking__body,
.kap-auth-checking__content { min-height: 0; }
.kap-auth-checking__surface {
  background: var(--oj-core-bg-color-content, #fff);
  border: 1px solid var(--kpi-border);
  border-radius: .75rem;
  box-sizing: border-box;
  height: 100%;
  min-height: 0;
}
@media (max-width: 600px) {
  .forecast-actual-info-trigger::after { position: fixed; left: 1rem; right: 1rem; top: 4.5rem; width: auto; }
}

/* UI stability follow-up: keep document headings anchored while async data loads. */
.forecast-actual-page {
  align-content: start;
  grid-auto-rows: max-content;
}
.kpi-content:has(.consumption-initial-state),
.kpi-content:has(.consumption-insights-page),
.kpi-content:has(.weekly-activities-page),
.kpi-content:has(.consumption-page),
.kpi-content:has(.forecast-actual-page) {
  align-content: start;
  grid-auto-rows: max-content;
}
.consumption-initial-state {
  align-content: start;
  grid-auto-rows: max-content;
}

/* Forecast vs Actual compact matrix and accessible overlay controls. */
.forecast-actual-mtd-row { align-items: center; display: flex; gap: .5rem; min-height: 2.25rem; }
.forecast-actual-mtd-row .consumption-mtd-applied-date { white-space: nowrap; }
.forecast-actual-summary article { overflow: visible; }
.forecast-actual-matrix-shell { --forecast-rep-width: 7rem; --forecast-month-width: 5.5rem; --forecast-difference-width: 6.25rem; --forecast-status-width: 6.5rem; }
.forecast-actual-matrix th,
.forecast-actual-matrix td { width: auto; }
.forecast-actual-matrix col.forecast-actual-col-account { width: 10.5rem; }
.forecast-actual-matrix col.forecast-actual-col-rep { width: var(--forecast-rep-width); }
.forecast-actual-matrix col.forecast-actual-col-result { width: 7rem; }
.forecast-actual-matrix col.forecast-actual-col-month { width: var(--forecast-month-width); }
.forecast-actual-matrix col.forecast-actual-col-difference { width: var(--forecast-difference-width); }
.forecast-actual-matrix col.forecast-actual-col-status { width: var(--forecast-status-width); }
.forecast-actual-matrix .is-rep { min-width: var(--forecast-rep-width); text-align: center; width: var(--forecast-rep-width); }
.forecast-actual-matrix .forecast-actual-period-group {
  min-width: calc((2 * var(--forecast-month-width)) + var(--forecast-difference-width) + var(--forecast-status-width));
  width: calc((2 * var(--forecast-month-width)) + var(--forecast-difference-width) + var(--forecast-status-width));
}
.forecast-actual-matrix .forecast-actual-month-subhead,
.forecast-actual-matrix .forecast-actual-month-value { max-width: var(--forecast-month-width); min-width: var(--forecast-month-width); width: var(--forecast-month-width); }
.forecast-actual-matrix .forecast-actual-month-subhead.is-difference,
.forecast-actual-matrix .forecast-actual-month-value.is-difference { max-width: var(--forecast-difference-width); min-width: var(--forecast-difference-width); width: var(--forecast-difference-width); }
.forecast-actual-matrix .forecast-actual-month-subhead.is-status,
.forecast-actual-matrix .forecast-actual-month-value.is-status { max-width: var(--forecast-status-width); min-width: var(--forecast-status-width); width: var(--forecast-status-width); }
.forecast-actual-month-value.is-forecast,
.forecast-actual-month-value.is-actual,
.forecast-actual-month-value.is-difference { text-align: right; }
.forecast-actual-matrix-shell > .consumption-scroll-controls {
  flex-direction: column;
  left: auto;
  position: absolute;
  right: .35rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 12;
}
.forecast-actual-matrix-shell > .consumption-scroll-controls button:first-child { margin-inline-end: 0; }

.forecast-actual-loading { align-items: center; background: var(--oj-core-bg-color-neutral); border: 1px solid var(--oj-core-divider-color); border-radius: .55rem; color: var(--oj-core-text-color-secondary); display: flex; min-height: 6rem; padding: 1rem; }
.forecast-actual-value-badge { border: 1px solid currentColor; border-radius: 999px; display: inline-flex; font-size: .68rem; font-weight: 800; justify-content: center; line-height: 1; min-width: 2.75rem; padding: .3rem .5rem; }
.forecast-actual-value-badge.is-pending { background: #fff7e8; color: #8a5700; }
.forecast-actual-month-value.is-actual .forecast-actual-value-badge.is-pending { align-items: center; display: inline-grid; grid-template-rows: auto auto; row-gap: .05rem; }
.forecast-actual-value-badge.is-na { background: #f1f3f5; color: #5f6873; }

/* Forecast vs Actual quarter-result drilldown. */
.forecast-actual-total-strip {
  display: grid;
  gap: .4rem;
  grid-template-columns: repeat(2, minmax(7.75rem, 10.5rem));
}
.forecast-actual-total-strip span { align-items: baseline; background: var(--oj-core-bg-color-content); border: 1px solid var(--oj-core-divider-color); border-radius: .5rem; display: grid; gap: .08rem .3rem; grid-template-columns: 1fr auto; padding: .42rem .55rem; }
.forecast-actual-total-strip small { color: var(--oj-core-text-color-secondary); font-size: .62rem; grid-column: 1 / -1; }
.forecast-actual-total-strip strong { color: var(--oj-core-text-color-primary); font-size: .88rem; font-variant-numeric: tabular-nums; }
.forecast-actual-total-strip em { color: var(--oj-core-text-color-secondary); font-size: .55rem; font-style: normal; }
.forecast-actual-quarter-cards { display: grid; gap: .45rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.forecast-actual-quarter-cards article { background: var(--oj-core-bg-color-content); border: 1px solid var(--oj-core-divider-color); border-radius: .5rem; display: grid; gap: .42rem; min-width: 0; padding: .52rem; }
.forecast-actual-quarter-cards article.is-selected { border-color: var(--oj-core-brand-color-1); box-shadow: inset 0 0 0 1px var(--oj-core-brand-color-1); }
.forecast-actual-quarter-cards header { align-items: baseline; display: flex; gap: .4rem; justify-content: space-between; }
.forecast-actual-quarter-cards header > strong { font-size: 1rem; }
.forecast-actual-quarter-cards header > small { color: var(--oj-core-text-color-secondary); font-size: .65rem; }
.forecast-actual-quarter-totals { display: grid; gap: .35rem; grid-template-columns: 1fr 1fr; }
.forecast-actual-quarter-totals span { color: var(--oj-core-text-color-secondary); display: grid; font-size: .65rem; gap: .1rem; }
.forecast-actual-quarter-totals strong { color: var(--oj-core-text-color-primary); font-size: .8rem; font-variant-numeric: tabular-nums; }
.forecast-actual-quarter-actions { display: grid; gap: .3rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.forecast-actual-quarter-actions button { align-content: center; background: #f5f6f7; border: 1px solid var(--oj-core-divider-color); border-radius: .4rem; color: var(--oj-core-text-color-primary); cursor: pointer; display: grid; font: inherit; gap: .08rem; min-height: 2.75rem; min-width: 0; padding: .25rem .15rem; position: relative; text-align: center; }
.forecast-actual-quarter-actions button:disabled { cursor: default; opacity: .45; }
.forecast-actual-quarter-actions button:not(:disabled):hover,
.forecast-actual-quarter-actions button[aria-pressed="true"] { border-color: var(--oj-core-brand-color-1); box-shadow: inset 0 0 0 1px var(--oj-core-brand-color-1); }
.forecast-actual-quarter-actions button > span { font-size: .6rem; line-height: 1.1; }
.forecast-actual-quarter-actions button > strong { font-size: .78rem; font-variant-numeric: tabular-nums; }
.forecast-actual-quarter-actions button > small { color: var(--oj-core-text-color-secondary); font-size: .55rem; }
.forecast-actual-quarter-actions .is-shortfall { background: #fce8e6; color: #8f2417; }
.forecast-actual-quarter-actions .is-matched { background: #e7f4ea; color: #216e39; }
.forecast-actual-quarter-actions .is-exceeded { background: #edf7f9; color: #0b6f85; }
.forecast-actual-result-filter { align-items: center; background: color-mix(in srgb, var(--oj-core-brand-color-1) 7%, white); border: 1px solid color-mix(in srgb, var(--oj-core-brand-color-1) 35%, var(--oj-core-divider-color)); border-radius: .45rem; display: flex; font-size: .72rem; font-weight: 700; gap: .6rem; justify-content: space-between; padding: .4rem .55rem; }
.forecast-actual-result-filter button { background: transparent; border: 0; color: var(--oj-core-brand-color-1); cursor: pointer; font: inherit; padding: .25rem; text-decoration: underline; }
.forecast-actual-matrix .is-quarter-result { left: 18.5rem; min-width: 7rem; width: 7rem; }
.forecast-actual-matrix thead .is-quarter-result { background: #dfe8f1; z-index: 11; }
.forecast-actual-matrix tbody .is-quarter-result { background: #f8fafc !important; background-clip: padding-box; box-shadow: 2px 0 5px rgb(22 43 66 / 10%); isolation: isolate; position: sticky; text-align: center; z-index: 6; }
.forecast-actual-quarter-result { align-items: center; border: 1px solid currentColor; border-radius: .35rem; display: inline-flex; flex-direction: column; font-size: .62rem; gap: .08rem; line-height: 1.15; min-width: 5.7rem; padding: .25rem .3rem; position: relative; }
.forecast-actual-quarter-result small { font-size: .6rem; font-variant-numeric: tabular-nums; }
.forecast-actual-quarter-result.is-shortfall { background: #fce8e6; color: #8f2417; }
.forecast-actual-quarter-result.is-matched { background: #e7f4ea; color: #216e39; }
.forecast-actual-quarter-result.is-exceeded { background: #edf7f9; color: #0b6f85; }
.forecast-actual-quarter-result.is-no_forecast,
.forecast-actual-quarter-result.is-missing_actual,
.forecast-actual-quarter-result.is-partial_actual,
.forecast-actual-quarter-result.is-future { background: #f0f1f3; color: #5d6470; }
@media (max-width: 1000px) {
  .forecast-actual-quarter-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .forecast-actual-total-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forecast-actual-quarter-cards { grid-template-columns: minmax(0, 1fr); }
  .forecast-actual-matrix .is-account { min-width: 8.5rem; width: 8.5rem; }
  .forecast-actual-matrix .is-rep { left: 8.5rem; }
  .forecast-actual-matrix .is-quarter-result { left: 15.5rem; }
}

/* Reserve the application footer and scroll only the legacy attainment workspace.
   KPI spreadsheets now use the common viewport-bound PageShell contract below. */
.kpi-content:has(.attainment-page) {
  height: calc(100dvh - 4rem - var(--kpi-footer-reserved-height) - 3rem);
  min-height: 0;
  overflow: hidden;
}
.kpi-spreadsheet-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
.kpi-overview-scroll-area {
  display: grid;
  flex: 1 1 auto;
  gap: .5rem;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: max-content repeat(2, minmax(0, 1fr));
  min-height: 0;
  overflow: hidden;
  overscroll-behavior: contain;
}
.kpi-overview-metrics { flex: 0 0 auto; }
.kpi-overview-metrics > button { gap: .15rem; padding: .45rem; }
.kpi-overview-metrics > button span { font-size: .72rem; }
.kpi-overview-metrics > button strong { font-size: 1.2rem; line-height: 1.1; }
.kpi-overview-metrics > button small {
  font-size: .66rem;
  line-height: 1.1;
  min-height: 1.1em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kpi-overview-filtered-activities__heading { margin-bottom: .2rem; }
.kpi-overview-filtered-activities__heading h3,
.kpi-overview-portfolio__heading h3 { font-size: .85rem; margin: 0 0 .2rem; }
.kpi-overview-filtered-activities__heading > button { padding: .2rem .45rem; }
.kpi-overview-filtered-activities th,
.kpi-overview-filtered-activities td,
.kpi-overview-portfolio th,
.kpi-overview-portfolio td { padding-block: .35rem; }
.kpi-overview-metrics + .kpi-overview-portfolio { grid-row: 2 / -1; }
.kpi-overview-filtered-activities {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  margin-top: 0;
  min-height: 0;
}
.kpi-overview-filtered-activities__table-wrap {
  flex: 1 1 auto;
  max-height: none;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.kpi-overview-portfolio {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  margin-top: 0;
  min-height: 0;
}
.kpi-overview-portfolio__table-wrap {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.kpi-overview-portfolio th {
  background: var(--kap-grid-header-bg);
  position: sticky;
  top: 0;
  z-index: 1;
}
.kpi-spreadsheet-page .kpi-activities-table-wrap {
  block-size: 0;
  flex: 1 1 16rem;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.attainment-page {
  box-sizing: border-box;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

@media (max-width: 720px) {
  .forecast-actual-matrix-shell { --forecast-rep-width: 6.5rem; --forecast-month-width: 5.25rem; --forecast-difference-width: 6rem; --forecast-status-width: 6.25rem; }
  .forecast-actual-matrix-shell > .consumption-scroll-controls { flex-direction: row; left: .2rem; right: .2rem; top: 50%; }
  .kpi-overview-scroll-area { gap: .35rem; }
  .kpi-overview-metrics {
    gap: .2rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .kpi-overview-metrics > button { gap: 0; padding: .2rem; }
  .kpi-overview-metrics > button span { font-size: .55rem; line-height: 1; }
  .kpi-overview-metrics > button strong { font-size: .95rem; line-height: 1; }
  .kpi-overview-metrics > button small {
    block-size: 1px;
    clip-path: inset(50%);
    inline-size: 1px;
    min-height: 0;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
  }
  .kpi-overview-filtered-activities header { margin-bottom: .15rem; }
  .kpi-overview-filtered-activities header > div { gap: .15rem; }
  .kpi-overview-filtered-activities h3,
  .kpi-overview-portfolio h3 { font-size: .75rem; line-height: 1; margin: 0 0 .15rem; }
  .kpi-overview-filtered-activities header span { font-size: .6rem; }
  .kpi-overview-filter-clear { font-size: .62rem; min-height: 1.4rem; padding: .1rem .3rem; }
  .kpi-overview-filtered-activities table,
  .kpi-overview-portfolio table { font-size: .68rem; line-height: 1.1; }
  .kpi-overview-filtered-activities th,
  .kpi-overview-filtered-activities td,
  .kpi-overview-portfolio th,
  .kpi-overview-portfolio td { padding-block: .2rem; }
  .kpi-content:has(.attainment-page) { height: calc(100dvh - 4.5rem - var(--kpi-footer-reserved-height) - 1.5rem); }
}

/* Calendar and Meeting Notes — app-owned Redwood layout; no JET-internal selectors. */
.kpi-shell:has(.calendar-page) { padding-bottom: 0; }
.kpi-shell:has(.calendar-page) .kpi-footer {
  position: static;
  inset: auto;
  z-index: auto;
  margin-top: 1rem;
}

.calendar-page, .meeting-notes-page { min-width: 0; }
.calendar-page-card { background: #fff; border-radius: 1rem; box-shadow: 0 .15rem .6rem rgb(20 26 33 / 7%); overflow: hidden; }
.calendar-page-card > .calendar-toolbar { padding: 1.25rem 1.25rem .75rem; }
.calendar-page-card > .calendar-surface { border: 0; border-radius: 0; box-shadow: none; }
.calendar-event__text { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; }
.calendar-day.is-selected { background: #f2f6f8; }
.calendar-day:focus-visible { box-shadow: inset 0 0 0 2px #245b83; outline: 0; }
.calendar-legend span { align-items: center; display: inline-flex; gap: .3rem; }
.calendar-legend__swatch { border: 1px solid rgb(0 0 0 / 18%); border-radius: .15rem; cursor: pointer; height: .72rem; min-height: 0; padding: 0; width: .72rem; }
.calendar-day-detail { background: #fff; border-top: 1px solid var(--kpi-border); padding: 1.25rem; }
.calendar-day-detail > header { align-items: end; display: flex; gap: .75rem; justify-content: space-between; margin-bottom: 1rem; }
.calendar-day-detail > header div { display: grid; gap: .15rem; }
.calendar-day-detail > header span, .calendar-day-detail > header small { color: var(--kpi-muted); }
.calendar-day-undated { border-bottom: 1px solid var(--kpi-border); border-top: 1px solid var(--kpi-border); }
.calendar-day-undated__lane, .calendar-day-slot { display: grid; grid-template-columns: 5.5rem 1fr; min-height: 3rem; }
.calendar-day-undated__lane + .calendar-day-undated__lane, .calendar-day-slot + .calendar-day-slot { border-top: 1px solid var(--kpi-border); }
.calendar-day-undated__lane > span, .calendar-day-slot > time { color: var(--kpi-muted); font-size: .75rem; padding: .8rem .6rem; }
.calendar-day-undated__lane button, .calendar-day-slot button, .calendar-weekly-activity { background: #edf7f4; border: 0; border-radius: .35rem; color: #194d42; margin: .35rem; padding: .4rem .55rem; text-align: left; }
.calendar-day-undated__lane .calendar-detail-event, .calendar-day-slot .calendar-detail-event { background: color-mix(in srgb, var(--owner-color) 12%, white); border-left: .2rem solid var(--owner-color); color: color-mix(in srgb, var(--owner-color) 75%, black); }
.calendar-day-timeline { max-height: 31rem; overflow-y: auto; }
.calendar-day-slot > div { border-left: 1px solid var(--kpi-border); min-height: 3rem; }
.calendar-inline-editor { background: #fbfbfa; border-top: 1px solid var(--kpi-border); padding: 1rem 1.25rem 1.25rem; }
.calendar-inline-editor > header, .calendar-inline-editor > footer { align-items: center; display: flex; gap: .5rem; justify-content: space-between; }
.calendar-inline-editor > footer span { flex: 1; }
.calendar-inline-editor button, .calendar-weekly-popup button { background: #fff; border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); cursor: pointer; min-height: 2.25rem; padding: .35rem .65rem; }
.calendar-inline-editor button.primary { background: var(--kpi-brand); color: #fff; }
.calendar-inline-editor__menu { display: flex; gap: .35rem; position: relative; }
.calendar-options-popover { background: #fff; border: 1px solid var(--kpi-border); border-radius: .5rem; box-shadow: 0 .4rem 1rem rgb(0 0 0 / 12%); display: grid; gap: .5rem; padding: .75rem; position: absolute; right: 2.7rem; top: 100%; width: 9rem; z-index: 4; }
.calendar-inline-title { align-items: end; display: grid; gap: .75rem; grid-template-columns: auto 1fr; position: relative; }
.calendar-time-kind { display: flex; }
.calendar-time-kind button + button { margin-left: -.05rem; }
.calendar-time-kind button.is-selected { background: #e8f0f5; color: #174a70; font-weight: 700; }
.calendar-related-token { color: #174a70; font-weight: 800; }
.calendar-title-search { background: #fff; border: 1px solid var(--kpi-border); box-shadow: 0 .3rem .8rem rgb(0 0 0 / 15%); display: grid; left: 8rem; max-height: 12rem; overflow: auto; position: absolute; right: 0; top: 100%; z-index: 5; }
.calendar-title-search button { border: 0; border-radius: 0; text-align: left; }
.calendar-title-search button[aria-selected="true"] { background: #e8f0f5; }
.calendar-event-relations { align-items: center; display: flex; gap: .25rem; grid-column: 2 / -1; min-width: 0; overflow: hidden; white-space: nowrap; }
.calendar-event-relations button, .calendar-event-relations span { background: none; border: 0; color: #174a70; font: inherit; font-weight: 700; min-height: 0; overflow: hidden; padding: 0; text-overflow: ellipsis; white-space: nowrap; }
.calendar-event-relations button:hover { text-decoration: underline; }
.calendar-event__time { color: var(--kpi-muted); font-size: .65rem; white-space: nowrap; }
.calendar-mention-editor { background: #fff; border: 1px solid var(--kpi-border); border-radius: .4rem; box-shadow: 0 .5rem 1.4rem rgb(0 0 0 / 22%); display: grid; gap: .4rem; left: 50%; max-height: min(28rem, 80vh); padding: .65rem; position: fixed; top: 20%; transform: translateX(-50%); width: min(28rem, calc(100vw - 2rem)); z-index: 10010; }
.calendar-mention-editor header { align-items: center; display: flex; justify-content: space-between; }
.calendar-mention-editor header button { border: 0; min-height: 1.75rem; padding: .1rem .4rem; }
.calendar-mention-editor input, .calendar-mention-editor select { box-sizing: border-box; width: 100%; }
.calendar-mention-editor__results { display: grid; max-height: 18rem; overflow: auto; }
.calendar-mention-editor__results button { align-items: start; border: 0; border-radius: 0; display: grid; text-align: left; }
.calendar-mention-editor__results button[aria-selected="true"] { background: #e8f0f5; }
.calendar-mention-editor__participant { align-items: center; background: #fff; border: 0; border-bottom: 1px solid var(--kpi-border); border-radius: 0; cursor: pointer; display: grid; gap: .55rem; grid-template-columns: 1.1rem 1fr; min-height: 2.75rem; padding: .35rem .45rem; text-align: left; }
.calendar-mention-editor__participant.is-selected { background: #e8f0f5; }
.calendar-mention-editor__participant input[type="checkbox"] { height: 1rem; margin: 0; width: 1rem; }
.calendar-mention-editor__participant span:last-child { display: grid; }
.calendar-mention-editor__results small { color: var(--kpi-muted); }
.calendar-color-palette { align-items: center; display: flex; flex-wrap: wrap; gap: .25rem; }
.calendar-color-palette > button { border: 2px solid transparent; border-radius: .25rem; height: 1.35rem; min-height: 0; padding: 0; width: 1.35rem; }
.calendar-color-palette > button.is-selected { border-color: #111; }
.calendar-color-palette label { align-items: center; display: inline-flex; font-size: .72rem; gap: .2rem; }
.calendar-weekly-popup { background: #fff; border-radius: 1rem; box-shadow: 0 1rem 3rem rgb(0 0 0 / 25%); max-height: calc(100dvh - 2rem); overflow: auto; padding: 1rem; width: min(42rem, 100%); }
.calendar-weekly-popup > header { align-items: center; display: flex; justify-content: space-between; }
.calendar-weekly-popup > div { display: grid; gap: .65rem; }
.calendar-weekly-popup__text { overflow-wrap: anywhere; }

/* The day is one centered, Apple-like editing surface: no secondary panel below the month. */
.calendar-day-dialog { background: #fff; border: 1px solid rgb(255 255 255 / 60%); border-radius: 1.25rem; box-shadow: 0 1.5rem 5rem rgb(12 22 31 / 28%); display: flex; flex-direction: column; max-height: calc(100dvh - 2rem); overflow: hidden; width: min(58rem, 100%); }
.calendar-day-dialog > header { align-items: center; border-bottom: 1px solid var(--kpi-border); display: flex; justify-content: space-between; padding: .8rem 1rem; }
.calendar-day-dialog > header h2, .calendar-day-dialog > header h3 { font-size: 1.15rem; margin: 0; }
.calendar-day-dialog > header > div { display: grid; gap: .1rem; }
.calendar-day-dialog > header span { color: var(--kpi-muted); font-size: .72rem; }
.calendar-day-dialog > header button { background: #f2f3f3; border: 0; border-radius: 50%; cursor: pointer; font-size: 1.15rem; height: 2rem; width: 2rem; }
.calendar-day-dialog__body { max-height: calc(100dvh - 7rem); overflow: hidden; padding: .8rem 1rem 1rem; }
.calendar-day-dialog__close { background: #f2f3f3; border: 0; border-radius: .35rem; cursor: pointer; float: right; font-size: .76rem; margin: .2rem .35rem 0 0; min-height: 2rem; padding: .3rem .65rem; }
.calendar-day-dialog__close:hover { background: #e4e7e7; }
.calendar-day-dialog__hint { color: var(--kpi-muted); font-size: .72rem; margin: .45rem 0; }
.calendar-day-dialog .calendar-day-detail { border: 0; display: grid; grid-template-rows: max-content minmax(0, 1fr); max-height: calc(100dvh - 8rem); overflow: hidden; padding: .8rem 1rem 1rem; }
.calendar-day-undated { background: #f7f8f8; border: 1px solid var(--kpi-border); border-radius: .65rem; display: grid; gap: .35rem; margin-bottom: .75rem; padding: .55rem; }
.calendar-day-undated__heading { align-items: baseline; display: flex; gap: .6rem; }
.calendar-day-undated__heading span { color: var(--kpi-muted); font-size: .72rem; }
.calendar-day-blank-row { display: grid; grid-template-columns: 7rem 1fr; }
.calendar-day-blank-row input, .calendar-day-blank-row select { background: #fff; border: 1px dashed #9aa5ad; min-height: 2.5rem; padding: .45rem; }
.calendar-day-undated__events { display: grid; gap: .25rem; }
.calendar-day-undated__events .calendar-detail-event { background: color-mix(in srgb, var(--owner-color) 12%, white); border: 0; border-left: .2rem solid var(--owner-color); border-radius: .35rem; color: inherit; cursor: pointer; padding: .4rem .55rem; text-align: left; }
.calendar-day-undated__events .is-cancelled { text-decoration: line-through; }
.calendar-all-day { background: #f7f8f8; border: 1px solid var(--kpi-border); border-radius: .65rem; display: grid; gap: .35rem; margin-bottom: .75rem; padding: .55rem; }
.calendar-all-day__blank { background: #fff; border: 1px dashed #9aa5ad; border-radius: .45rem; color: var(--kpi-muted); cursor: text; min-height: 2.5rem; padding: .55rem .7rem; text-align: left; }
.calendar-all-day__event { background: color-mix(in srgb, var(--owner-color) 12%, white); border: 0; border-left: .2rem solid var(--owner-color); border-radius: .35rem; color: inherit; cursor: pointer; padding: .45rem .55rem; text-align: left; }
.calendar-day-timeline-scroll { min-height: 0; overflow-x: hidden; overflow-y: auto; }
.calendar-day-timeline--interactive { background: repeating-linear-gradient(to bottom, transparent 0, transparent 9px, #f0f1f2 10px), repeating-linear-gradient(to bottom, transparent 0, transparent 59px, #d8dcdf 60px); border: 1px solid var(--kpi-border); border-radius: .65rem; height: 540px; min-height: 540px; overflow: hidden; position: relative; touch-action: auto; }
.calendar-long-press-active .calendar-day-dialog__body, .calendar-long-press-active .calendar-day-dialog .calendar-day-detail { overflow: hidden; overscroll-behavior: none; }
.calendar-long-press-active .calendar-day-timeline--interactive { cursor: ns-resize; touch-action: none; }
.calendar-create-preview { background: color-mix(in srgb, #245b83 22%, white); border: 2px solid #245b83; border-radius: .45rem; color: #173b55; display: grid; left: 4.5rem; min-height: 10px; overflow: hidden; padding: .2rem .45rem; pointer-events: none; position: absolute; right: .5rem; z-index: 9; }
.calendar-create-preview span { font-size: .7rem; }
.calendar-create-row-preview { align-items: center; background: #e9f2f8; border: 2px solid #245b83; border-radius: .45rem; color: #173b55; display: flex; gap: .65rem; min-height: 2.5rem; padding: .4rem .6rem; pointer-events: none; }
.calendar-create-row-preview span { font-size: .75rem; }
.calendar-create-touch-tooltip { background: #172b3a; border-radius: .35rem; box-shadow: 0 .4rem 1rem rgb(0 0 0 / 24%); color: #fff; font-size: .75rem; font-weight: 700; padding: .32rem .5rem; pointer-events: none; position: fixed; transform: translate(-50%, calc(-100% - 1rem)); white-space: nowrap; z-index: 1000; }
.calendar-day-hour { border-top: 1px solid #d8dcdf; color: var(--kpi-muted); font-size: .68rem; left: 0; pointer-events: none; position: absolute; right: 0; }
.calendar-day-hour time { background: #fff; padding: 0 .35rem; }
.calendar-time-cursor { border-top: 2px solid #245b83; left: 4.5rem; pointer-events: none; position: absolute; right: 0; z-index: 8; }
.calendar-time-cursor span { background: #245b83; border-radius: .25rem; color: #fff; font-size: .68rem; left: 0; padding: .12rem .35rem; position: absolute; transform: translate(-100%, -55%); }
.calendar-timeline-hour { color: var(--kpi-muted); font-size: .68rem; left: .4rem; position: absolute; transform: translateY(-.45rem); }
.calendar-timeline-hover { background: #245b83; color: #fff; font-size: .68rem; left: 4rem; padding: .12rem .35rem; pointer-events: none; position: absolute; transform: translateY(-50%); z-index: 8; }
.calendar-timeline-event { background: color-mix(in srgb, var(--owner-color) 16%, white); border: 1px solid color-mix(in srgb, var(--owner-color) 40%, white); border-left: .22rem solid var(--owner-color); border-radius: .42rem; color: color-mix(in srgb, var(--owner-color) 78%, black); cursor: pointer; left: calc(4.1rem + (100% - 4.5rem) * var(--column) / var(--columns)); min-height: 20px; overflow: visible; padding: .18rem .4rem; position: absolute; text-align: left; top: var(--top); width: calc((100% - 4.5rem) / var(--columns) - .2rem); z-index: 2; }
.calendar-timeline-event.is-editable { touch-action: none; }
.calendar-timeline-event:hover, .calendar-timeline-event:focus-within { z-index: 6; }
.calendar-timeline-event.is-editable { touch-action: none; }
.calendar-timeline-event > strong, .calendar-timeline-event > small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-timeline-editor { left: 4.5rem; min-height: 20px; position: absolute; right: .5rem; z-index: 12; }
.calendar-timeline-event.is-cancelled { filter: grayscale(.65); text-decoration: line-through; }
.calendar-timeline-event__time { display: block; font-size: .65rem; font-weight: 400; }
.calendar-resize-handle { background: transparent !important; border: 0 !important; border-radius: 0 !important; cursor: ns-resize; height: 6px; left: 0; min-height: 0 !important; padding: 0 !important; position: absolute; right: 0; touch-action: none; width: 100%; z-index: 3; }
.calendar-timeline-event.is-touch-compact .calendar-resize-handle { left: auto; width: 44px; max-width: 45%; }
.calendar-resize-handle::after { background: color-mix(in srgb, var(--owner-color, #245b83) 70%, white); border-radius: 999px; content: ""; height: 2px; left: 40%; position: absolute; right: 40%; }
.calendar-resize-handle--start { top: 0; }
.calendar-resize-handle--start::after { top: 2px; }
.calendar-resize-handle--end { bottom: 0; }
.calendar-resize-handle--end::after { bottom: 2px; }
.calendar-timeline-event.is-touch-compact { padding-right: 48px; }
.calendar-timeline-event.is-touch-compact .calendar-resize-handle { height: 50%; left: auto; right: 0; width: 44px; }
.calendar-timeline-event.is-touch-compact .calendar-resize-handle--start { bottom: auto; top: 0; }
.calendar-timeline-event.is-touch-compact .calendar-resize-handle--end { bottom: 0; top: auto; }
.calendar-inline-editor--block.calendar-block-editor { background: color-mix(in srgb, #245b83 14%, white); border: 2px solid #245b83; border-left-width: .28rem; border-radius: .45rem; box-shadow: 0 .35rem 1rem rgb(20 26 33 / 18%); color: #173b55; cursor: grab; height: 100%; min-height: 20px; min-width: 0; overflow: visible; padding: .18rem .35rem; position: relative; text-decoration: none; touch-action: none; width: 100%; z-index: 10; }
.calendar-block-editor:active { cursor: grabbing; }
.calendar-block-editor__head { align-items: center; display: flex; gap: .2rem; justify-content: space-between; min-height: .95rem; }
.calendar-block-editor__time { font-size: .6rem; font-weight: 700; line-height: 1; white-space: nowrap; }
.calendar-block-editor__actions { display: flex; flex-wrap: wrap; gap: .15rem; justify-content: flex-end; margin-left: auto; }
.calendar-block-editor__actions > button { background: rgb(255 255 255 / 72%); border: 0; border-radius: .25rem; color: #173b55; cursor: pointer; font-size: .62rem; height: 1.15rem; min-height: 0; padding: 0 .28rem; white-space: nowrap; }
.calendar-block-editor__title { background: transparent; border: 0; border-bottom: 1px solid rgb(36 91 131 / 36%); border-radius: 0; color: #173b55; font: inherit; font-size: .82rem; font-weight: 800; line-height: 1.3; min-height: 1.4rem; outline: none; padding: 0 .12rem; touch-action: auto; width: 100%; }
.calendar-block-editor__title:focus { background: rgb(255 255 255 / 58%); border-bottom-color: #245b83; }
.calendar-block-editor__title--selected { border-bottom-color: transparent; cursor: pointer; display: block; min-height: 1.4rem; overflow: hidden; padding: .08rem .12rem; text-overflow: ellipsis; white-space: nowrap; }
.calendar-block-editor .calendar-event-relations { display: flex; flex-wrap: wrap; font-size: .68rem; gap: .2rem; line-height: 1.2; }
.calendar-block-editor__search { left: 0; position: absolute; right: 0; top: calc(100% + .2rem); z-index: 20; }
.calendar-block-editor__search .calendar-title-search { background: #fff; border: 1px solid var(--kpi-border); border-radius: .4rem; box-shadow: 0 .4rem 1rem rgb(0 0 0 / 16%); display: grid; left: 0; max-height: 12rem; overflow-y: auto; position: static; top: auto; width: 100%; }
.calendar-block-editor__search .calendar-title-search button { background: #fff; border: 0; border-bottom: 1px solid var(--kpi-border); border-radius: 0; color: var(--kpi-ink); cursor: pointer; min-height: 2rem; padding: .35rem .5rem; text-align: left; }
.calendar-block-editor .calendar-sharing-readonly, .calendar-block-editor .app-message { display: block; font-size: .68rem; margin-top: .2rem; padding: .2rem; }
.calendar-block-editor .calendar-recurrence-fields { background: #fff; border: 1px solid var(--kpi-border); border-radius: .4rem; box-shadow: 0 .4rem 1rem rgb(0 0 0 / 16%); display: grid; gap: .35rem; padding: .55rem; position: absolute; right: 0; top: calc(100% + .25rem); width: min(18rem, calc(100vw - 3rem)); z-index: 18; }
.calendar-block-editor .calendar-recurrence-fields > label { align-items: center; display: grid; font-size: .72rem; gap: .35rem; grid-template-columns: minmax(5.25rem, auto) minmax(0, 1fr); }
.calendar-block-editor .calendar-recurrence-fields > label:first-child { display: flex; }
.calendar-block-editor .calendar-recurrence-fields > button.primary { background: #245b83; color: #fff; justify-self: end; min-width: 4.5rem; }
.calendar-block-editor .calendar-recurrence-fields input:not([type="checkbox"]), .calendar-block-editor .calendar-recurrence-fields select { box-sizing: border-box; max-width: 100%; min-height: 2rem; width: 100%; }
.calendar-timeline-event--editor { height: 100%; min-height: 20px; overflow: visible; width: 100%; z-index: 10; }
.calendar-toolbar { align-items: center; display: grid; gap: 1rem; grid-template-columns: minmax(12rem, 1fr) auto; }
.calendar-toolbar label, .kap-field { color: var(--kpi-muted); display: grid; font-size: .75rem; font-weight: 700; gap: .3rem; }
.calendar-toolbar select, .kap-field input, .kap-field select, .kap-field textarea,
.calendar-sharing input, .calendar-sharing select { background: #fff; border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); color: var(--kpi-ink); font: inherit; min-height: 2.5rem; padding: .5rem; width: 100%; }
.calendar-toolbar__month { align-items: center; display: flex; flex-wrap: wrap; gap: .4rem; justify-content: flex-end; }
.calendar-toolbar__month button, .calendar-mobile-add, .calendar-sharing button, .local-recorder button, .meeting-note-ai-notice button, .kap-modal button, .codex-auth-status, .meeting-note-view__actions button { background: #fff; border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); color: var(--kpi-ink); cursor: pointer; font: inherit; min-height: 2.25rem; padding: .35rem .65rem; }
.calendar-toolbar__today { color: var(--kpi-brand) !important; font-weight: 800 !important; }
.calendar-mobile-add { display: none; }
.calendar-surface { background: #fff; border: 1px solid var(--kpi-border); border-radius: 1rem; box-shadow: 0 .15rem .6rem rgb(20 26 33 / 7%); overflow: hidden; padding: .75rem; }
.calendar-grid { border-left: 1px solid var(--kpi-border); border-top: 1px solid var(--kpi-border); display: grid; grid-template-columns: minmax(4rem, .55fr) repeat(5, minmax(7rem, 1fr)) minmax(4rem, .55fr); overflow-x: auto; }
.calendar-grid__weekday { background: #f2f4f5; border-bottom: 1px solid var(--kpi-border); border-right: 1px solid var(--kpi-border); color: var(--kap-grid-header-ink); font-size: .82rem; font-weight: 800; letter-spacing: .06em; padding: .72rem .55rem; text-align: center; }
.calendar-grid__weekday.is-sunday { background: #fff1ef; color: #a33a2e; }
.calendar-grid__weekday.is-saturday { background: #eef4fb; color: #315f92; }
.calendar-day { background: #fff; border: 0; border-bottom: 1px solid var(--kpi-border); border-right: 1px solid var(--kpi-border); color: inherit; display: flex; flex-direction: column; gap: .35rem; min-height: 8.5rem; padding: .45rem; text-align: left; }
.calendar-day.is-saturday { background: #f5f8fc; }
.calendar-day.is-sunday { background: #fff7f5; }
.calendar-day.is-holiday { background: #fff8ee; }
.calendar-day.is-outside { color: var(--kpi-muted); opacity: .55; }
.calendar-day.is-today .calendar-day__heading time { color: #c74634; }
.calendar-day__heading { align-items: flex-start; display: flex; justify-content: space-between; }
.calendar-day__heading time { font-weight: 800; }
.calendar-day__kind { color: #a33a2e; font-size: .76rem; font-weight: 800; line-height: 1.2; max-width: 7rem; text-align: right; }
.calendar-event { align-items: center; background: color-mix(in srgb, var(--owner-color) 12%, white); border: 1px solid color-mix(in srgb, var(--owner-color) 35%, white); border-left: .2rem solid var(--owner-color); border-radius: var(--oj-core-border-radius-sm); color: color-mix(in srgb, var(--owner-color) 75%, black); cursor: pointer; display: grid; font: inherit; font-size: .7rem; gap: .12rem .22rem; grid-template-columns: auto auto minmax(0, 1fr); line-height: 1.2; min-height: 2.25rem; overflow: visible; padding: .3rem .35rem .38rem; text-align: left; width: 100%; }
.calendar-event.is-all-day { background: color-mix(in srgb, #2f7d6d 18%, white); }
.calendar-event.is-time-unknown { background: color-mix(in srgb, #b56b1f 16%, white); }
.calendar-event__status, .calendar-event__kind { font-size: .68rem; line-height: 1; }
.calendar-event__title-wrap { cursor: pointer; min-width: 0; position: relative; }
.calendar-event__meta { display: flex; gap: .2rem; grid-column: 1 / -1; min-height: .75rem; min-width: 0; overflow: hidden; }
.calendar-event__full-title { background: #172b3a; border-radius: .25rem; color: #fff; display: none; left: 0; padding: .2rem .35rem; position: absolute; top: 100%; white-space: normal; z-index: 20; }
.calendar-event__title-wrap:focus-within .calendar-event__full-title, .calendar-event__title-wrap:hover .calendar-event__full-title { display: block; }
.calendar-event--shared { background: #eef3ff; border-color: #b7c8ed; border-left-color: #315fa8; color: #183b73; }
.calendar-event--private { background: #f4effa; border-color: #cdbce1; border-left-color: #704895; color: #50336c; }
.calendar-event--cancelled { background: #f3f3f3; border-color: #ccc; color: #666; text-decoration: line-through; }
.calendar-event:disabled { cursor: default; opacity: 1; }
.calendar-event.is-private { box-shadow: inset 0 0 0 1px var(--owner-color); }
.calendar-event.is-cancelled { text-decoration: line-through; }
.calendar-day__mobile-add { display: none; }
.calendar-legend { display: flex; flex-wrap: wrap; gap: .35rem; grid-column: 1 / -1; justify-content: flex-end; position: relative; }
.calendar-legend span { border-radius: 999px; font-size: .68rem; padding: .2rem .45rem; }
.calendar-legend__palette { align-items: center; background: #fff; border: 1px solid var(--kpi-border); border-radius: .55rem; box-shadow: 0 .4rem 1rem rgb(0 0 0 / 14%); display: flex; flex-wrap: wrap; gap: .35rem; max-width: 18rem; padding: .55rem; position: absolute; right: 0; top: calc(100% + .3rem); z-index: 8; }
.calendar-options-popover__jet-content, .calendar-legend__palette--jet-content { box-shadow: none; position: static; }
.calendar-day-dialog__jet-body, .calendar-event-editor__jet-body, .calendar-weekly-popup__jet-body { background: transparent; border: 0; border-radius: 0; box-shadow: none; max-height: none; width: 100%; }
.calendar-legend__palette > button { border: 2px solid transparent; border-radius: .25rem; cursor: pointer; height: 1.45rem; min-height: 0; padding: 0; width: 1.45rem; }
.calendar-legend__palette label { align-items: center; display: inline-flex; font-size: .72rem; gap: .25rem; }
.calendar-legend__palette-actions { display: flex; gap: .35rem; margin-left: auto; width: 100%; }
.calendar-legend__palette-actions button { flex: 1; }
.calendar-weekly-popup--vertical { display: grid; gap: .75rem; }
.calendar-weekly-popup__arrow { color: var(--kpi-brand); font-size: 1.5rem; line-height: 1; text-align: center; }
.kap-modal-backdrop { align-items: center; background: rgb(20 24 28 / 45%); display: flex; inset: 0; justify-content: center; padding: 1rem; position: fixed; z-index: 1000; }
.kap-modal { background: #fff; border-radius: var(--oj-core-border-radius-md); box-shadow: 0 1rem 3rem rgb(0 0 0 / 25%); max-height: calc(100dvh - 2rem); overflow: auto; width: min(38rem, 100%); }
.kap-modal > header, .kap-modal > footer { align-items: center; display: flex; justify-content: space-between; padding: .75rem 1rem; }
.calendar-event-editor { background: #fff; border-radius: 1.25rem; box-shadow: 0 1rem 3rem rgb(0 0 0 / 25%); max-height: calc(100dvh - 2rem); overflow: auto; width: min(42rem, 100%); }
.codex-auth-dialog { background: #fff; border-radius: .75rem; box-shadow: 0 1rem 3rem rgb(0 0 0 / 25%); max-height: calc(100dvh - 2rem); overflow: auto; width: min(42rem, 100%); }
.calendar-event-editor > header, .calendar-event-editor > footer, .codex-auth-dialog > header, .codex-auth-dialog > footer { align-items: center; display: flex; gap: .5rem; justify-content: space-between; padding: .75rem 1rem; }
.calendar-event-editor > footer, .codex-auth-dialog > footer { border-top: 1px solid var(--kpi-border); }
.calendar-event-editor > footer span { flex: 1; }
.calendar-event-editor button, .calendar-advanced-toggle { background: #fff; border: 1px solid var(--kpi-border); border-radius: var(--oj-core-border-radius-sm); cursor: pointer; min-height: 2.25rem; padding: .35rem .65rem; }
.calendar-event-editor button.primary { background: var(--kpi-brand); color: #fff; }
.calendar-advanced-panel { display: grid; gap: .7rem; }
.calendar-event-options { display: grid; gap: .5rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.account-search-field { position: relative; }
.account-search-results { background: #fff; border: 1px solid var(--kpi-border); box-shadow: 0 .3rem .8rem rgb(0 0 0 / 15%); display: grid; left: 0; max-height: 12rem; overflow-y: auto; position: absolute; right: 0; top: 100%; z-index: 2; }
.calendar-event-form > .kap-field { position: relative; }
.account-search-results button { border: 0; border-bottom: 1px solid var(--kpi-border); display: grid; gap: .12rem; text-align: left; }
.account-search-results button strong { color: var(--kpi-brand); font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; }
.account-search-results button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-search-empty { color: var(--kpi-muted); padding: .75rem; text-align: center; }
.calendar-inline-search__error { color: var(--kpi-danger, #b42318); display: block; padding: .65rem .75rem; text-align: left; }
.calendar-sharing-readonly { background: var(--kpi-soft); border-left: .25rem solid var(--kpi-muted); padding: .65rem; }
.kap-modal > footer { border-top: 1px solid var(--kpi-border); gap: .5rem; justify-content: flex-end; }
.kap-modal__body, .calendar-event-form { display: grid; gap: .75rem; padding: .75rem 1rem; }
.calendar-event-form details { border-top: 1px solid var(--kpi-border); padding-top: .75rem; }
.calendar-event-form details summary { cursor: pointer; font-weight: 800; }
.calendar-event-form details > *:not(summary) { margin-top: .75rem; }
.calendar-readonly-sharing { background: var(--kpi-soft); border-radius: var(--oj-core-border-radius-sm); padding: .65rem; }
.kap-field__hint, .kap-field small { color: var(--kpi-muted); font-size: .72rem; font-weight: 400; }
.calendar-event-form__row, .meeting-note-editor__two { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kap-check { align-items: center; display: flex; gap: .45rem; }
.calendar-sharing { border-top: 1px solid var(--kpi-border); display: grid; gap: .5rem; padding-top: .75rem; }
.calendar-sharing > div:first-child { align-items: center; display: flex; justify-content: space-between; }
.calendar-sharing__row { align-items: center; display: grid; gap: .5rem; grid-template-columns: minmax(0, 1fr) auto auto; }
.calendar-sharing__row > span { align-items: center; display: flex; gap: .4rem; }
.calendar-share-color { border: 1px solid rgb(0 0 0 / 20%); border-radius: 50%; display: inline-block; flex: 0 0 auto; height: .8rem; width: .8rem; }
.meeting-notes-header-actions, .meeting-note-view__actions { align-items: center; display: flex; gap: .5rem; }
.codex-auth-status { color: #8a5b00; font-weight: 800; }
.codex-connection-notice { align-items: center; background: #fff8e5; border: 1px solid #d9b65c; border-radius: .65rem; color: #5f3f00; display: grid; gap: .25rem .75rem; grid-template-columns: minmax(0, 1fr) auto; margin-bottom: .75rem; padding: .7rem .85rem; }
.codex-connection-notice strong, .codex-connection-notice span { grid-column: 1; }
.codex-connection-notice span { font-size: .78rem; }
.codex-connection-notice button { background: #fff; border: 1px solid #b78d2f; border-radius: .4rem; color: inherit; cursor: pointer; font: inherit; grid-column: 2; grid-row: 1 / span 2; min-height: 2.25rem; padding: .35rem .65rem; }
.codex-auth-dialog dl { display: grid; grid-template-columns: auto 1fr; gap: .5rem 1rem; }
.codex-auth-dialog dd { margin: 0; }
.meeting-notes-page__header { align-items: center; display: flex; justify-content: space-between; }
.meeting-note-event-hint, .meeting-note-sharing-boundary { color: var(--kpi-muted); font-size: .75rem; }
.codex-auth-dialog__body { display: grid; gap: .65rem; padding: 1rem; }

.meeting-notes-layout { display: grid; grid-template-columns: minmax(13rem, 18rem) minmax(0, 1fr); min-height: 31rem; }
.meeting-notes-list { background: var(--kpi-soft); border-right: 1px solid var(--kpi-border); }
.meeting-notes-list > button { background: transparent; border: 0; border-bottom: 1px solid var(--kpi-border); color: inherit; cursor: pointer; display: grid; gap: .2rem; padding: .75rem; text-align: left; width: 100%; }
.meeting-notes-list > button.is-selected { background: #fff; border-left: .2rem solid var(--kpi-brand); }
.meeting-notes-list time, .meeting-notes-list span { color: var(--kpi-muted); font-size: .72rem; }
.meeting-notes-detail { min-width: 0; padding: 1rem; }
.meeting-note-editor { display: grid; gap: .8rem; }
.meeting-note-editor__heading, .meeting-note-view > header, .meeting-note-editor__actions { align-items: center; display: flex; justify-content: space-between; }
.meeting-note-editor__heading h3, .meeting-note-view h3 { margin: 0; }
.meeting-note-editor__heading span { background: #eeebe8; border-radius: 999px; font-size: .72rem; font-weight: 800; padding: .25rem .55rem; }
.meeting-note-ai-notice, .local-recorder__warning { background: #fff8e5; border-left: .25rem solid #8a5b00; color: #5f3f00; padding: .75rem; }
.meeting-note-ai-notice p { margin: .3rem 0 .6rem; }
.meeting-note-ai-notice button:disabled { cursor: not-allowed; opacity: .65; }
.local-recorder { border: 1px solid var(--kpi-border); display: grid; gap: .7rem; padding: .85rem; }
.local-recorder h4 { margin: 0; }
.local-recorder__actions { display: flex; gap: .5rem; }
.local-recorder audio, .meeting-note-view audio { display: block; margin-top: .5rem; max-width: 100%; width: 28rem; }
.meeting-note-editor__actions { gap: .5rem; justify-content: flex-end; }
.meeting-note-view { display: grid; gap: .85rem; }
.meeting-note-view section { border: 1px solid var(--kpi-border); padding: .8rem; }
.meeting-note-view section h4 { margin: 0 0 .45rem; }
.meeting-note-pre { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }

/* Calendar round 3: compact, stable partial-update surface and explicit selection affordances. */
.calendar-page-card { gap: .35rem; }
.calendar-breadcrumb { margin-bottom: 0; }
.calendar-toolbar { margin: 0; padding-block: .15rem .35rem; row-gap: .35rem; }
.calendar-toolbar { align-items: center; display: grid; grid-template-columns: minmax(12rem, 1fr) auto; }
.calendar-toolbar h2 { font-size: 1.65rem; line-height: 1.2; margin: .25rem 0; }
.calendar-legend { justify-content: flex-end; margin: 0; padding-top: .15rem; }
.calendar-surface { margin-top: 0; }
.calendar-card-summary { display: grid; gap: .08rem; grid-column: 2 / -1; min-width: 0; position: relative; }
.calendar-card-summary__line { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-card-summary__relations { color: color-mix(in srgb, var(--owner-color, var(--kpi-brand)) 78%, #172b3a); font-size: .64rem; font-weight: 700; }
.calendar-card-summary__tooltip { background: #172b3a; border-radius: .35rem; box-shadow: 0 .4rem 1rem rgb(0 0 0 / 18%); color: #fff; display: none; gap: .12rem; left: 0; max-width: min(24rem, 80vw); padding: .35rem .45rem; pointer-events: none; position: absolute; top: calc(100% + .2rem); white-space: nowrap; z-index: 30; }
.calendar-card-summary__tooltip > span { display: block; overflow: hidden; text-overflow: ellipsis; }
.calendar-card-summary:hover .calendar-card-summary__tooltip,
.calendar-card-summary:focus .calendar-card-summary__tooltip,
.calendar-card-summary:focus-within .calendar-card-summary__tooltip { display: grid; }
.calendar-event.is-selected,
.calendar-detail-event.is-selected,
.calendar-timeline-event.is-selected {
  background: color-mix(in srgb, var(--owner-color, var(--kpi-brand)) 18%, #fff);
  border-color: var(--owner-color, var(--kpi-brand));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--owner-color, var(--kpi-brand)) 36%, transparent);
  position: relative;
  z-index: 6;
}
.calendar-timeline-event {
  align-content: start;
  font-size: .68rem;
  gap: .08rem;
  line-height: 1.08;
  overflow: hidden;
  padding: .18rem .28rem;
}
.calendar-timeline-event.is-selected { overflow: visible; }
.calendar-timeline-event__time { display: block; font-size: .62rem; font-weight: 800; line-height: 1; order: -2; white-space: nowrap; }
.calendar-timeline-event .calendar-event__title { display: -webkit-box; font-size: .7rem; line-height: 1.08; overflow: hidden; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.calendar-timeline-event .calendar-event-relations { font-size: .58rem; line-height: 1; max-height: 1.15rem; overflow: hidden; }
.calendar-event-actions { align-items: center; background: rgb(255 255 255 / 96%); border: 1px solid var(--owner-color, var(--kpi-brand)); border-radius: .35rem; display: flex; gap: .18rem; padding: .12rem; position: absolute; right: .15rem; top: .15rem; z-index: 12; }
.calendar-event-actions button,
.calendar-event-actions oj-button,
.calendar-block-editor__actions > oj-button { border: 0; border-radius: .25rem; cursor: pointer; font: inherit; font-size: .7rem; line-height: 1; min-height: 1.65rem; min-width: 1.65rem; padding: 0; white-space: nowrap; }
.calendar-icon-action.is-active,
.calendar-block-editor__actions button.is-active { background: var(--owner-color, var(--kpi-brand)); color: #fff; box-shadow: inset 0 0 0 1px rgb(0 0 0 / 12%); }
.calendar-icon-action.is-active { --oj-button-borderless-chrome-text-color: #fff; --oj-button-borderless-chrome-bg-color: var(--owner-color, var(--kpi-brand)); background: var(--owner-color, var(--kpi-brand)); }
.calendar-options-popover__jet-content { display: grid; gap: .65rem; min-width: min(18rem, 82vw); padding: .75rem; }
.calendar-event-actions__readonly { font-size: .62rem; font-weight: 800; padding: .2rem .3rem; white-space: nowrap; }
.calendar-title-search { max-height: min(18rem, 45vh); overflow-y: auto; overscroll-behavior: contain; }
.calendar-close-confirm { display: grid; gap: .8rem; padding: .9rem; }
.calendar-close-confirm p { margin: 0; }
.calendar-close-confirm__actions { display: flex; flex-wrap: wrap; gap: .45rem; justify-content: flex-end; }
.calendar-weekly-popup__box { border: 2px solid color-mix(in srgb, var(--kpi-border) 75%, #4b5563); border-radius: .55rem; display: grid; gap: .45rem; padding: .8rem; }

.calendar-event__summary { display: grid; gap: .12rem; grid-column: 2 / -1; min-width: 0; }
.calendar-event__primary,
.calendar-event__secondary { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-event__secondary { color: #174a70; font-size: .64rem; font-weight: 700; }
.calendar-options-popover__title { border-bottom: 1px solid var(--kpi-border); display: block; font-size: .8rem; padding-bottom: .35rem; }

@media (max-width: 720px) {
  .calendar-toolbar { grid-template-columns: minmax(0, 1fr); }
  .calendar-grid { grid-template-columns: minmax(4rem, .55fr) repeat(5, minmax(8rem, 1fr)) minmax(4rem, .55fr); }
  .calendar-mobile-add { display: inline-block; }
  .calendar-day__mobile-add { align-items: center; align-self: flex-end; border: 1px solid var(--kpi-border); border-radius: 50%; display: inline-flex; height: 2rem; justify-content: center; margin-top: auto; width: 2rem; }
  .calendar-event-options { grid-template-columns: minmax(0, 1fr); }
  .calendar-event-form__row, .meeting-note-editor__two { grid-template-columns: minmax(0, 1fr); }
  .meeting-notes-layout { grid-template-columns: minmax(0, 1fr); }
  .meeting-notes-list { border-bottom: 1px solid var(--kpi-border); border-right: 0; display: flex; max-width: 100%; overflow-x: auto; }
  .meeting-notes-list > button { border-bottom: 0; border-right: 1px solid var(--kpi-border); flex: 0 0 13rem; }
  .meeting-notes-list > button.is-selected { border-left: 0; border-top: .2rem solid var(--kpi-brand); }
  .meeting-notes-detail { padding: .75rem; }
  .weekly-activities-page__header { align-items: flex-start; flex-direction: column; }
  .codex-connection-notice { grid-template-columns: minmax(0, 1fr); }
  .codex-connection-notice button { grid-column: 1; grid-row: auto; justify-self: start; }
  .calendar-toolbar { gap: .25rem; }
  .calendar-event-actions { left: auto; right: .1rem; top: .1rem; transform: none; }
  .calendar-close-confirm__actions { align-items: stretch; flex-direction: column; }
}

/* Reusable viewport-bound page shell. Route classes apply before child mount; :has is the structural fallback. */
.kpi-shell.is-kap-page-shell-route,
.kpi-shell:has(.kap-page-shell) {
  box-sizing: border-box;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  height: 100dvh;
  min-height: 0;
  overflow: hidden;
  padding-bottom: 0;
}
/* JET temporarily inserts this menu placeholder as a direct child; keep it out of the shell grid. */
.kpi-shell > #kpiNavigationPopup_layer_surrogate { display: none !important; }
.kpi-shell.is-kap-page-shell-route .kpi-footer,
.kpi-shell:has(.kap-page-shell) .kpi-footer {
  position: static;
  bottom: auto;
  margin-inline: 1.5rem;
  width: auto;
}
.kpi-shell.is-kap-page-shell-route .kpi-shell__body,
.kpi-shell__body:has(.kap-page-shell) { flex: 1 1 0; min-height: 0; overflow: hidden; }
.kpi-content.is-kap-page-shell-route,
.kpi-content:has(.kap-page-shell) { grid-template-rows: minmax(0, 1fr); min-height: 0; overflow: hidden; }
.kpi-content.is-kap-page-shell-route.has-fiscal-year-panel {
  grid-template-rows: auto minmax(0, 1fr);
}
.kap-page-shell {
  background: var(--oj-core-bg-color-content, #fff);
  border: 1px solid var(--kpi-border);
  border-radius: .75rem;
  box-shadow: 0 1px 2px rgb(0 0 0 / 6%);
  box-sizing: border-box;
  grid-template-rows: minmax(0, 1fr);
  height: 100%;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
}
/* Neutralize legacy Forecast page scrolling now that PageShell owns the body scroll. */
.kap-page-shell.forecast-actual-page {
  grid-auto-rows: minmax(0, 1fr);
  max-height: none;
  min-height: 0;
  overflow: hidden;
  padding-bottom: 1rem;
}
.kap-page-shell__scroll {
  box-sizing: border-box;
  height: 100%;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: transparent transparent;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}
.kap-page-shell__scroll.is-scrolling { scrollbar-color: rgb(91 85 80 / 45%) transparent; }
.kap-page-shell__scroll::-webkit-scrollbar { width: .35rem; }
.kap-page-shell__scroll::-webkit-scrollbar-track { background: transparent; }
.kap-page-shell__scroll::-webkit-scrollbar-thumb { background: transparent; border-radius: 999px; }
.kap-page-shell__scroll.is-scrolling::-webkit-scrollbar-thumb { background: rgb(91 85 80 / 45%); }
.kap-page-shell__scroll:focus-visible { outline: 2px solid var(--oj-core-focus-border-color, #0572ce); outline-offset: -2px; }
.kap-page-shell__inner { box-sizing: border-box; display: flex; flex-direction: column; gap: .75rem; min-height: 100%; padding: .75rem; }
.kap-page-shell__masthead { display: flex; flex-direction: column; gap: .75rem; min-width: 0; }
.kap-page-shell__masthead.is-compact { gap: .1rem; }
.kap-page-shell__heading { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; min-width: 0; }
.kap-page-shell__heading-copy { min-width: 0; }
.kap-page-shell__title-row { align-items: center; display: flex; flex-wrap: wrap; gap: .5rem .75rem; min-width: 0; }
.kap-page-shell.consumption-insights-page .kap-page-shell__title-row,
.kap-page-shell.forecast-actual-page .kap-page-shell__title-row {
  column-gap: 2rem;
  row-gap: .875rem;
}
.kap-page-shell.consumption-page .kap-page-shell__title-row > h1,
.kap-page-shell.consumption-insights-page .kap-page-shell__title-row > h1,
.kap-page-shell.forecast-actual-page .kap-page-shell__title-row > h1 { inset-inline-start: .5rem; position: relative; }
.kap-page-shell__title-controls { align-items: center; display: inline-flex; flex: 0 0 auto; }
.kap-page-shell__eyebrow { color: var(--kpi-muted); display: block; font-size: .72rem; font-weight: 800; letter-spacing: .03em; margin-top: .15rem; text-transform: uppercase; }
.kap-page-shell__heading h1 { font-size: clamp(1.8rem, 3vw, 2.35rem); letter-spacing: -.035em; line-height: 1.12; margin: 0; }
.consumption-page__header h1,
.kap-page-shell.consumption-page .kap-page-shell__heading-copy h1 { font-size: 1.65rem; font-weight: 700; letter-spacing: normal; line-height: 1.2; margin: .2rem 0; }
.kap-page-shell__heading-copy.has-eyebrow h1 { margin-top: .2rem; }
.kap-page-shell__heading-actions { align-items: center; display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: .6rem; justify-content: flex-end; }
.kap-page-activity { align-items: flex-end; display: inline-flex; gap: .4rem; min-height: 2.5rem; }
.kap-page-activity.is-busy { color: var(--kpi-muted); font-size: .75rem; font-weight: 750; white-space: nowrap; }
.kap-page-activity__loading-group { align-items: flex-end; display: inline-flex; gap: .35rem; min-width: 0; }
.kap-page-activity__completed-at { color: var(--kpi-muted); font-size: .7rem; font-variant-numeric: tabular-nums; line-height: 1; padding-bottom: .08rem; white-space: nowrap; }
.kap-page-activity__status { align-items: flex-end; display: inline-flex; flex: 0 0 auto; gap: .4rem; min-height: 1.25rem; visibility: hidden; }
.kap-page-activity__status.is-active { visibility: visible; }
.kap-page-activity__progress { display: block; flex: 0 0 auto; height: 1.25rem; line-height: 1; overflow: visible; width: 1.25rem; }
.kap-page-data-progress { left: 50%; max-width: calc(100% - 2rem); opacity: 0; pointer-events: none; position: absolute; top: 50%; transform: translate(-50%, -50%); visibility: hidden; width: min(20rem, 52%); z-index: 3; }
.kap-page-data-progress.is-active { opacity: 1; visibility: visible; }
.kap-page-data-progress oj-progress-bar { display: block; width: 100%; }

.consumption-covered-period-title { align-items: center; display: inline-flex; gap: .12rem; }
.kap-page-activity__control-slot { align-items: center; display: inline-flex; justify-content: center; min-height: 2.25rem; min-width: 2.25rem; width: 2.25rem; }
.kap-page-activity__refresh { align-items: center; display: inline-flex; min-height: 2.25rem; min-width: 2.25rem; width: 2.25rem; }
.kap-page-activity__control-slot .kap-page-activity__status { visibility: visible; }
.kap-page-activity.is-compact-timestamp { align-items: center; min-height: 2.5rem; }
.kap-page-activity.is-compact-timestamp .kap-page-activity__control-slot { align-items: center; min-width: 0; width: auto; }
.kap-page-activity.is-compact-timestamp .kap-page-activity__refresh { font-size: .78rem; font-weight: 700; min-height: 2.25rem; white-space: nowrap; width: auto; }
.kap-page-activity.is-compact-timestamp .kap-page-activity__start-icon { align-items: center; display: inline-flex; height: 1.125rem; justify-content: center; line-height: 1; overflow: visible; width: 1.125rem; }
.kap-page-activity.is-compact-timestamp .kap-page-activity__progress { height: .9rem; width: .9rem; }
.kap-page-activity__separator { color: var(--kpi-border-strong, #8b8580); margin-inline: .25rem; }
.kap-page-activity.is-compact-timestamp .kap-page-activity__completed-at { color: inherit; font-size: inherit; padding: 0; }
.kap-page-filter { align-items: end; background: var(--kpi-surface-alt, #f8f6f4); border: 1px solid var(--kpi-border); border-radius: var(--kpi-panel-radius); box-sizing: border-box; display: flex; flex-wrap: wrap; gap: .5rem .75rem; padding: .5rem .75rem; width: 100%; }
.kap-page-shell__body { display: grid; flex: 1 0 auto; gap: .75rem; min-height: 0; min-width: 0; }

/* KPI-only PageShell adoption. Consumption remains frozen and unchanged. */
.kap-page-shell.kpi-spreadsheet-page {
  border-radius: var(--oj-core-border-radius-md, .2rem);
  padding: 0;
}
.kap-page-shell.kpi-spreadsheet-page .kap-page-shell__inner { gap: .325rem; }
.kap-page-shell.kpi-spreadsheet-page .kap-page-shell__masthead { padding-inline: .5rem; }
.kap-page-shell.kpi-spreadsheet-page .kap-page-shell__title-row > h1 { font-size: 1.65rem; line-height: 1.2; }
.kap-page-shell.kpi-spreadsheet-page .kap-page-shell__body {
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  gap: .325rem;
  min-width: 0;
  width: 100%;
}
.kap-page-shell.kpi-spreadsheet-page .kpi-activity-toolbar { margin: 0; }
.kap-page-shell.kpi-spreadsheet-page .kpi-overview-portfolio__heading { margin-bottom: .325rem; }
.kap-page-shell.kpi-spreadsheet-page .kpi-overview-portfolio__heading h3 { margin: 0; }
.kap-page-shell.kpi-spreadsheet-page .kpi-sheet-tabs { flex: 0 0 auto; margin: 0; }
.kap-page-shell.kpi-spreadsheet-page .kpi-overview-scroll-area { min-height: 0; }
.kap-page-shell.kpi-spreadsheet-page .kpi-grid-cell { touch-action: pan-x pan-y pinch-zoom; }
.kap-page-shell.kpi-spreadsheet-page .kpi-overview-portfolio__heading .kap-page-activity,
.kap-page-shell.kpi-spreadsheet-page .kpi-activity-toolbar__right .kap-page-activity { margin-left: auto; }
.kap-page-shell.kpi-spreadsheet-page .kpi-overview-portfolio__heading .kap-page-activity__control-slot,
.kap-page-shell.kpi-spreadsheet-page .kpi-overview-portfolio__heading .kap-page-activity__refresh,
.kap-page-shell.kpi-spreadsheet-page .kpi-activity-toolbar__right .kap-page-activity__control-slot,
.kap-page-shell.kpi-spreadsheet-page .kpi-activity-toolbar__right .kap-page-activity__refresh {
  min-width: 0;
  width: auto;
}

/* Consumption Records is the first adopter; legacy nested scrolling is replaced by shell scrolling. */
.kap-page-shell.consumption-page { display: block; padding: 0; }
.kap-page-shell.consumption-page .kap-page-shell__inner { gap: 0; }
.kap-page-shell.consumption-page .kap-page-shell__masthead { margin-bottom: .375rem; }
.kap-page-shell.consumption-insights-page { padding: 0; }
.kap-page-shell.consumption-insights-page .kap-page-shell__inner { gap: .375rem; }
.kap-page-shell.consumption-insights-page .kap-page-shell__heading-copy h1 {
  font-size: 1.65rem;
  font-weight: 700;
  letter-spacing: normal;
  line-height: 1.2;
  margin: .2rem 0;
}
oj-menu-button.consumption-analysis-fy-button { min-width: 5.75rem; white-space: nowrap; }
.kap-page-shell.consumption-insights-page .consumption-insights-header-actions { align-items: end; }
.kap-page-shell.consumption-insights-page .kap-page-filter { min-height: 0; }
.kap-page-shell.consumption-insights-page .consumption-insights-filter--account { flex: 0 1 20rem; max-width: 100%; min-width: 14.4rem; width: min(20rem, 22.4vw); }
.kap-page-shell.consumption-insights-page .consumption-insights-pillar { order: 1; }
.kap-page-shell.consumption-insights-page .consumption-insights-context { flex: 1 1 auto; order: 2; }
.kap-page-shell.consumption-insights-page .consumption-insights-filter select,
.kap-page-shell.consumption-insights-page .consumption-insights-filter input { font-size: .72rem; }
.kap-page-shell.consumption-insights-page .consumption-insights-filter select,
.kap-page-shell.consumption-insights-page .consumption-insights-filter input,
.kap-page-shell.consumption-insights-page .consumption-insights-pillar button { box-sizing: border-box; height: var(--kap-consumption-control-height); min-height: var(--kap-consumption-control-height); }
.kap-page-shell.consumption-insights-page .consumption-analysis-toolbar { align-items: center; min-height: 2.5rem; }
.kap-page-shell.consumption-insights-page .consumption-analysis-toolbar .consumption-records-toolbar__left { padding-inline-start: .5rem; }
.kap-page-shell.consumption-insights-page .consumption-analysis-toolbar .consumption-records-toolbar-activity { margin-left: auto; }
.kap-page-shell.consumption-insights-page .consumption-analysis-toolbar .consumption-mtd-applied-date { font-size: .78rem; font-weight: 600; line-height: 1; }
.consumption-info-tooltip { display: inline-flex; position: relative; vertical-align: middle; }
.consumption-insights-legend .consumption-info-tooltip,
.home-consumption__info-tooltip { align-self: flex-start; margin-left: -.08rem; position: relative; top: -.18rem; vertical-align: super; }
.home-consumption__coverage > span,
.home-consumption__metrics article > span,
.home-consumption__quarter-values > span,
.home-consumption__monthly-legend > span { align-items: center; display: inline-flex; }
/* Shared KPI panels clip decorative overflow; tooltip panels must allow the popup to escape. */
.consumption-insights-page .kpi-panel:has(.consumption-info-tooltip),
.home-consumption:has(.consumption-info-tooltip) { overflow: visible; }
.consumption-mtd-control { align-items: center; display: inline-flex; position: relative; }
.consumption-info-tooltip__trigger { align-items: center; background: transparent; border: 0; color: var(--oj-link-text-color, #0066cc); cursor: help; display: inline-flex; font-size: .85rem; height: 1.15rem; justify-content: center; margin: 0 .1rem; padding: 0; width: 1.15rem; }
.consumption-info-tooltip__trigger:focus-visible { border-radius: 50%; outline: 2px solid var(--oj-core-focus-border-color, #0572ce); outline-offset: 1px; }
.consumption-info-tooltip__content { background: #272320; border-radius: .3rem; color: #fff; font-size: .72rem; font-weight: 400; left: 0; line-height: 1.35; max-width: min(18rem, calc(100vw - 2rem)); opacity: 0; padding: .45rem .55rem; pointer-events: none; position: absolute; text-align: left; top: calc(100% + .25rem); visibility: hidden; white-space: normal; width: max-content; z-index: 60; }
.home-consumption__info-tooltip-content.is-portal { background: #272320; color: #fff; max-height: calc(100vh - 1rem); opacity: 1; overflow: auto; pointer-events: auto; visibility: visible; z-index: 1000; }
.consumption-info-tooltip:hover .consumption-info-tooltip__content,
.consumption-info-tooltip:focus-within .consumption-info-tooltip__content { opacity: 1; visibility: visible; }
.consumption-insights-legend .is-mtd { background: #b56a3b; }
.consumption-insights-composition-empty { align-content: start; justify-content: start; padding: .8rem; text-align: left; }
.kap-page-filter.forecast-actual-toolbar,
.kap-page-filter.consumption-insights-header-actions { justify-content: flex-start; }
.kap-page-shell.forecast-actual-page .kap-page-shell__scroll { overflow-x: hidden; overflow-y: auto; }
.kap-page-shell.forecast-actual-page .kap-page-shell__inner { min-width: 0; width: 100%; }
.forecast-actual-overview { align-items: stretch; display: grid; gap: .55rem; grid-template-columns: minmax(16rem, 20rem) minmax(0, 1fr); }
.forecast-actual-total-strip { align-content: stretch; display: grid; flex: none; gap: .4rem; grid-template-columns: repeat(2, minmax(0, 1fr)); width: auto; }
.forecast-actual-total-strip > span { min-height: 0; padding: .45rem .55rem; }
.forecast-actual-quarter-cards { min-width: 0; }
.forecast-actual-matrix-frame { border: 1px solid var(--oj-core-divider-color); border-radius: .4rem; min-width: 0; overflow: hidden; position: relative; }
.forecast-actual-matrix-shell { -webkit-overflow-scrolling: touch; border: 0; border-radius: 0; max-width: 100%; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; touch-action: pan-x pan-y; width: 100%; }
.forecast-actual-matrix-shell:focus-visible { outline: 2px solid var(--oj-core-focus-border-color); outline-offset: -2px; }
.forecast-actual-matrix-layout { min-width: 100%; width: max-content; }
.forecast-actual-matrix .is-quarter-result { left: 17.5rem; }
.forecast-actual-scroll-controls { align-items: center; background: color-mix(in srgb, var(--oj-core-bg-color-content, #fff) 92%, transparent); border: 1px solid var(--oj-core-divider-color); border-radius: 999px; box-shadow: 0 2px 8px rgb(0 0 0 / 14%); display: flex; gap: .15rem; padding: .2rem; position: absolute; right: .65rem; top: .65rem; z-index: 12; }
.forecast-actual-scroll-controls button { align-items: center; background: var(--oj-core-bg-color-content, #fff); border: 0; border-radius: 50%; color: var(--oj-core-text-color-primary); cursor: pointer; display: inline-flex; height: 2rem; justify-content: center; padding: 0; width: 2rem; }
.forecast-actual-scroll-controls button:hover { background: var(--oj-core-bg-color-hover, #f1efed); }
.forecast-actual-scroll-controls button:focus-visible { outline: 2px solid var(--oj-core-focus-border-color); outline-offset: 1px; }
.forecast-actual-data-toolbar .consumption-mtd-applied-date { white-space: nowrap; }
@media (max-width: 760px) {
  .forecast-actual-matrix .is-quarter-result { left: 15.5rem; }
  .forecast-actual-overview { grid-template-columns: minmax(0, 1fr); }
  .forecast-actual-total-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .forecast-actual-total-strip > span { min-width: 0; }
  .forecast-actual-data-toolbar .consumption-records-toolbar__left { align-items: flex-start; flex-direction: column; gap: 0; }
  .forecast-actual-scroll-controls { right: .4rem; top: .4rem; }
}
.kap-page-shell.consumption-page .kap-page-shell__body { display: flex; flex-direction: column; gap: 0; min-height: 0; }
.kap-page-shell.consumption-page .consumption-range-bar { background: var(--kpi-surface-alt, #f8f6f4); border: 1px solid var(--kpi-border); padding: .5rem .75rem; }
.consumption-table-panel { display: flex; flex: 1 0 auto; flex-direction: column; }
.kap-page-shell.consumption-page .consumption-table-panel { margin-top: .375rem; }
.kap-page-shell.consumption-page .consumption-table-panel { min-height: 18rem; overflow: visible; }
.kap-page-shell.consumption-page .consumption-table-content { display: flex; flex: 1 0 auto; flex-direction: column; min-height: 0; position: relative; }
.consumption-table-scroll { flex: 1 1 auto; min-height: 18rem; }
.kap-page-shell.consumption-page .consumption-table-scroll { height: auto; overflow-x: auto; overflow-y: visible; }
.consumption-table-heading { align-items: stretch; flex-direction: column; margin: 0 0 .325rem; }
.kap-page-shell.consumption-page .consumption-table-heading { margin-bottom: 0; }
.kap-page-shell.consumption-page .consumption-table-heading__left { padding-left: .5rem; }
.consumption-records-toolbar { align-items: flex-end; display: flex; gap: 0; justify-content: space-between; margin: 0; min-width: 0; width: 100%; }
.consumption-records-toolbar__left { align-items: center; border: 0; background: transparent; display: flex; flex-direction: row; gap: .55rem; min-width: 0; padding-inline-start: .5rem; }
.consumption-records-toolbar-activity { align-items: flex-end; display: flex; flex: 0 0 auto; justify-content: flex-end; min-width: 0; }
.consumption-records-toolbar-activity .kap-page-activity { justify-content: flex-end; }
.kap-page-shell.consumption-page .consumption-summary {
  background: color-mix(in srgb, var(--oj-core-brand-color-1, #0b607d) 4%, var(--oj-core-bg-color-content, #fff));
  border: 1px solid var(--oj-core-divider-color, var(--kpi-border));
  border-radius: .4rem;
  margin: .375rem 0;
  min-width: 0;
  padding: .65rem .75rem;
}
.kap-page-shell.consumption-page .consumption-summary__heading { align-items: center; display: flex; justify-content: space-between; }
.kap-page-shell.consumption-page .consumption-summary__toggle { align-items: center; background: transparent; border: 0; border-radius: var(--oj-core-border-radius-sm); color: var(--oj-core-text-color-primary, var(--kpi-ink)); cursor: pointer; display: flex; font: inherit; font-size: .9rem; font-weight: 800; justify-content: space-between; line-height: 1.2; padding: .18rem .22rem; text-align: left; width: 100%; }
.kap-page-shell.consumption-page .consumption-summary__toggle:focus-visible { box-shadow: 0 0 0 2px var(--oj-core-focus-border-color, #0572ce); outline: none; }
.kap-page-shell.consumption-page .consumption-summary__toggle + * { margin-top: .45rem; }
.kap-page-shell.consumption-page .consumption-summary__scroll {
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  width: 100%;
}
.kap-page-shell.consumption-page .consumption-summary__scroll:focus-visible { outline: 2px solid var(--oj-core-focus-border-color); outline-offset: -2px; }
.kap-page-shell.consumption-page .consumption-summary__table { border: 1px solid var(--oj-core-divider-color, var(--kpi-border)); border-collapse: separate; border-radius: var(--oj-core-border-radius-sm); border-spacing: 0; font-size: .88rem; min-width: 100%; overflow: hidden; width: max-content; }
.kap-page-shell.consumption-page .consumption-summary__table th,
.kap-page-shell.consumption-page .consumption-summary__table td { border-bottom: 1px solid var(--oj-core-divider-color, var(--kpi-border)); border-right: 1px solid var(--oj-core-divider-color, var(--kpi-border)); padding: .42rem .52rem; white-space: nowrap; }
.kap-page-shell.consumption-page .consumption-summary__table tr > *:last-child { border-right: 0; }
.kap-page-shell.consumption-page .consumption-summary__table thead th { background: color-mix(in srgb, var(--oj-core-brand-color-1, #0b607d) 8%, var(--oj-core-bg-color-content, #fff)); color: var(--oj-core-text-color-primary, var(--kpi-ink)); font-size: .88rem; font-weight: 800; }
.kap-page-shell.consumption-page .consumption-summary__quarter-row th:not(:first-child) { text-align: center; }
.kap-page-shell.consumption-page .consumption-summary__metric-row th { text-align: right; }
.kap-page-shell.consumption-page .consumption-summary__table thead th[rowspan],
.kap-page-shell.consumption-page .consumption-summary__table tbody th:first-child { left: 0; min-width: 5rem; position: sticky; text-align: left; width: 5rem; z-index: 1; }
.kap-page-shell.consumption-page .consumption-summary__table tbody th:first-child { background: var(--oj-core-bg-color-content, #fff); font-size: .9rem; font-weight: 800; }
.kap-page-shell.consumption-page .consumption-summary__table tbody tr:last-child > * { border-bottom: 0; }
.kap-page-shell.consumption-page .consumption-summary__amount { font-size: .88rem; min-width: 12rem; text-align: right; }
.kap-page-shell.consumption-page .consumption-summary__amount strong,
.kap-page-shell.consumption-page .consumption-summary__amount small { display: block; }
.kap-page-shell.consumption-page .consumption-summary__amount strong { color: var(--oj-core-text-color-primary, var(--kpi-ink)); font-size: .88rem; font-weight: 800; }
.kap-page-shell.consumption-page .consumption-summary__amount small { color: var(--oj-core-text-color-secondary, var(--kpi-muted)); font-size: .68rem; font-weight: 400; line-height: 1.35; margin-top: .12rem; white-space: nowrap; }
.kap-page-shell.consumption-page .consumption-summary__amount small span { display: inline; font-weight: 400; }
.kap-page-shell.consumption-page .consumption-summary__qoq { font-size: .88rem; font-weight: 800; min-width: 4.6rem; text-align: right; }
.kap-page-shell.consumption-page .consumption-summary__status { color: var(--kpi-muted); font-size: .72rem; min-height: 3rem; padding: 1rem; text-align: center; }
.kap-page-shell.consumption-page .consumption-viewport-controls { inset: 0; opacity: 0; position: fixed; pointer-events: none; visibility: hidden; z-index: 18; }
.kap-page-shell.consumption-page .consumption-viewport-controls[data-visible="true"] { opacity: 1; visibility: visible; }
.kap-page-shell.consumption-page .consumption-viewport-controls .kap-page-data-progress { left: var(--consumption-viewport-center-x); top: var(--consumption-viewport-center-y); }
.kap-page-shell.consumption-page .consumption-viewport-controls > .consumption-scroll-controls { display: contents; }
.kap-page-shell.consumption-page .consumption-viewport-controls[data-table-visible="false"] .consumption-scroll-controls { display: none; }
.kap-page-shell.consumption-page .consumption-viewport-controls .consumption-scroll-controls button:first-child { left: auto; position: fixed; right: max(3.35rem, calc(100vw - var(--consumption-viewport-right) + 3.35rem)); top: var(--consumption-table-center-y); transform: translateY(-50%); }
.kap-page-shell.consumption-page .consumption-viewport-controls .consumption-scroll-controls button:last-child { position: fixed; right: max(.65rem, calc(100vw - var(--consumption-viewport-right) + .65rem)); top: var(--consumption-table-center-y); transform: translateY(-50%); }
.kap-page-shell.consumption-page .consumption-viewport-controls .consumption-scroll-controls button { pointer-events: auto; }
.kap-page-shell.consumption-page .consumption-forecast-cell { touch-action: pan-x pan-y pinch-zoom; }

@media (max-width: 760px) {
  .kpi-shell.is-kap-page-shell-route .kpi-footer,
  .kpi-shell:has(.kap-page-shell) .kpi-footer { margin-inline: .75rem; }
  .kpi-content.is-kap-page-shell-route,
  .kpi-content:has(.kap-page-shell) { padding: .75rem; }
  .kap-page-shell__scroll { -webkit-overflow-scrolling: touch; scrollbar-gutter: auto; }
  .kap-page-shell__heading { align-items: stretch; flex-direction: column; gap: .55rem; }
  .kap-page-shell__title-row { align-items: flex-start; }
  .kap-page-shell.kpi-spreadsheet-page .kpi-sheet-tabs {
    flex: 0 0 auto;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }
  .kap-page-shell.kpi-spreadsheet-page .kpi-sheet-tabs > button { flex: 0 0 auto; }
  .kap-page-shell.kpi-spreadsheet-page .kpi-activity-toolbar {
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
  }
  .kap-page-shell.kpi-spreadsheet-page .kpi-activity-toolbar__left {
    flex: 1 1 auto;
    min-width: 0;
  }
  .kap-page-shell.kpi-spreadsheet-page .kpi-activity-toolbar__right {
    flex: 0 0 auto;
    margin-left: auto;
    width: auto;
  }
  .kap-page-shell.kpi-spreadsheet-page .kpi-overview-portfolio__heading {
    align-items: center;
    flex-direction: row;
    gap: .5rem;
  }

  .kap-page-shell.consumption-insights-page .consumption-analysis-toolbar { align-items: flex-end; flex-wrap: nowrap; }
  .kap-page-shell.consumption-insights-page .consumption-analysis-toolbar .consumption-records-toolbar__left { padding-inline-start: 0; }
  .kap-page-shell.consumption-insights-page .consumption-insights-context { align-items: stretch; flex-direction: column; width: 100%; }
  .kap-page-shell.consumption-insights-page .consumption-insights-filter { width: 100%; }
  .kap-page-shell.consumption-insights-page .consumption-insights-filter--account { flex: 1 1 100%; max-width: 100%; min-width: 0; width: 100%; }

  .kap-page-shell.consumption-insights-page .consumption-insights-filter select,
  .kap-page-shell.consumption-insights-page .consumption-insights-filter input { width: 100%; }
  .kap-page-shell__heading-actions { align-items: stretch; flex-direction: column; width: 100%; }
  .kap-page-shell__heading-actions > * { max-width: 100%; }
  .consumption-page__header h1,
  .kap-page-shell__heading h1 { font-size: 1.65rem; }
  .kap-page-shell__inner { gap: .65rem; padding: .7rem; }
  .kap-page-shell__masthead { gap: .65rem; }
  .kap-page-shell__masthead.is-compact { gap: .1rem; }
  .kap-page-shell.consumption-page .kap-page-shell__masthead { margin-bottom: .325rem; }
  .kap-page-filter { align-items: stretch; display: grid; grid-template-columns: minmax(0, 1fr); padding: .65rem; }
  .kap-page-shell.consumption-page .consumption-import-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: stretch; width: 100%; }
  .kap-page-shell.consumption-page .consumption-import-actions oj-button { min-width: 0; width: 100%; }
  .kap-page-shell.consumption-page .consumption-import-actions.is-compact oj-button { min-height: 2.75rem; }
  .kap-page-shell.consumption-page .kap-page-activity__refresh { min-height: 2.75rem; }

  .kap-page-shell.consumption-page .consumption-table-panel { margin-top: .375rem; }
  .kap-page-shell.consumption-page .kap-page-activity { justify-content: flex-end; }
  .consumption-records-toolbar { align-items: flex-end; flex-wrap: nowrap; }
  .consumption-records-toolbar__left { flex-wrap: wrap; }
  .consumption-records-toolbar-activity .kap-page-activity { gap: .25rem; min-width: 0; }
  .consumption-records-toolbar-activity .kap-page-activity__completed-at { font-size: .66rem; }
  .consumption-records-toolbar-activity .kap-page-activity__loading-group { flex-wrap: nowrap; }
  .kap-page-shell.consumption-page .consumption-record-search { max-width: none; width: 100%; }
}

@media (max-height: 520px) {
  .kap-page-shell__heading {
    align-items: stretch;
    flex-direction: column;
  }

  .kap-page-shell__heading-actions {
    justify-content: flex-start;
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kap-page-shell__scroll { scroll-behavior: auto; }
}

/* Consumption cross-page alignment (Records is the reference surface). */
.kap-page-shell.consumption-insights-page .kap-page-shell__body,
.kap-page-shell.forecast-actual-page .kap-page-shell__body {
  gap: .375rem;
}
.kap-page-shell.consumption-insights-page .consumption-page-progress-controls {
  inset: 0;
  pointer-events: none;
  position: fixed;
  z-index: 48;
}
.kap-page-shell.consumption-insights-page .consumption-page-progress-controls .kap-page-data-progress {
  left: var(--consumption-viewport-center-x, 50%);
  top: var(--consumption-viewport-center-y, 50%);
}
.kap-page-shell.consumption-insights-page .consumption-page-progress-controls[data-visible="false"] {
  display: none;
}
.kap-page-shell.consumption-insights-page .consumption-page-progress-controls[data-visible="true"] {
  display: block;
}
.kap-page-shell.forecast-actual-page .forecast-actual-results {
  gap: .375rem;
}
.kap-page-shell.consumption-insights-page .consumption-analysis-toolbar,
.kap-page-shell.forecast-actual-page .forecast-actual-data-toolbar {
  align-items: flex-end;
  min-height: 0;
}
.kap-page-shell.consumption-insights-page .consumption-insights-filter--account {
  flex: 0 1 18.75rem;
  max-width: 18.75rem;
  min-width: min(18.75rem, 100%);
  width: min(18.75rem, 100%);
}

/* Shared Redwood Light FY selector treatment; outlined chroming remains owned by JET. */
oj-menu-button.consumption-analysis-fy-button,
oj-menu-button.forecast-actual-fy-button {
  --oj-button-outlined-chrome-bg-color: #0b607d;
  --oj-button-outlined-chrome-border-color: #0b607d;
  --oj-button-outlined-chrome-text-color: #fff;
  --oj-button-outlined-chrome-bg-color-hover: #084d65;
  --oj-button-outlined-chrome-border-color-hover: #084d65;
  --oj-button-outlined-chrome-text-color-hover: #fff;
  --oj-button-outlined-chrome-bg-color-active: #084d65;
  --oj-button-outlined-chrome-border-color-active: #084d65;
  --oj-button-outlined-chrome-text-color-active: #fff;
  background: #0b607d;
  border-radius: .375rem;
  color: #fff;
  min-width: 5.75rem;
  white-space: nowrap;
}
oj-menu-button.consumption-analysis-fy-button:hover,
oj-menu-button.forecast-actual-fy-button:hover,
oj-menu-button.consumption-analysis-fy-button[aria-expanded="true"],
oj-menu-button.forecast-actual-fy-button[aria-expanded="true"] {
  background: #eaf1f4;
  background: #084d65;
  color: #fff;
}
oj-menu-button.consumption-analysis-fy-button:focus-within,
oj-menu-button.forecast-actual-fy-button:focus-within {
  border-radius: .375rem;
  outline: 2px solid #2f6f95;
  outline-offset: 2px;
}

/* Records keeps its viewport-fixed behavior while adopting the Forecast vs Actual button language. */
.consumption-viewport-controls .consumption-scroll-controls button {
  align-items: center;
  background: var(--oj-core-bg-color-content, #fff);
  border: 1px solid var(--oj-core-divider-color);
  border-radius: 50%;
  box-shadow: 0 2px 8px rgb(0 0 0 / 14%);
  color: var(--oj-core-text-color-primary);
  display: inline-flex;
  font-size: 1rem;
  height: 2rem;
  justify-content: center;
  padding: 0;
  width: 2rem;
}
.consumption-viewport-controls .consumption-scroll-controls button:hover:not(:disabled) {
  background: var(--oj-core-bg-color-hover, #f1efed);
}
.consumption-viewport-controls .consumption-scroll-controls button:focus-visible {
  outline: 2px solid var(--oj-core-focus-border-color);
  outline-offset: 1px;
}

/* Forecast vs Actual reuses the Records viewport controls while the matrix passes the viewport. */
.forecast-actual-matrix-frame {
  overflow: visible;
}
.forecast-actual-viewport-controls {
  z-index: 48;
}

.forecast-actual-quarter-cards article.is-selected {
  background: color-mix(in srgb, var(--oj-core-brand-color-1) 6%, var(--oj-core-bg-color-content));
  cursor: pointer;
}
.forecast-actual-quarter-actions button:focus-visible {
  outline: 2px solid var(--oj-core-focus-border-color);
  outline-offset: 1px;
}
.forecast-actual-monthly-totals th,
.forecast-actual-monthly-totals td {
  background: color-mix(in srgb, var(--oj-core-bg-color-neutral) 72%, var(--oj-core-bg-color-content));
  border-top: 1px solid var(--oj-core-divider-color);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  vertical-align: middle;
}
.forecast-actual-monthly-totals th {
  left: 0;
  position: sticky;
  text-align: left;
  z-index: 7;
}
.forecast-actual-monthly-totals .forecast-actual-total-label,
.forecast-actual-monthly-totals .forecast-actual-total-label-spacer {
  background: color-mix(in srgb, var(--oj-core-bg-color-neutral) 72%, var(--oj-core-bg-color-content));
  position: sticky;
  z-index: 9;
}
.forecast-actual-monthly-totals .forecast-actual-total-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.forecast-actual-monthly-totals .is-negative { color: #b42318; }
.forecast-actual-monthly-totals .is-positive { color: #18794e; }

@media (max-width: 760px) {
  .kap-page-shell.consumption-insights-page .consumption-insights-filter--account {
    flex: 1 1 100%;
    max-width: 100%;
    min-width: 0;
    width: 100%;
  }
  .kap-page-shell.consumption-insights-page .consumption-analysis-toolbar,
  .kap-page-shell.forecast-actual-page .forecast-actual-data-toolbar {
    align-items: center;
    min-height: 2.75rem;
  }
  .forecast-actual-data-toolbar .consumption-records-toolbar__left {
    align-items: center;
    flex-direction: row;
    gap: .55rem;
  }
}

/* Consumption design follow-up: shared loading, filtering and compact table controls. */
.kap-page-shell.consumption-insights-page .consumption-insights-filter--account { flex: 1 1 24rem; max-width: 32rem; min-width: min(24rem, 100%); }
.kap-page-shell.consumption-insights-page .consumption-insights-combobox { min-width: min(24rem, 100%); width: 100%; }
.consumption-insights-combobox input,
.consumption-insights-options,
.consumption-insights-options button,
.consumption-insights-options strong { min-width: 0; white-space: nowrap; }
.consumption-insights-options { width: 100%; }
.consumption-insights-options strong { display: block; overflow: hidden; text-overflow: ellipsis; }

.consumption-mtd-control { display: inline-flex; position: relative; }
.consumption-mtd-switch__label { align-items: flex-start; display: inline-flex; gap: .12rem; }
.consumption-mtd-switch__label sup {
  align-items: center; background: #f2efec; border: 1px solid #8b8580; border-radius: 50%;
  color: #5f5853; display: inline-flex; font-size: .52rem; font-weight: 800; height: .75rem;
  justify-content: center; line-height: 1; position: relative; top: -.18rem; width: .75rem;
}
.consumption-mtd-control:hover .consumption-info-tooltip__content,
.consumption-mtd-control:focus-within .consumption-info-tooltip__content {
  opacity: 1; transform: translate(-50%, 0); visibility: visible;
}

.kap-page-data-progress {
  background: rgba(255,255,255,.94); border: 1px solid #c9c2bc; border-radius: .45rem;
  box-shadow: 0 .35rem 1rem rgba(22,21,19,.13); box-sizing: border-box; padding: .48rem .6rem;
}
.kap-page-data-progress oj-progress-bar { min-height: .35rem; }

.consumption-analysis-fy-button { color: #fff; }

.forecast-actual-total-strip { grid-template-columns: repeat(2, minmax(8.5rem, 11rem)); justify-content: start; }
.forecast-actual-total-strip > span { min-width: 0; padding-inline: .8rem; }
.forecast-actual-total-strip em { display: none; }
.forecast-actual-quarter-cards article header small {
  border: 1px solid transparent; border-radius: 999px; display: inline-flex; font-size: .67rem;
  font-weight: 750; line-height: 1; padding: .28rem .48rem;
}
.forecast-actual-quarter-cards article header small.is-in-progress { background: #fff1cf; border-color: #e5bd57; color: #674d00; }
.forecast-actual-quarter-cards article header small.is-quarter-result { background: #e9f4ed; border-color: #8cbea0; color: #235c39; }
.forecast-actual-matrix-shell {
  --forecast-month-width: 4.75rem;
  --forecast-difference-width: 5.5rem;
  --forecast-status-width: 5.75rem;
}
.forecast-actual-status,
.forecast-actual-month-value.is-status { align-items: center; justify-content: center; text-align: center; }

@media (max-width: 760px) {
  .kap-page-shell.consumption-insights-page .consumption-insights-filter--account,
  .kap-page-shell.consumption-insights-page .consumption-insights-combobox { max-width: 100%; min-width: 100%; width: 100%; }
  .consumption-records-toolbar { align-items: stretch; flex-wrap: wrap; row-gap: .5rem; }
  .consumption-records-toolbar-activity { margin-inline-start: auto; }
  .forecast-actual-total-strip { grid-template-columns: repeat(2, minmax(7.5rem, 1fr)); }
}

.forecast-actual-account-search input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; display: none; }
.forecast-actual-account-search input[type="search"]::-ms-clear { display: none; height: 0; width: 0; }
.forecast-actual-monthly-totals .is-forecast { background: #edf7f9; }
.forecast-actual-monthly-totals .is-actual { background: #fff3f1; }
.forecast-actual-monthly-totals .is-difference { background: #f1f4f7; }
.forecast-actual-monthly-totals .is-status { background: #f7f5eb; }
.consumption-import-dates {
  align-items: center; color: var(--kpi-muted); display: inline-flex; flex-wrap: wrap; font-size: .7rem;
  font-variant-numeric: tabular-nums; gap: .35rem; justify-content: flex-end; margin-inline-end: .55rem;
}
@media (max-width: 760px) {
  .consumption-records-toolbar-activity { align-items: flex-end; flex-basis: 100%; flex-wrap: wrap; }
  .consumption-import-dates { flex: 1 1 100%; justify-content: flex-start; margin: 0; }
}

/* Consumption design follow-up 3: shared controls and table readability. */
.consumption-mtd-control { align-items: center; gap: .18rem; }
.consumption-mtd-switch { min-inline-size: auto; min-height: 2rem; }
.consumption-mtd-switch__label { font-size: .78rem; font-weight: 700; white-space: nowrap; }
.consumption-mtd-control .consumption-info-tooltip { align-self: flex-start; margin-left: -.15rem; margin-top: .05rem; }
.consumption-info-tooltip__trigger {
  border: 1px solid #2f6f95;
  border-radius: 50%;
  color: #2f6f95;
  font: 800 .68rem/1 Arial, sans-serif;
  height: 1rem;
  width: 1rem;
}
.consumption-info-tooltip__meta {
  border-top: 1px solid rgb(255 255 255 / 24%);
  display: block;
  margin-top: .35rem;
  padding-top: .35rem;
}
/* The tooltip belongs to the info icon only, not the Show MTD switch. */
.consumption-mtd-control:hover .consumption-info-tooltip__content,
.consumption-mtd-control:focus-within .consumption-info-tooltip__content {
  opacity: 0;
  transform: none;
  visibility: hidden;
}
.consumption-info-tooltip:hover .consumption-info-tooltip__content,
.consumption-info-tooltip:focus-within .consumption-info-tooltip__content {
  opacity: 1;
  transform: none;
  visibility: visible;
}
.consumption-info-tooltip__content {
  /* The control sits near the left edge on all three pages. Anchor the
     popover's left edge to the icon so its max-width cannot escape the
     viewport on desktop or mobile. */
  left: 0;
  right: auto;
  transform: none;
}

/* A darker Redwood-compatible fiscal-year control with a matching menu host. */
oj-menu-button.consumption-analysis-fy-button,
oj-menu-button.forecast-actual-fy-button {
  --oj-button-outlined-chrome-bg-color: #315b6e;
  --oj-button-outlined-chrome-border-color: #315b6e;
  --oj-button-outlined-chrome-text-color: #fff;
  --oj-button-outlined-chrome-bg-color-hover: #244b5e;
  --oj-button-outlined-chrome-border-color-hover: #244b5e;
  --oj-button-outlined-chrome-text-color-hover: #fff;
  --oj-button-outlined-chrome-bg-color-active: #173f52;
  --oj-button-outlined-chrome-border-color-active: #173f52;
  --oj-button-outlined-chrome-text-color-active: #fff;
  background: #315b6e;
  color: #fff;
}
oj-menu-button.consumption-analysis-fy-button:hover,
oj-menu-button.forecast-actual-fy-button:hover,
oj-menu-button.consumption-analysis-fy-button[aria-expanded="true"],
oj-menu-button.forecast-actual-fy-button[aria-expanded="true"] {
  background: #244b5e;
  color: #fff;
}
oj-menu.consumption-analysis-fy-menu {
  --oj-menu-item-text-color: #203f4e;
  background: #edf4f6;
  border-color: #7f9aaa;
  color: #203f4e;
}

/* Keep the three account selectors aligned and wide enough for the reference account. */
.kap-page-shell.consumption-page .consumption-record-search,
.kap-page-shell.consumption-insights-page .consumption-insights-filter--account,
.kap-page-shell.forecast-actual-page .forecast-actual-search-panel {
  box-sizing: border-box;
  flex: 0 1 18.75rem;
  max-width: 18.75rem;
  min-width: min(18.75rem, 100%);
  width: min(18.75rem, 100%);
}
.kap-page-shell.consumption-page .consumption-record-search input,
.kap-page-shell.forecast-actual-page .forecast-actual-account-search,
.kap-page-shell.forecast-actual-page .forecast-actual-account-search input {
  min-width: 0;
  width: 100%;
}

.forecast-actual-total-strip small {
  font-size: .72rem;
  font-weight: 800;
}
.forecast-actual-total-strip strong {
  color: #0b607d;
  font-size: 1rem;
  font-weight: 800;
}
.forecast-actual-total-strip .forecast-actual-total-mtd {
  color: var(--oj-core-text-color-secondary);
  display: block;
  font-size: .64rem;
  font-style: normal;
  grid-column: 1 / -1;
}
.forecast-actual-matrix thead th { font-size: .78rem; }
.forecast-actual-matrix .forecast-actual-group-header th { font-size: .8rem; }
.forecast-actual-matrix .forecast-actual-subheader th { font-size: .76rem; }
.forecast-actual-control { font-size: .72rem; line-height: 1.25; }
.forecast-actual-matrix-shell {
  --forecast-month-width: 5.6rem;
  --forecast-difference-width: 6.6rem;
  --forecast-status-width: 6.2rem;
}
.forecast-actual-monthly-totals tr.is-forecast-row > *,
.forecast-actual-monthly-totals tr.is-forecast-row .forecast-actual-total-label { background: #edf7f9; }
.forecast-actual-monthly-totals tr.is-actual-row > *,
.forecast-actual-monthly-totals tr.is-actual-row .forecast-actual-total-label { background: #fff3f1; }
.forecast-actual-monthly-totals tr.is-shortfall-row > *,
.forecast-actual-monthly-totals tr.is-shortfall-row .forecast-actual-total-label { background: #f1f4f7; }
.forecast-actual-monthly-totals tr.is-exceeded-row > *,
.forecast-actual-monthly-totals tr.is-exceeded-row .forecast-actual-total-label { background: #eef7f2; }
.forecast-actual-monthly-totals .forecast-actual-total-label {
  box-shadow: 2px 0 4px rgb(22 43 66 / 9%);
  left: 0;
  z-index: 12;
}

/* Forecast composition popup is portalled to body and positioned against the viewport. */
.consumption-forecast-tooltip__content.is-portal {
  bottom: auto;
  display: block;
  inset: auto;
  max-height: calc(100vh - 1rem);
  overflow: auto;
  position: fixed;
  transform: none;
  width: min(22rem, calc(100vw - 1rem));
  z-index: 1000;
}

@media (max-width: 760px) {
  .kap-page-shell.consumption-page .consumption-record-search,
  .kap-page-shell.consumption-insights-page .consumption-insights-filter--account,
  .kap-page-shell.forecast-actual-page .forecast-actual-search-panel {
    flex-basis: 100%;
    max-width: 100%;
    min-width: 0;
    width: 100%;
  }
  .consumption-info-tooltip__content:not(.home-consumption__info-tooltip-content) {
    bottom: .5rem;
    left: .5rem;
    max-height: calc(100vh - 1rem);
    max-width: none;
    overflow: auto;
    position: fixed;
    right: .5rem;
    top: auto;
    width: auto;
    z-index: 1000;
  }
}

/* Consumption follow-up: requested interaction and responsive sizing only. */
oj-menu-button.consumption-analysis-fy-button,
oj-menu-button.forecast-actual-fy-button {
  --oj-button-outlined-chrome-bg-color: #0b607d;
  --oj-button-outlined-chrome-border-color: #0b607d;
  --oj-button-outlined-chrome-text-color: #fff;
  --oj-button-outlined-chrome-bg-color-hover: #084f68;
  --oj-button-outlined-chrome-border-color-hover: #084f68;
  --oj-button-outlined-chrome-text-color-hover: #fff;
  --oj-button-outlined-chrome-bg-color-active: #08465d;
  --oj-button-outlined-chrome-border-color-active: #08465d;
  --oj-button-outlined-chrome-text-color-active: #fff;
  background: #0b607d;
  color: #fff;
}
oj-menu-button.consumption-analysis-fy-button:hover,
oj-menu-button.forecast-actual-fy-button:hover,
oj-menu-button.consumption-analysis-fy-button[aria-expanded="true"],
oj-menu-button.forecast-actual-fy-button[aria-expanded="true"],
oj-menu-button.consumption-analysis-fy-button:focus-within,
oj-menu-button.forecast-actual-fy-button:focus-within {
  background: #084f68;
  color: #fff;
}
.consumption-analysis-fy-menu {
  --oj-menu-item-bg-color-hover: #0b607d;
  --oj-menu-item-text-color-hover: #fff;
  --oj-menu-item-bg-color-focus: #0b607d;
  --oj-menu-item-text-color-focus: #fff;
}

.consumption-mtd-control { gap: .18rem; }
.consumption-mtd-switch { min-height: 2rem; min-inline-size: auto; }
.consumption-mtd-switch__label { font-size: .78rem; font-weight: 700; line-height: 1; white-space: nowrap; }
.consumption-mtd-control > .consumption-info-tooltip { align-self: flex-start; margin: .18rem .05rem 0 -.18rem; }
.consumption-mtd-control > .consumption-info-tooltip .consumption-info-tooltip__trigger { height: .82rem; width: .82rem; }

.kap-page-shell.consumption-page .consumption-record-search,
.kap-page-shell.consumption-insights-page .consumption-insights-filter--account,
.kap-page-shell.forecast-actual-page .forecast-actual-search-panel {
  box-sizing: border-box;
  flex: 0 1 18.75rem;
  max-width: 18.75rem;
  min-width: min(18.75rem, 100%);
  width: min(18.75rem, 100%);
}
.kap-page-shell.consumption-insights-page .consumption-insights-combobox,
.kap-page-shell.consumption-insights-page .consumption-insights-candidates { width: 100%; }

.forecast-actual-overview { grid-template-columns: minmax(13rem, 16rem) minmax(0, 1fr); }
.forecast-actual-total-strip {
  align-self: stretch;
  display: grid;
  gap: .4rem;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: repeat(2, minmax(0, 1fr));
  width: 100%;
}
.forecast-actual-total-strip > span {
  min-height: 0;
  padding: .42rem .55rem;
  position: relative;
  text-align: center;
}
.forecast-actual-total-strip small {
  font-size: .625rem;
  left: 50%;
  line-height: 1;
  max-width: calc(100% - .8rem);
  overflow: hidden;
  position: absolute;
  text-overflow: ellipsis;
  top: .3rem;
  transform: translateX(-50%);
  white-space: nowrap;
}
.forecast-actual-total-strip strong {
  font-size: 1rem;
  left: 50%;
  line-height: 1;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}
.forecast-actual-total-strip .forecast-actual-total-mtd {
  bottom: .25rem;
  font-size: .55rem;
  left: 50%;
  line-height: 1;
  margin: 0;
  min-height: 0;
  position: absolute;
  transform: translateX(-50%);
  white-space: nowrap;
}
.forecast-actual-total-mtd mark { background: transparent; color: #0b607d; font-weight: 850; }
.forecast-actual-quarter-cards article { cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease; }
.forecast-actual-quarter-cards article:hover,
.forecast-actual-quarter-cards article:focus-visible,
.forecast-actual-quarter-cards article.is-selected {
  background: color-mix(in srgb, var(--oj-core-brand-color-1) 7%, var(--oj-core-bg-color-content));
  border-color: var(--oj-core-brand-color-1);
  box-shadow: inset 0 0 0 1px var(--oj-core-brand-color-1);
  outline: none;
}
.forecast-actual-control,
.forecast-actual-control > span:first-child {
  font-size: .72rem;
  font-weight: 800;
  line-height: normal;
}
.forecast-actual-pillar .consumption-pillar-selector { margin-top: 0; }
.forecast-actual-pillar .consumption-pillar-selector button { font-size: .72rem; font-weight: 800; line-height: normal; }

.kap-page-shell.consumption-page .consumption-table-panel,
.kap-page-shell.consumption-page .consumption-table-content { flex: 1 1 auto; min-height: 0; }
.kap-page-shell.consumption-page .consumption-table-scroll { flex: 1 1 auto; min-height: 18rem; }
.consumption-records-count-summary {
  color: var(--kpi-muted);
  flex: 0 0 auto;
  font-size: .75rem;
  padding: .25rem .5rem;
  text-align: center;
}

@media (max-width: 760px) {
  .kap-page-shell.consumption-page .kap-page-shell__body { gap: .25rem; }
  .kap-page-shell.consumption-page .consumption-quarter-range { gap: .4rem; padding: .5rem .6rem; }
  .kap-page-shell.consumption-page .consumption-summary { margin: .375rem 0 .25rem; padding: .4rem .5rem; }
  .kap-page-shell.consumption-page .consumption-summary__toggle + * { margin-top: .3rem; }
  .kap-page-shell.consumption-page .consumption-table-panel,
  .kap-page-shell.consumption-page .consumption-table-scroll { min-height: 0; }
  .kap-page-shell.consumption-page .consumption-table-heading { margin-bottom: 0; }
  .kap-page-shell.consumption-page .consumption-record-search,
  .kap-page-shell.consumption-insights-page .consumption-insights-filter--account,
  .kap-page-shell.forecast-actual-page .forecast-actual-search-panel {
    flex-basis: 100%; max-width: 100%; min-width: 0; width: 100%;
  }
  .forecast-actual-overview { grid-template-columns: minmax(0, 1fr); }
  .forecast-actual-total-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(4.5rem, auto); }
}

/* Consumption design follow-up 4. */
oj-menu.consumption-analysis-fy-menu .oj-menu-item:not(.oj-disabled).oj-focus {
  --oj-core-bg-color-hover: #0b607d;
  --oj-menu-item-text-color: #fff;
}
.consumption-info-tooltip__trigger,
.consumption-mtd-control > .consumption-info-tooltip .consumption-info-tooltip__trigger {
  font-size: .46rem;
  height: .60rem;
  line-height: .60rem;
  width: .60rem;
}
.kap-page-shell.consumption-insights-page .consumption-info-tooltip { vertical-align: super; }
.consumption-mtd-control > .consumption-info-tooltip { margin-top: .10rem; vertical-align: middle; }

/* Filter refreshes keep the existing result surface mounted and compact. */
.kap-page-shell.forecast-actual-page .kap-page-shell__body,
.kap-page-shell.forecast-actual-page .forecast-actual-results {
  align-content: start;
  align-self: start;
  flex: 0 0 auto;
  min-height: 0;
  width: 100%;
}
.forecast-actual-overview { align-items: start; }
.forecast-actual-total-strip { grid-template-rows: repeat(2, minmax(3.75rem, auto)); }
.forecast-actual-total-strip > span { padding: .35rem .5rem; }
.forecast-actual-total-strip .forecast-actual-total-value {
  align-items: baseline;
  display: inline-flex;
  flex-wrap: nowrap;
  gap: .3rem;
  justify-content: center;
  left: 50%;
  max-width: calc(100% - 1rem);
  min-width: 0;
  position: absolute;
  top: 52%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}
.forecast-actual-total-value > strong,
.forecast-actual-total-card--forecast > strong {
  font-size: .95rem;
}
.forecast-actual-total-value > strong {
  left: auto;
  position: static;
  top: auto;
  transform: none;
}
.forecast-actual-total-strip .forecast-actual-total-value .forecast-actual-total-mtd {
  bottom: auto;
  font-size: .55rem;
  left: auto;
  position: static;
  transform: none;
}
.forecast-actual-quarter-cards article { gap: .3rem; padding: .42rem; }
.forecast-actual-quarter-actions button strong { font-size: .92rem; }
.forecast-actual-matrix .forecast-actual-status {
  line-height: 1.05;
  max-width: 5.4rem;
  overflow-wrap: normal;
  white-space: normal;
}
.forecast-actual-value-badge.is-no-forecast {
  background: #eef3f5;
  color: #315b6e;
}
.forecast-actual-monthly-totals td.forecast-actual-number { text-align: right; }
.forecast-actual-monthly-totals td:has(.forecast-actual-value-badge) { text-align: center; }
.consumption-records-toolbar__left { align-items: center; display: inline-flex; flex-wrap: wrap; gap: .45rem; }
.consumption-records-toolbar__left .consumption-records-count-summary { padding: 0; text-align: left; }
/* 37 Bark / Ivory FY selector — Oracle JET Film Strip supplies paging; custom controls preserve the approved skin. */
.fiscal-year-selector {
  align-items: center;
  background: #2f2923;
  border: 0;
  border-radius: 999px;
  box-shadow: 0 2px 5px rgba(29, 23, 18, .24), inset 0 1px 0 rgba(255, 247, 232, .09);
  box-sizing: border-box;
  display: inline-grid;
  flex: 0 0 auto;
  grid-template-columns: 1.75rem 3.15rem 1.75rem;
  height: 1.75rem;
  padding: .1875rem .25rem;
  width: 7.15rem;
}
.fiscal-year-selector__viewport {
  align-items: center;
  display: flex;
  height: 1.375rem;
  min-width: 0;
  overflow: hidden;
}
.fiscal-year-selector__filmstrip {
  color: #f6ead8;
  display: block;
  font-size: .89rem;
  font-weight: 700;
  height: 1.375rem;
  letter-spacing: .005em;
  line-height: 1.375rem;
  text-align: center;
  width: 100%;
}
.fiscal-year-selector__item {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  height: 1.375rem;
  justify-content: center;
  white-space: nowrap;
  width: 3.15rem;
}
.fiscal-year-selector__nav {
  -webkit-tap-highlight-color: transparent;
  align-items: center;
  appearance: none;
  background: linear-gradient(145deg, #3c352e, #2c2722);
  border: 0;
  border-radius: 50%;
  box-shadow: 0 1px 2px rgba(14, 11, 8, .34), inset 0 1px 0 rgba(255, 244, 224, .12);
  color: #f3e5d1;
  cursor: pointer;
  display: inline-flex;
  height: 1.375rem;
  justify-content: center;
  justify-self: center;
  padding: 0;
  position: relative;
  touch-action: manipulation;
  transition: background .12s ease, box-shadow .12s ease, transform .08s ease;
  width: 1.375rem;
  z-index: 1;
}
.fiscal-year-selector__nav::after {
  content: "";
  inset: -.6875rem;
  position: absolute;
}
.fiscal-year-selector__nav:hover {
  background: linear-gradient(145deg, #494038, #373029);
  box-shadow: 0 1px 3px rgba(14, 11, 8, .28), inset 0 1px 0 rgba(255, 244, 224, .17);
}
.fiscal-year-selector__nav:active {
  background: linear-gradient(145deg, #28231f, #342e28);
  box-shadow: inset 0 2px 3px rgba(12, 9, 7, .42), inset 0 -1px 0 rgba(255, 244, 224, .05);
  transform: translateY(1px);
}
.fiscal-year-selector__nav:disabled {
  background: linear-gradient(145deg, #37312b, #2d2925);
  box-shadow: inset 0 1px 0 rgba(255, 244, 224, .06);
  color: rgba(243, 229, 209, .38);
  cursor: default;
  transform: none;
}
.fiscal-year-selector__nav:disabled:hover,
.fiscal-year-selector__nav:disabled:active {
  background: linear-gradient(145deg, #37312b, #2d2925);
  box-shadow: inset 0 1px 0 rgba(255, 244, 224, .06);
  transform: none;
}
.fiscal-year-selector[data-disabled="true"] .fiscal-year-selector__filmstrip {
  color: rgba(246, 234, 216, .72);
}
.fiscal-year-selector__nav:focus-visible {
  outline: 2px solid #f6ead8;
  outline-offset: 2px;
}
.fiscal-year-selector__chevron {
  fill: none;
  height: .82rem;
  overflow: visible;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.45;
  width: .5rem;
}

.kap-page-shell.forecast-actual-page .forecast-actual-data-toolbar { align-items: center; }
.forecast-actual-toolbar-summary { align-items: center; display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: .75rem 1.5rem; min-width: 0; }
.forecast-actual-total-strip { align-items: baseline; display: flex; flex: 1 1 24rem; flex-wrap: wrap; gap: .45rem 1.6rem; grid-template-columns: none; width: auto; }
.forecast-actual-total-strip > span,
.forecast-actual-total-strip span { align-items: baseline; background: transparent; border: 0; border-radius: 0; display: inline-flex; gap: .42rem; min-height: 0; padding: 0; }
.forecast-actual-total-strip small { color: #5f6a64; font-size: .68rem; grid-column: auto; letter-spacing: .02em; }
.forecast-actual-total-strip strong { color: #16663e; font-size: 1rem; font-variant-numeric: tabular-nums; }
.forecast-actual-total-strip small,
.forecast-actual-total-strip strong {
  left: auto;
  max-width: none;
  position: static;
  top: auto;
  transform: none;
}
.forecast-actual-total-strip em { color: #5f6a64; display: inline; font-size: .67rem; font-style: normal; }
.forecast-actual-total-strip mark { background: transparent; color: #a45122; font-weight: 800; }
.forecast-actual-quarter-actions button strong { font-size: .86rem; }
.forecast-actual-month-value.is-actual.is-empty { text-align: right; }
.forecast-actual-month-value.is-actual .forecast-actual-value-badge.is-pending {
  align-items: center; display: inline-grid; justify-items: center; margin-inline: auto; text-align: center;
}
.forecast-actual-month-value.has-status-badge { text-align: center; vertical-align: middle; }
.forecast-actual-cell-center { align-items: center; display: flex; justify-content: center; width: 100%; }
.kap-page-shell.forecast-actual-page .kap-page-filter.forecast-actual-toolbar {
  flex: 0 0 auto;
}
.kap-page-shell.forecast-actual-page .forecast-actual-overview {
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
}
.kap-page-shell.forecast-actual-page .forecast-actual-quarter-cards {
  width: 100%;
}
.kap-page-shell.forecast-actual-page .kap-page-shell__body {
  align-content: start;
  grid-auto-rows: max-content;
}
.kap-page-shell.forecast-actual-page .forecast-actual-search-panel {
  align-content: start;
  align-self: flex-end;
  flex: 0 1 18.75rem;
  max-width: 18.75rem;
  min-height: 0;
  width: min(18.75rem, 100%);
}
.forecast-actual-total-value {
  position: static;
  margin-left: auto;
  text-align: right;
  transform: none;
}
.forecast-actual-month-value {
  justify-content: flex-end;
  text-align: right;
}
.forecast-actual-month-value.is-status {
  justify-content: center;
  text-align: center;
}
@media (max-width: 760px) {
  .forecast-actual-toolbar-summary { align-items: center; }
  .forecast-actual-total-strip { flex-basis: 100%; gap: .3rem 1rem; }
  .forecast-actual-total-strip > span { flex-wrap: wrap; }
}

@media (min-width: 601px) {
  .forecast-actual-total-strip small,
  .forecast-actual-total-strip strong {
    line-height: 2rem;
  }
}

@media (max-width: 600px) {
  .forecast-actual-data-toolbar {
    display: grid;
    gap: .5rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
  }

  .forecast-actual-toolbar-summary {
    display: contents;
  }

  .forecast-actual-total-strip {
    align-items: flex-start;
    align-self: center;
    flex: none;
    flex-direction: column;
    gap: .3rem;
    justify-self: center;
    min-width: 0;
  }

  .forecast-actual-total-strip > span {
    align-items: flex-start;
    flex-direction: column;
    gap: 0;
    min-width: 0;
  }

  .forecast-actual-data-toolbar .kap-page-activity {
    align-self: center;
    flex: none;
    justify-self: end;
    min-width: 0;
    width: auto;
  }
}

/* Consumption shared design standard: Analysis, Forecast vs Actual and Records only. */
.kap-page-shell.consumption-page .consumption-range-bar select,
.kap-page-shell.consumption-page .consumption-range-bar input,
.kap-page-shell.consumption-page .consumption-range-apply,
.kap-page-shell.consumption-page .consumption-pillar-selector button,
.kap-page-shell.consumption-insights-page .consumption-insights-filter select,
.kap-page-shell.consumption-insights-page .consumption-insights-filter input,
.kap-page-shell.consumption-insights-page .consumption-insights-pillar button,
.kap-page-shell.forecast-actual-page .forecast-actual-control select,
.kap-page-shell.forecast-actual-page .forecast-actual-search-panel input,
.kap-page-shell.forecast-actual-page .forecast-actual-pillar .consumption-pillar-selector button {
  height: var(--kap-consumption-control-height);
  min-height: var(--kap-consumption-control-height);
}

.kap-data-control-bar {
  min-width: 0;
  width: 100%;
}

.kap-page-shell.consumption-insights-page,
.kap-page-shell.forecast-actual-page,
.kap-page-shell.consumption-page {
  border-radius: var(--oj-core-border-radius-md, .2rem);
}

.forecast-actual-toolbar select,
.consumption-range-bar select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5' fill='none' stroke='%235f5b57' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: right .55rem center;
  background-repeat: no-repeat;
  background-size: .65rem .45rem;
  padding-inline-end: 1.75rem;
  padding-inline-start: .65rem;
}

.kap-page-shell.consumption-insights-page .consumption-insights-filter select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5' fill='none' stroke='%235f5b57' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: right .55rem center;
  background-repeat: no-repeat;
  background-size: .65rem .45rem;
  padding-inline-end: 1.75rem;
  padding-inline-start: .65rem;
}


/* Match the established Analysis native-field style without per-string pixel nudges. */
.consumption-insights-filter > select,
.consumption-insights-combobox > input,
.forecast-actual-control select,
.forecast-actual-account-search > input,
.consumption-range-bar select,
.consumption-record-search input {
  background-color: var(--oj-core-bg-color-content, #fff);
  border: 1px solid var(--oj-core-border-color-enabled, var(--kpi-border));
  color: var(--oj-core-text-color-primary, var(--kpi-ink));
  font-family: Arial, sans-serif;
  font-size: .72rem;
  font-weight: 400;
  line-height: normal;
}
.forecast-actual-sales-rep { flex: 0 0 auto; }
.forecast-actual-sales-rep select { width: max-content; }
.forecast-actual-search-panel {
  flex: 0 1 18.75rem;
  max-width: 18.75rem;
  min-width: 18rem;
  width: min(18.75rem, 28vw);
}
.forecast-actual-account-search > input { min-height: 2.6rem; width: 100%; }

@media (max-width: 720px) {
  .forecast-actual-sales-rep,
  .forecast-actual-sales-rep select,
  .kap-page-shell.forecast-actual-page .forecast-actual-search-panel {
    flex: 1 1 100%;
    max-width: none;
    min-width: 0;
    width: 100%;
  }

  /* Records has enough horizontal room for Show MTD/count and Reload. Do not
     force Reload onto a second 100%-wide row, which created a false 45px gap. */
  .kap-page-shell.consumption-page .consumption-records-toolbar {
    align-items: center;
    flex-wrap: nowrap;
    row-gap: 0;
  }
  .kap-page-shell.consumption-page .consumption-records-toolbar-activity {
    flex-basis: auto;
    flex-wrap: nowrap;
  }
}

.kpi-shell:has(.consumption-insights-page) .kpi-footer,
.kpi-shell:has(.consumption-page) .kpi-footer,
.kpi-shell:has(.kpi-spreadsheet-page) .kpi-footer {
  border-radius: .2rem;
  overflow: hidden;
}

.app-message-region.is-inline {
  inset: auto;
  position: static;
  width: 100%;
  z-index: auto;
}
.app-message-region.is-inline .app-message-region__actions {
  display: flex;
  justify-content: flex-end;
  margin-top: .375rem;
}
.app-message-region.is-inline .app-message-region__actions oj-button {
  min-height: var(--kap-consumption-control-height);
}