:root {
  --navy: #162033;
  --navy-light: #22304a;
  --blue: #2563eb;
  --blue-dark: #1d4ed8;
  --blue-light: #eff6ff;
  --green: #15803d;
  --green-light: #dcfce7;
  --red: #b91c1c;
  --red-light: #fee2e2;
  --orange: #c2410c;
  --orange-light: #ffedd5;
  --gray-50: #f8fafc;
  --gray-100: #f1f5f9;
  --gray-200: #e2e8f0;
  --gray-300: #cbd5e1;
  --gray-500: #64748b;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-900: #0f172a;
  --white: #ffffff;
  --sidebar-width: 260px;
  --topbar-height: 72px;
  --radius: 10px;
  --shadow: 0 4px 18px rgba(15, 23, 42, 0.08);
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--gray-900);
  background: var(--gray-100);
}

body {
  min-height: 100vh;
  margin: 0;
  background: var(--gray-100);
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

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

.hidden {
  display: none !important;
}

.full-width {
  width: 100%;
}

.fatal-message {
  padding: 16px;
  color: var(--white);
  text-align: center;
  background: var(--red);
}

/* Login */

.login-screen {
  display: grid;
  min-height: 100vh;
  padding: 24px;
  place-items: center;
  background:
    linear-gradient(135deg, rgba(22, 32, 51, 0.96), rgba(37, 99, 235, 0.88)),
    var(--navy);
}

.login-card {
  width: min(440px, 100%);
  padding: 34px;
  background: var(--white);
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
}

.brand-block,
.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 14px;
}

.brand-block {
  margin-bottom: 28px;
}

.brand-block h1 {
  margin: 0 0 5px;
  font-size: 25px;
}

.brand-block p {
  margin: 0;
  color: var(--gray-500);
  font-size: 14px;
}

.brand-logo {
  display: grid;
  width: 58px;
  height: 58px;
  color: var(--white);
  font-weight: 700;
  letter-spacing: 1px;
  background: var(--blue);
  border-radius: 14px;
  place-items: center;
}

.brand-logo.small {
  width: 42px;
  height: 42px;
  font-size: 13px;
  border-radius: 9px;
}

.login-note {
  margin: 20px 0 0;
  color: var(--gray-500);
  text-align: center;
  font-size: 12px;
}

/* Forms */

.form-group {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
}

.form-group label {
  color: var(--gray-700);
  font-size: 13px;
  font-weight: 700;
}

.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  min-height: 42px;
  padding: 9px 11px;
  color: var(--gray-900);
  background: var(--white);
  border: 1px solid var(--gray-300);
  border-radius: 7px;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.form-group textarea {
  min-height: 90px;
  resize: vertical;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.form-group input[readonly],
.form-group select:disabled {
  background: var(--gray-100);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr)) auto;
  align-items: end;
  gap: 14px;
}

/* Buttons */

.button,
.icon-button,
.link-button,
.nav-item,
.tab-button {
  border: 0;
}

.button {
  min-height: 40px;
  padding: 9px 16px;
  font-weight: 700;
  border-radius: 7px;
  transition: background 0.15s, transform 0.15s;
}

.button:active {
  transform: translateY(1px);
}

.primary-button {
  color: var(--white);
  background: var(--blue);
}

.primary-button:hover {
  background: var(--blue-dark);
}

.secondary-button {
  color: var(--gray-700);
  background: var(--gray-100);
  border: 1px solid var(--gray-300);
}

.secondary-button:hover {
  background: var(--gray-200);
}

.danger-button {
  color: var(--white);
  background: var(--red);
}

.icon-button {
  display: grid;
  width: 40px;
  height: 40px;
  padding: 0;
  color: var(--gray-700);
  background: transparent;
  border-radius: 7px;
  place-items: center;
}

.icon-button:hover {
  background: var(--gray-100);
}

.link-button {
  padding: 5px;
  color: var(--blue);
  font-weight: 700;
  background: transparent;
}

/* Main shell */

.app-shell {
  display: flex;
  min-height: 100vh;
}

.sidebar {
  position: fixed;
  z-index: 30;
  top: 0;
  bottom: 0;
  left: 0;
  display: flex;
  width: var(--sidebar-width);
  flex-direction: column;
  color: var(--white);
  background: var(--navy);
  box-shadow: 8px 0 24px rgba(15, 23, 42, 0.12);
}

.sidebar-brand {
  min-height: var(--topbar-height);
  padding: 14px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.sidebar-brand strong,
.sidebar-brand span {
  display: block;
}

.sidebar-brand span {
  margin-top: 3px;
  color: var(--gray-300);
  font-size: 12px;
}

.navigation {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 5px;
  padding: 18px 12px;
  overflow-y: auto;
}

.nav-item {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  color: var(--gray-300);
  text-align: left;
  background: transparent;
  border-radius: 8px;
}

.nav-item:hover {
  color: var(--white);
  background: rgba(255, 255, 255, 0.08);
}

.nav-item.active {
  color: var(--white);
  background: var(--blue);
}

.nav-icon {
  width: 20px;
  font-size: 17px;
  text-align: center;
}

.sidebar-footer {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 17px 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.sidebar-footer small {
  color: var(--gray-300);
}

.main-area {
  width: calc(100% - var(--sidebar-width));
  min-height: 100vh;
  margin-left: var(--sidebar-width);
}

.topbar {
  position: sticky;
  z-index: 20;
  top: 0;
  display: flex;
  min-height: var(--topbar-height);
  align-items: center;
  justify-content: space-between;
  padding: 10px 24px;
  background: var(--white);
  border-bottom: 1px solid var(--gray-200);
}

.topbar-left,
.topbar-right {
  display: flex;
  align-items: center;
  gap: 15px;
}

.topbar h2 {
  margin: 0;
  font-size: 20px;
}

.topbar p {
  margin: 4px 0 0;
  color: var(--gray-500);
  font-size: 12px;
}

.user-summary {
  text-align: right;
}

.user-summary strong,
.user-summary span {
  display: block;
}

.user-summary span {
  margin-top: 3px;
  color: var(--gray-500);
  font-size: 12px;
}

#menuToggle {
  display: none;
}

.content-area {
  padding: 22px;
}

.app-view.active {
  display: block;
}

/* Panels and headings */

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

.section-heading {
  margin-bottom: 18px;
}

.section-heading h3,
.panel-header h3 {
  margin: 0;
}

.section-heading h3 {
  font-size: 22px;
}

.section-heading p {
  margin: 5px 0 0;
  color: var(--gray-500);
  font-size: 13px;
}

.panel,
.filter-panel {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.panel {
  padding: 18px;
}

.filter-panel {
  margin-bottom: 18px;
  padding: 16px;
}

.panel-header {
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--gray-200);
}

.panel-header h3 {
  font-size: 16px;
}

.dashboard-grid,
.two-column-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 18px;
}

.audit-form {
  display: block;
}

.form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 18px;
}

/* Metrics */

.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(170px, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

.metric-grid.compact {
  grid-template-columns: repeat(3, minmax(160px, 1fr));
}

.metric-card {
  padding: 18px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-left: 4px solid var(--blue);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.metric-card span,
.metric-card strong,
.metric-card small {
  display: block;
}

.metric-card span {
  color: var(--gray-500);
  font-size: 13px;
  font-weight: 700;
}

.metric-card strong {
  margin: 10px 0 6px;
  color: var(--navy);
  font-size: 28px;
}

.metric-card small {
  color: var(--gray-500);
}

.chart-placeholder {
  display: grid;
  min-height: 250px;
  color: var(--gray-500);
  text-align: center;
  background: var(--gray-50);
  border: 1px dashed var(--gray-300);
  border-radius: 8px;
  place-items: center;
}

/* Tables */

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

table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
}

th,
td {
  padding: 11px 12px;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid var(--gray-200);
}

th {
  color: var(--gray-700);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  background: var(--gray-50);
}

td {
  color: var(--gray-700);
  font-size: 13px;
}

tbody tr:hover {
  background: var(--gray-50);
}

.empty-state {
  padding: 30px;
  color: var(--gray-500);
  text-align: center;
}

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

.table-button {
  padding: 6px 9px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 700;
  background: var(--blue-light);
  border: 0;
  border-radius: 5px;
}

/* Ratings */

.rating-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.rating-row {
  display: grid;
  grid-template-columns: 50px minmax(250px, 1fr) 150px 140px;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--gray-50);
  border: 1px solid var(--gray-200);
  border-radius: 7px;
}

.rating-number {
  color: var(--gray-500);
  font-weight: 700;
  text-align: center;
}

.rating-label strong,
.rating-label small {
  display: block;
}

.rating-label small {
  margin-top: 4px;
  color: var(--gray-500);
}

.rating-options {
  display: flex;
  gap: 5px;
}

.rating-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.rating-option label {
  display: inline-block;
  min-width: 42px;
  padding: 7px 8px;
  text-align: center;
  background: var(--white);
  border: 1px solid var(--gray-300);
  border-radius: 5px;
  cursor: pointer;
}

.rating-option input:checked + label {
  color: var(--white);
  background: var(--blue);
  border-color: var(--blue);
}

.rating-option.no input:checked + label {
  background: var(--red);
  border-color: var(--red);
}

.rating-option.na input:checked + label {
  background: var(--gray-600);
  border-color: var(--gray-600);
}

/* Status and messages */

.status-badge {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
}

.status-badge.success {
  color: var(--green);
  background: var(--green-light);
}

.status-badge.error {
  color: var(--red);
  background: var(--red-light);
}

.status-badge.warning {
  color: var(--orange);
  background: var(--orange-light);
}

.status-badge.neutral {
  color: var(--gray-600);
  background: var(--gray-200);
}

.message {
  margin: 12px 0;
  padding: 11px 12px;
  border-radius: 7px;
}

.error-message {
  color: var(--red);
  background: var(--red-light);
  border: 1px solid #fecaca;
}

.success-message {
  color: var(--green);
  background: var(--green-light);
  border: 1px solid #bbf7d0;
}

.notification-area {
  position: fixed;
  z-index: 80;
  top: 85px;
  right: 20px;
  display: flex;
  width: min(360px, calc(100% - 40px));
  flex-direction: column;
  gap: 10px;
}

.notification {
  padding: 13px 15px;
  background: var(--white);
  border-left: 4px solid var(--blue);
  border-radius: 7px;
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.18);
}

.notification.success {
  border-color: var(--green);
}

.notification.error {
  border-color: var(--red);
}

.notification.warning {
  border-color: var(--orange);
}

/* Tabs and pagination */

.tab-bar {
  display: flex;
  gap: 5px;
  margin-bottom: 15px;
  overflow-x: auto;
}

.tab-button {
  padding: 10px 14px;
  color: var(--gray-600);
  white-space: nowrap;
  background: var(--gray-200);
  border-radius: 7px;
}

.tab-button.active {
  color: var(--white);
  background: var(--blue);
}

.pagination {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  margin-top: 15px;
}

.pagination button {
  min-width: 34px;
  height: 34px;
  color: var(--gray-700);
  background: var(--white);
  border: 1px solid var(--gray-300);
  border-radius: 5px;
}

.pagination button.active {
  color: var(--white);
  background: var(--blue);
  border-color: var(--blue);
}

/* Modal */

.modal-overlay {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: grid;
  padding: 20px;
  background: rgba(15, 23, 42, 0.65);
  place-items: center;
}

.modal {
  width: min(760px, 100%);
  max-height: calc(100vh - 40px);
  overflow: hidden;
  background: var(--white);
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35);
}

.modal-header,
.modal-footer {
  display: flex;
  align-items: center;
  padding: 15px 18px;
}

.modal-header {
  justify-content: space-between;
  border-bottom: 1px solid var(--gray-200);
}

.modal-header h3 {
  margin: 0;
}

.modal-body {
  max-height: calc(100vh - 180px);
  padding: 18px;
  overflow-y: auto;
}

.modal-footer {
  justify-content: flex-end;
  gap: 9px;
  border-top: 1px solid var(--gray-200);
}

.access-denied {
  max-width: 550px;
  margin: 60px auto;
  text-align: center;
}

/* Responsive */

@media (max-width: 1100px) {
  .form-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }

  .filter-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }

  .metric-grid {
    grid-template-columns: repeat(2, minmax(170px, 1fr));
  }

  .rating-row {
    grid-template-columns: 40px minmax(220px, 1fr) 150px;
  }

  .rating-remarks {
    grid-column: 2 / -1;
  }
}

@media (max-width: 800px) {
  #menuToggle {
    display: grid;
  }

  .sidebar {
    transform: translateX(-100%);
    transition: transform 0.2s;
  }

  .sidebar.open {
    transform: translateX(0);
  }

  .main-area {
    width: 100%;
    margin-left: 0;
  }

  .topbar {
    padding: 10px 14px;
  }

  .content-area {
    padding: 15px;
  }

  .dashboard-grid,
  .two-column-grid {
    grid-template-columns: 1fr;
  }

  .user-summary {
    display: none;
  }
}

@media (max-width: 600px) {
  .login-card {
    padding: 24px 20px;
  }

  .form-grid,
  .filter-grid,
  .metric-grid,
  .metric-grid.compact {
    grid-template-columns: 1fr;
  }

  .section-heading,
  .panel-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .rating-row {
    grid-template-columns: 1fr;
  }

  .rating-number {
    text-align: left;
  }

  .rating-remarks {
    grid-column: auto;
  }

  .form-actions {
    flex-direction: column;
  }

  .form-actions .button {
    width: 100%;
  }
}

@media print {
  .sidebar,
  .topbar,
  .filter-panel,
  .form-actions,
  .button,
  .pagination {
    display: none !important;
  }

  .main-area {
    width: 100%;
    margin: 0;
  }

  .content-area {
    padding: 0;
  }

  .panel,
  .metric-card {
    box-shadow: none;
  }
}

/* ==========================================================
   V44 Premium Left Navigation
   ========================================================== */
@keyframes catNavActiveGlow {
  0%,100% { box-shadow: 0 8px 20px rgba(37,99,235,.18); }
  50% { box-shadow: 0 10px 26px rgba(37,99,235,.30); }
}
@keyframes catNavIconFloat {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-1px); }
}
@keyframes catSitePulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(45,212,191,0); }
  50% { box-shadow: 0 0 0 5px rgba(45,212,191,.07); }
}

.sidebar {
  background:
    radial-gradient(circle at 10% 0%, rgba(37,99,235,.18), transparent 34%),
    linear-gradient(180deg, #0f1c31 0%, #101d32 56%, #0b1729 100%);
  border-right: 1px solid rgba(148,163,184,.08);
}

.sidebar-brand {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,0));
}
.sidebar-brand::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(96,165,250,.28), transparent);
}

.navigation.premium-navigation {
  gap: 6px;
  padding: 14px 11px 18px;
  scrollbar-width: thin;
  scrollbar-color: rgba(148,163,184,.32) transparent;
}
.navigation.premium-navigation::-webkit-scrollbar { width: 5px; }
.navigation.premium-navigation::-webkit-scrollbar-thumb {
  background: rgba(148,163,184,.32);
  border-radius: 999px;
}

.nav-primary-block {
  display: grid;
  gap: 7px;
  margin-bottom: 4px;
}

.nav-section-label {
  margin: 11px 10px 3px;
  color: rgba(148,163,184,.68);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1.15px;
  line-height: 1;
  user-select: none;
}

.navigation.premium-navigation .nav-item {
  position: relative;
  min-height: 54px;
  gap: 10px;
  padding: 8px 10px;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 13px;
  color: #cbd5e1;
  transition:
    transform .18s ease,
    color .18s ease,
    background .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

.navigation.premium-navigation .nav-item::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(100deg, rgba(59,130,246,.10), rgba(14,165,233,.04), rgba(45,212,191,.08));
  transition: opacity .18s ease;
}

.navigation.premium-navigation .nav-item:hover {
  transform: translateX(3px);
  color: #fff;
  border-color: rgba(125,211,252,.16);
  background: rgba(255,255,255,.055);
  box-shadow: 0 8px 20px rgba(2,8,23,.18);
}
.navigation.premium-navigation .nav-item:hover::before { opacity: 1; }

.nav-icon-premium {
  position: relative;
  z-index: 1;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #93c5fd;
  background: linear-gradient(145deg, rgba(59,130,246,.16), rgba(14,165,233,.08));
  border: 1px solid rgba(147,197,253,.13);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  transition: color .18s ease, background .18s ease, transform .18s ease;
}
.nav-icon-premium svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.nav-copy {
  position: relative;
  z-index: 1;
  min-width: 0;
  flex: 1;
}
.nav-copy strong {
  display: block;
  overflow: hidden;
  color: inherit;
  font-size: 13px;
  font-weight: 760;
  line-height: 1.25;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.nav-copy small {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: #8293a9;
  font-size: 9.5px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: color .18s ease;
}

.nav-active-dot {
  position: relative;
  z-index: 1;
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: transparent;
  transition: background .18s ease, box-shadow .18s ease;
}

.navigation.premium-navigation .nav-item:hover .nav-icon-premium {
  transform: scale(1.04);
  color: #bae6fd;
  background: linear-gradient(145deg, rgba(59,130,246,.22), rgba(14,165,233,.12));
}
.navigation.premium-navigation .nav-item:hover .nav-copy small { color: #a9bad0; }

.navigation.premium-navigation .nav-item.active {
  color: #fff;
  border-color: rgba(125,211,252,.20);
  background: linear-gradient(115deg, #2563eb 0%, #1d4ed8 52%, #0f6db1 100%);
  animation: catNavActiveGlow 4.2s ease-in-out infinite;
}
.navigation.premium-navigation .nav-item.active::before {
  opacity: 1;
  background:
    radial-gradient(circle at 88% 20%, rgba(255,255,255,.18), transparent 26%),
    linear-gradient(100deg, rgba(255,255,255,.04), transparent);
}
.navigation.premium-navigation .nav-item.active .nav-icon-premium {
  color: #fff;
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.20);
  animation: catNavIconFloat 3.2s ease-in-out infinite;
}
.navigation.premium-navigation .nav-item.active .nav-copy small { color: rgba(255,255,255,.72); }
.navigation.premium-navigation .nav-item.active .nav-active-dot {
  background: #a7f3d0;
  box-shadow: 0 0 0 4px rgba(167,243,208,.12), 0 0 14px rgba(45,212,191,.45);
}

/* Site Profile is deliberately the first module above Dashboard. */
.navigation.premium-navigation .nav-item-site {
  border-color: rgba(45,212,191,.13);
  background: linear-gradient(110deg, rgba(13,148,136,.10), rgba(8,145,178,.05));
}
.navigation.premium-navigation .nav-item-site .nav-icon-premium {
  color: #5eead4;
  background: linear-gradient(145deg, rgba(13,148,136,.19), rgba(8,145,178,.09));
  border-color: rgba(94,234,212,.16);
  animation: catSitePulse 4.6s ease-in-out infinite;
}
.navigation.premium-navigation .nav-item-site.active {
  background: linear-gradient(115deg, #0f766e 0%, #0e7490 58%, #075985 100%);
  border-color: rgba(94,234,212,.26);
}
.navigation.premium-navigation .nav-item-site.active .nav-icon-premium {
  color: #fff;
  background: rgba(255,255,255,.14);
}

/* Footer visually matches the premium menu. */
.sidebar-footer {
  background: linear-gradient(180deg, rgba(255,255,255,.01), rgba(0,0,0,.08));
  border-top-color: rgba(148,163,184,.11);
}

/* Keep small-screen behavior clean. */
@media (max-width: 800px) {
  .navigation.premium-navigation .nav-item {
    min-height: 50px;
  }
  .nav-icon-premium {
    flex-basis: 34px;
    width: 34px;
    height: 34px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .navigation.premium-navigation .nav-item,
  .navigation.premium-navigation .nav-item.active,
  .navigation.premium-navigation .nav-item-site .nav-icon-premium,
  .navigation.premium-navigation .nav-item.active .nav-icon-premium {
    animation: none !important;
    transition: none !important;
  }
}


/* ==========================================================
   V46 Eye-Catching Left Navigation + Visible Scroll Guidance
   ========================================================== */
@keyframes catNavShimmerV46 {
  0% { transform: translateX(-130%) skewX(-14deg); opacity: 0; }
  20% { opacity: .22; }
  55% { opacity: .10; }
  100% { transform: translateX(230%) skewX(-14deg); opacity: 0; }
}
@keyframes catNavDotV46 {
  0%,100% { transform: scale(.86); box-shadow: 0 0 0 3px rgba(94,234,212,.09),0 0 11px rgba(94,234,212,.22); }
  50% { transform: scale(1.15); box-shadow: 0 0 0 5px rgba(94,234,212,.10),0 0 18px rgba(94,234,212,.48); }
}
@keyframes catNavRailGlowV46 {
  0%,100% { filter: drop-shadow(0 0 2px rgba(56,189,248,.12)); }
  50% { filter: drop-shadow(0 0 7px rgba(56,189,248,.40)); }
}

.sidebar {
  isolation: isolate;
}

.navigation.premium-navigation {
  position: relative;
  padding-right: 16px;
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
  scrollbar-width: auto;
  scrollbar-color: rgba(56,189,248,.72) rgba(148,163,184,.09);
}

/* Chrome / Edge / Safari: make the native scroll bar clearly visible. */
.navigation.premium-navigation::-webkit-scrollbar {
  width: 8px;
}
.navigation.premium-navigation::-webkit-scrollbar-track {
  margin: 7px 0;
  border-radius: 999px;
  background: rgba(148,163,184,.08);
  box-shadow: inset 0 0 0 1px rgba(148,163,184,.05);
}
.navigation.premium-navigation::-webkit-scrollbar-thumb {
  min-height: 44px;
  border: 2px solid transparent;
  border-radius: 999px;
  background:
    linear-gradient(180deg,#38bdf8,#14b8a6) padding-box;
  box-shadow: 0 0 14px rgba(56,189,248,.22);
}
.navigation.premium-navigation::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg,#7dd3fc,#2dd4bf) padding-box;
}

/* Each route gets a subtle visual identity. */
.navigation.premium-navigation .nav-item[data-route="dashboard"] .nav-icon-premium {
  color:#93c5fd;background:linear-gradient(145deg,rgba(37,99,235,.22),rgba(59,130,246,.08));
}
.navigation.premium-navigation .nav-item[data-route="cdr-sampling"] .nav-icon-premium {
  color:#67e8f9;background:linear-gradient(145deg,rgba(8,145,178,.22),rgba(6,182,212,.08));
}
.navigation.premium-navigation .nav-item[data-route="cdr-analytics"] .nav-icon-premium {
  color:#c4b5fd;background:linear-gradient(145deg,rgba(109,40,217,.20),rgba(124,58,237,.07));
}
.navigation.premium-navigation .nav-item[data-route="qa-audit"] .nav-icon-premium {
  color:#86efac;background:linear-gradient(145deg,rgba(22,163,74,.20),rgba(34,197,94,.07));
}
.navigation.premium-navigation .nav-item[data-route="po-audit"] .nav-icon-premium {
  color:#fde68a;background:linear-gradient(145deg,rgba(202,138,4,.20),rgba(245,158,11,.07));
}
.navigation.premium-navigation .nav-item[data-route="audit-list"] .nav-icon-premium {
  color:#bfdbfe;background:linear-gradient(145deg,rgba(59,130,246,.18),rgba(30,64,175,.06));
}
.navigation.premium-navigation .nav-item[data-route="rebuttals"] .nav-icon-premium {
  color:#fdba74;background:linear-gradient(145deg,rgba(234,88,12,.19),rgba(249,115,22,.06));
}
.navigation.premium-navigation .nav-item[data-route="import-export"] .nav-icon-premium {
  color:#5eead4;background:linear-gradient(145deg,rgba(13,148,136,.20),rgba(20,184,166,.07));
}
.navigation.premium-navigation .nav-item[data-route="documentation"] .nav-icon-premium {
  color:#f0abfc;background:linear-gradient(145deg,rgba(192,38,211,.18),rgba(217,70,239,.06));
}
.navigation.premium-navigation .nav-item[data-route="admin"] .nav-icon-premium {
  color:#cbd5e1;background:linear-gradient(145deg,rgba(100,116,139,.20),rgba(148,163,184,.06));
}

/* Richer active state, but still professional. */
.navigation.premium-navigation .nav-item.active {
  overflow: hidden;
  transform: translateX(2px);
}
.navigation.premium-navigation .nav-item.active::after {
  content:"";
  position:absolute;
  z-index:0;
  top:-10%;
  left:-40%;
  width:34%;
  height:120%;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  animation:catNavShimmerV46 5.6s ease-in-out infinite;
}
.navigation.premium-navigation .nav-item.active .nav-active-dot {
  animation:catNavDotV46 2.8s ease-in-out infinite;
}

/* More visual separation between navigation groups. */
.nav-section-label {
  position:relative;
  display:flex;
  align-items:center;
  gap:7px;
  margin-top:13px;
}
.nav-section-label::after {
  content:"";
  height:1px;
  flex:1;
  background:linear-gradient(90deg,rgba(125,211,252,.16),transparent);
}

/* Secondary custom rail mirrors scroll progress and stays visible. */
.cat-nav-rail {
  position:absolute;
  z-index:45;
  top:calc(var(--topbar-height) + 16px);
  right:4px;
  bottom:82px;
  width:4px;
  overflow:hidden;
  pointer-events:none;
  border-radius:999px;
  background:rgba(148,163,184,.08);
  opacity:.30;
  transition:opacity .18s ease;
}
.sidebar.cat-nav-can-scroll .cat-nav-rail {
  opacity:1;
  animation:catNavRailGlowV46 3.5s ease-in-out infinite;
}
.cat-nav-rail-thumb {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  min-height:28px;
  border-radius:999px;
  background:linear-gradient(180deg,#38bdf8,#2dd4bf);
  transition:height .18s ease,transform .12s linear;
}

/* Floating scroll controls remain accessible above the footer. */
.cat-nav-scroll-controls {
  position:absolute;
  z-index:48;
  right:11px;
  bottom:78px;
  display:grid;
  gap:5px;
  opacity:0;
  transform:translateY(5px);
  pointer-events:none;
  transition:opacity .18s ease,transform .18s ease;
}
.sidebar.cat-nav-can-scroll .cat-nav-scroll-controls {
  opacity:1;
  transform:none;
  pointer-events:auto;
}
.cat-nav-scroll-btn {
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  padding:0;
  cursor:pointer;
  color:#dff7ff;
  border:1px solid rgba(125,211,252,.20);
  border-radius:10px;
  background:rgba(8,47,73,.88);
  box-shadow:0 7px 17px rgba(0,0,0,.22);
  backdrop-filter:blur(8px);
  transition:transform .16s ease,background .16s ease,opacity .16s ease;
}
.cat-nav-scroll-btn:hover:not(:disabled) {
  transform:translateY(-1px) scale(1.04);
  background:rgba(14,116,144,.96);
}
.cat-nav-scroll-btn:disabled {
  opacity:.24;
  cursor:default;
}
.cat-nav-scroll-btn svg {
  width:15px;
  height:15px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Subtle fade at navigation edges signals that more items exist. */
.navigation.premium-navigation::before,
.navigation.premium-navigation::after {
  content:"";
  position:sticky;
  z-index:10;
  left:0;
  right:0;
  height:10px;
  pointer-events:none;
}
.navigation.premium-navigation::before {
  top:0;
  margin-top:-14px;
  background:linear-gradient(180deg,#101d32 15%,transparent);
}
.navigation.premium-navigation::after {
  bottom:0;
  margin-top:-10px;
  background:linear-gradient(0deg,#0d192c 12%,transparent);
}

@media (max-width:800px) {
  .cat-nav-rail,.cat-nav-scroll-controls { display:none !important; }
  .navigation.premium-navigation { padding-right:11px; scrollbar-width:thin; }
}

@media (prefers-reduced-motion:reduce) {
  .navigation.premium-navigation .nav-item.active::after,
  .navigation.premium-navigation .nav-item.active .nav-active-dot,
  .sidebar.cat-nav-can-scroll .cat-nav-rail {
    animation:none !important;
  }
}


/* ==========================================================
   V47 Quality Performance Pulse Dashboard
   Inspired by the workbook "Quality Dashboard" layout
   ========================================================== */
.quality-pulse{--qp-navy:#123b63;--qp-blue:#0f5d8d;--qp-teal:#0d8790;--qp-line:#d8e3ee;--qp-soft:#f5f8fc;--qp-text:#172033;display:grid;gap:16px;color:var(--qp-text)}
.pulse-hero{border-radius:19px;padding:20px 23px;color:#fff;background:linear-gradient(115deg,#123b63,#0f5d8d 55%,#0c8588);box-shadow:0 14px 32px rgba(15,61,95,.16)}
.pulse-eyebrow{font-size:20px;font-weight:950;letter-spacing:.7px}.pulse-hero h2{margin:7px 0 5px;font-size:13px;font-weight:800;line-height:1.45;color:#e8f5ff}.pulse-hero p{margin:0;font-size:10px;font-weight:800;letter-spacing:.2px;color:#d5e9f5}
.pulse-filter-panel{display:grid;grid-template-columns:repeat(6,minmax(110px,1fr));gap:10px;padding:12px;border:1px solid var(--qp-line);border-radius:15px;background:#fff;box-shadow:0 7px 18px rgba(15,23,42,.05)}
.pulse-filter{display:grid;gap:5px}.pulse-filter label{font-size:9px;font-weight:900;color:#5f7085;letter-spacing:.65px}.pulse-filter select{height:36px;border:1px solid #cdd9e5;border-radius:9px;background:#f8fbff;padding:0 9px;color:#162236;font-weight:800}.pulse-filter.wide{grid-column:span 1}
.pulse-matrix-card,.pulse-analysis-card,.pulse-fatal-card{border:1px solid var(--qp-line);border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.055);overflow:hidden}
.pulse-section-heading{display:grid;grid-template-columns:1fr 1fr 260px;background:linear-gradient(90deg,#123b63,#176b8d);color:#fff;min-height:43px}
.pulse-section-heading>div{padding:9px 12px;border-right:1px solid rgba(255,255,255,.15);display:flex;flex-direction:column;justify-content:center}.pulse-section-heading span{font-size:9px;font-weight:900;letter-spacing:.8px}.pulse-section-heading strong{font-size:11px}
.pulse-table-wrap{overflow:auto}.pulse-matrix{min-width:1450px;border-collapse:collapse;width:100%}.pulse-matrix th,.pulse-matrix td{border-right:1px solid #e5edf5;border-bottom:1px solid #e5edf5;padding:8px 7px;text-align:center;font-size:10px;white-space:nowrap}
.pulse-matrix thead th{position:sticky;top:0;z-index:2;background:#eaf2f8;color:#294158;font-weight:900}.pulse-matrix thead th:first-child,.pulse-matrix thead th:nth-child(2){background:#dceaf4}
.pulse-kpi-name{text-align:left!important;font-weight:900;color:#17344e;background:#f5f9fc;min-width:150px}.pulse-source{font-weight:900}.pulse-source-primary .pulse-source{color:#0b6d77}.pulse-matrix tr:hover td{background:#fbfdff}.pulse-matrix .current-week{background:#e0f2fe!important;font-weight:950;color:#075985}.pulse-matrix th small{font-size:7px}.pulse-delta.up{color:#15803d;font-weight:900}.pulse-delta.down{color:#b91c1c;font-weight:900}
.pulse-status,.pulse-pill{display:inline-flex;align-items:center;border-radius:999px;padding:4px 7px;font-size:8px;font-weight:900}.pulse-status.good,.pulse-pill.good{background:#dcfce7;color:#166534}.pulse-status.warn,.pulse-pill.warn{background:#fef3c7;color:#92400e}.pulse-status.bad,.pulse-pill.bad{background:#fee2e2;color:#991b1b}.pulse-status.neutral,.pulse-pill.neutral{background:#e2e8f0;color:#475569}
.pulse-guide{padding:9px 12px;background:#f7fafc;border-top:1px solid var(--qp-line);color:#62748a;font-size:9px;font-weight:800}
.pulse-title-bar{padding:10px 14px;border-radius:10px;background:linear-gradient(90deg,#123b63,#0f5d8d);color:#fff;font-size:12px;font-weight:950;letter-spacing:.6px}
.pulse-kpi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.pulse-kpi-card{padding:14px;border:1px solid var(--qp-line);border-radius:15px;background:linear-gradient(180deg,#fff,#f8fbfe);box-shadow:0 6px 16px rgba(15,23,42,.04)}.pulse-kpi-card-top,.pulse-kpi-card-foot{display:flex;justify-content:space-between;gap:8px;align-items:center}.pulse-kpi-card-top>span:first-child{font-size:11px;font-weight:900;color:#29445c}.pulse-kpi-card-main{display:flex;align-items:end;justify-content:space-between;margin:11px 0}.pulse-kpi-card-main strong{font-size:26px;color:#123b63}.pulse-kpi-card-main small{color:#718198;font-weight:800}.pulse-kpi-card-foot{font-size:9px;color:#64748b}.pulse-kpi-card-foot b.up{color:#15803d}.pulse-kpi-card-foot b.down{color:#b91c1c}
.pulse-analysis-grid{display:grid;grid-template-columns:1fr 1fr .85fr;gap:12px}.pulse-card-head{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:12px 14px;background:#eef5fa;border-bottom:1px solid var(--qp-line);color:#29445c}.pulse-card-head strong{font-size:11px}.pulse-card-head span{font-size:9px;color:#718198;font-weight:800}
.pulse-analysis-card table,.pulse-fatal-card table{width:100%;border-collapse:collapse}.pulse-analysis-card th,.pulse-analysis-card td,.pulse-fatal-card th,.pulse-fatal-card td{padding:9px 11px;border-bottom:1px solid #e8eef5;font-size:10px}.pulse-analysis-card th,.pulse-fatal-card th{background:#f7fafc;color:#5d7187;text-align:left;font-size:9px}.pulse-analysis-card td:nth-child(n+2){text-align:center}
.pulse-ranking{padding-bottom:12px}.pulse-rank-box{margin:12px;border-radius:13px;padding:13px;border:1px solid #e1e9f2}.pulse-rank-box small{display:block;font-size:8px;font-weight:950;letter-spacing:.7px}.pulse-rank-box strong{display:block;margin:4px 0;font-size:13px}.pulse-rank-box span{font-size:19px;font-weight:950}.pulse-rank-box.top{background:#effcf4;color:#166534}.pulse-rank-box.bottom{background:#fff4f4;color:#991b1b}
.pulse-fatal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 15px;background:linear-gradient(90deg,#7f1d1d,#b42318);color:#fff}.pulse-fatal-head span{display:block;font-size:13px;font-weight:950;letter-spacing:.7px}.pulse-fatal-head strong{display:block;margin-top:2px;font-size:10px}.pulse-fatal-head small{font-size:9px;opacity:.82}
@media(max-width:1200px){.pulse-filter-panel{grid-template-columns:repeat(3,1fr)}.pulse-kpi-grid{grid-template-columns:repeat(2,1fr)}.pulse-analysis-grid{grid-template-columns:1fr 1fr}.pulse-ranking{grid-column:span 2}}
@media(max-width:760px){.pulse-filter-panel,.pulse-kpi-grid,.pulse-analysis-grid{grid-template-columns:1fr}.pulse-ranking{grid-column:auto}.pulse-section-heading{grid-template-columns:1fr}.pulse-section-heading>div{border-bottom:1px solid rgba(255,255,255,.12)}}


/* ==========================================================
   V49 — V47 Style, Fully Dynamic
   ========================================================== */
.v49-pulse{gap:16px}
.v49-filter select:disabled{background:#eef7fb;color:#075985;font-weight:900}
.v49-behavior,.v49-table-card,.v49-oneview{border:1px solid #d8e3ee;border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.055);overflow:hidden}
.v49-section-head{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;background:linear-gradient(90deg,#123b63,#176b8d);color:#fff}.v49-section-head span{display:block;font-size:9px;font-weight:950;letter-spacing:.8px;opacity:.8}.v49-section-head strong{display:block;margin-top:2px;font-size:12px}.v49-section-head select{height:32px;border:1px solid rgba(255,255,255,.25);border-radius:8px;background:rgba(255,255,255,.12);color:#fff;padding:0 8px;font-weight:800}.v49-section-head select option{color:#172033}
.v49-behavior-grid{display:grid;grid-template-columns:minmax(0,1.7fr) .5fr .5fr;gap:12px;padding:13px}.v49-month-cards{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.v49-month-card{border:1px solid #dbe6ef;border-radius:11px;background:linear-gradient(180deg,#fff,#f5f9fc);padding:10px 6px;cursor:pointer;transition:transform .15s,border-color .15s}.v49-month-card:hover{transform:translateY(-2px);border-color:#7dd3fc}.v49-month-card small,.v49-month-card strong{display:block}.v49-month-card small{font-size:8px;color:#64748b;font-weight:900}.v49-month-card strong{margin-top:5px;font-size:17px;color:#123b63}
.v49-rank{padding:12px;border-radius:12px;border:1px solid #e1e9f2;display:flex;flex-direction:column;justify-content:center}.v49-rank small{font-size:8px;font-weight:950}.v49-rank strong{font-size:13px;margin:4px 0}.v49-rank span{font-size:20px;font-weight:950}.v49-rank.top{background:#effcf4;color:#166534}.v49-rank.bottom{background:#fff4f4;color:#991b1b}
.v49-link-btn,.v49-cell-link,.v49-kpi-link{border:0;background:none;color:#075985;font-weight:900;cursor:pointer;padding:2px 4px;border-radius:6px}.v49-link-btn{font-size:8px}.v49-cell-link,.v49-kpi-link{font-size:10px;text-align:left}.v49-link-btn:hover,.v49-cell-link:hover,.v49-kpi-link:hover{background:#e0f2fe;text-decoration:underline}
.v49-table-card table,.v49-oneview table{width:100%;border-collapse:collapse}.v49-table-card th,.v49-table-card td,.v49-oneview th,.v49-oneview td{padding:9px 10px;border-bottom:1px solid #e8eef5;font-size:10px}.v49-table-card th,.v49-oneview th{background:#eef5fa;color:#5d7187;text-align:left;font-size:9px;font-weight:950}.v49-table-card tbody tr:hover,.v49-oneview tbody tr:hover{background:#fbfdff}.v49-wide{min-width:930px}.v49-empty{text-align:center!important;color:#94a3b8;padding:18px!important}
.v49-modal{position:fixed;inset:0;z-index:9999;display:none}.v49-modal.open{display:block}.v49-backdrop{position:absolute;inset:0;background:rgba(2,8,23,.55);backdrop-filter:blur(3px)}.v49-modal-card{position:absolute;top:6vh;left:50%;transform:translateX(-50%);width:min(900px,92vw);max-height:88vh;display:flex;flex-direction:column;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 28px 70px rgba(0,0,0,.28)}.v49-modal-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:linear-gradient(90deg,#123b63,#0f5d8d);color:#fff}.v49-modal-head span{display:block;font-size:10px;font-weight:950}.v49-modal-head strong{display:block;font-size:13px;margin-top:2px}.v49-modal-head button{width:34px;height:34px;border:1px solid rgba(255,255,255,.2);border-radius:9px;background:rgba(255,255,255,.1);color:#fff;font-size:21px}.v49-modal-body{overflow:auto}.v49-modal-body table{width:100%;border-collapse:collapse}.v49-modal-body th,.v49-modal-body td{padding:10px 12px;border-bottom:1px solid #e8eef5;font-size:10px;text-align:left}.v49-modal-body th{position:sticky;top:0;background:#eef5fa}
@media(max-width:1100px){.v49-behavior-grid{grid-template-columns:1fr 1fr}.v49-month-cards{grid-column:span 2}.v49-month-cards{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.v49-behavior-grid{grid-template-columns:1fr}.v49-month-cards{grid-column:auto;grid-template-columns:repeat(2,1fr)}}


/* ==========================================================
   V50 — 4K readable dashboard polish
   ========================================================== */
.v50-pulse{--v50-navy:#0f2747;--v50-blue:#0f5c87;--v50-cyan:#10b4d2;--v50-good-bg:#e8f8ee;--v50-good:#0f7a3d;--v50-warn-bg:#fff4dd;--v50-warn:#9a5b00;--v50-bad-bg:#fdeaea;--v50-bad:#b42318;--v50-neutral-bg:#eff4f8;--v50-neutral:#516274}
.v50-pulse .pulse-hero{background:linear-gradient(135deg,var(--v50-navy),var(--v50-blue) 55%,var(--v50-cyan));box-shadow:0 16px 38px rgba(3,28,52,.18)}
.v50-pulse .pulse-hero h2{font-size:19px;font-weight:950;letter-spacing:.2px}
.v50-pulse .pulse-hero p,.v50-pulse .pulse-eyebrow{font-weight:900}
.v50-pulse .pulse-filter-panel{border:1.5px solid #c8d7e6;box-shadow:0 8px 22px rgba(3,28,52,.06)}
.v50-pulse .pulse-filter label{font-size:9px;font-weight:950;color:#3f5872}
.v50-pulse .pulse-filter select{font-size:13px;font-weight:900;color:#17324d;border:1.5px solid #bed0e2;background:#f7fbff}
.v50-section-head,.v50-section-bar{background:linear-gradient(90deg,#10345a,#155b84 65%,#178fb0)!important}
.v50-section-head strong,.v50-section-bar strong{font-size:13px!important;font-weight:950!important}
.v50-behavior-grid{gap:14px;padding:14px}
.v50-month-cards{gap:10px}
.v50-month-card{border:1.5px solid #c7d9ea;border-radius:14px;padding:12px 8px;background:linear-gradient(180deg,#fff,#f7fbff);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 4px 14px rgba(12,42,67,.05);text-align:center}
.v50-month-card small{font-size:9px;font-weight:950;letter-spacing:.4px;color:#5c738a;text-transform:uppercase;display:block}
.v50-month-card .v50-month-metric{margin-top:6px;font-size:21px;font-weight:950;letter-spacing:-.2px;color:#143a5e;line-height:1.05}
.v50-month-card .v50-month-metric span{font-size:14px;opacity:.6;padding:0 3px}
.v50-month-card em{display:block;margin-top:5px;font-style:normal;font-size:9px;font-weight:900;color:#5c738a}
.v50-month-card.good,.v50-rank.good{background:linear-gradient(180deg,#f3fdf7,#e6f7ec);border-color:#9dd8ae}
.v50-month-card.warn,.v50-rank.warn{background:linear-gradient(180deg,#fffaf0,#fff1d4);border-color:#efcf7a}
.v50-month-card.bad,.v50-rank.bad{background:linear-gradient(180deg,#fff6f6,#fde8e8);border-color:#efb8b8}
.v50-month-card.good .v50-month-metric,.v50-rank.good span{color:var(--v50-good)}
.v50-month-card.warn .v50-month-metric,.v50-rank.warn span{color:var(--v50-warn)}
.v50-month-card.bad .v50-month-metric,.v50-rank.bad span{color:var(--v50-bad)}
.v50-rank{border:1.5px solid #ccd8e4;border-radius:14px;box-shadow:0 4px 14px rgba(12,42,67,.05)}
.v50-rank small{font-size:9px;font-weight:950;letter-spacing:.5px}.v50-rank strong{font-size:15px;font-weight:950}.v50-rank span{font-size:22px;font-weight:950}
.v50-table-shell{border:1.5px solid #cedae6!important;box-shadow:0 10px 24px rgba(3,28,52,.08)!important}
.v50-pulse table{border-collapse:separate;border-spacing:0;width:100%}
.v50-pulse table th,.v50-pulse table td{font-size:11px!important;font-weight:900;color:#17324d;border-right:1px solid #d6e2ee;border-bottom:1px solid #d6e2ee;vertical-align:middle;padding:10px 10px}
.v50-pulse table thead th{font-size:10px!important;letter-spacing:.2px;background:#edf4fa;color:#45627b;text-transform:none}
.v50-pulse table tr td:first-child,.v50-pulse table tr th:first-child{border-left:1px solid #d6e2ee}
.v50-pulse table thead tr:first-child th{border-top:1px solid #d6e2ee}
.v50-pulse .pulse-matrix{min-width:1540px}
.v50-pulse .pulse-matrix th,.v50-pulse .pulse-matrix td{text-align:center}
.v50-pulse .pulse-matrix td:first-child,.v50-pulse .pulse-matrix th:first-child{text-align:left}
.v50-pulse .pulse-matrix td:nth-child(2),.v50-pulse .pulse-matrix th:nth-child(2){text-align:center}
.v50-pulse .pulse-matrix .current-week{background:#dff3ff!important;color:#0c6087!important}
.v50-pulse .pulse-kpi-name{background:#f4f9fc!important;color:#0f3e65!important;font-size:11px!important}
.v50-pulse .pulse-title-bar{background:linear-gradient(90deg,#143e67,#0f5b84 65%,#168fb1);font-size:15px;font-weight:950;letter-spacing:.4px;box-shadow:0 8px 20px rgba(3,28,52,.08)}
.v50-kpi-card{border-width:1.5px!important;padding:15px!important}.v50-kpi-card.good{background:linear-gradient(180deg,#fff,#f2fbf5);border-color:#a8d5b6!important}.v50-kpi-card.warn{background:linear-gradient(180deg,#fff,#fff7e7);border-color:#ead28d!important}.v50-kpi-card.bad{background:linear-gradient(180deg,#fff,#fff0f0);border-color:#efc2c2!important}
.v50-pulse .pulse-kpi-card-top>span:first-child{font-size:12px;font-weight:950}.v50-pulse .pulse-kpi-card-main strong{font-size:31px;font-weight:950}.v50-pulse .pulse-kpi-card-main small{font-size:12px;font-weight:900}.v50-pulse .pulse-kpi-card-foot{font-size:10px;font-weight:900}
.v50-pulse .pulse-pill{font-weight:950}
.v50-analysis-card .pulse-card-head,.v50-card-head{background:#f8fbfe;border-bottom:1px solid #dde8f1}.v50-analysis-card .pulse-card-head strong{font-size:13px;font-weight:950}.v50-analysis-card .pulse-card-head span{font-weight:900;color:#61768c}
.v50-pulse .pulse-rank-box{border-width:1.5px;border-style:solid}.v50-pulse .pulse-rank-box.top{border-color:#b0e0c0;background:#effaf2}.v50-pulse .pulse-rank-box.bottom{border-color:#f2b9b9;background:#fff2f2}
.v50-pulse .v49-link-btn,.v50-pulse .v49-cell-link,.v50-pulse .v49-kpi-link{font-weight:950;color:#0c6790}
.v50-pulse .v49-link-btn:hover,.v50-pulse .v49-cell-link:hover,.v50-pulse .v49-kpi-link:hover{background:#dff4ff}
.v50-pulse .pulse-guide{font-size:10px;font-weight:900;color:#4d647a;background:#f8fbfe;border-top:1px solid #d6e2ee}
.v50-pulse .pulse-status.good{background:#eaf8ef;color:#177245;border:1px solid #b1ddbe}
.v50-pulse .pulse-status.warn{background:#fff5df;color:#9a5b00;border:1px solid #f3d58a}
.v50-pulse .pulse-status.bad{background:#fdeaea;color:#b42318;border:1px solid #efc0c0}
.v50-pulse .pulse-status.neutral{background:#eef4f8;color:#516274;border:1px solid #d6e2ee}
@media(max-width:1100px){.v50-month-card .v50-month-metric{font-size:18px}.v50-pulse .pulse-kpi-card-main strong{font-size:27px}}


/* ==========================================================
   V51 — Contribution %, comparison banding & dropdown settings
   ========================================================== */
.v51-prev-col{
  background:#fff4dc!important;
  color:#8a5600!important;
  border-left:2px solid #e7bd5e!important;
  border-right:2px solid #e7bd5e!important;
}
.v51-current-col{
  background:#e4f5ff!important;
  color:#075b84!important;
  border-left:2px solid #70bfe4!important;
  border-right:2px solid #70bfe4!important;
}
.v51-target-col{
  background:#eee9ff!important;
  color:#5b3aa8!important;
  border-left:2px solid #b8a5ed!important;
  border-right:2px solid #b8a5ed!important;
  font-weight:950!important;
}
.v51-perf-good{color:#116b38!important;background-color:#effaf3!important}
.v51-perf-warn{color:#915d00!important;background-color:#fff8e8!important}
.v51-perf-bad{color:#a9231b!important;background-color:#fff0f0!important}
.v51-perf-neutral{color:#617182!important;background-color:#f5f8fb!important}

.v50-pulse .pulse-analysis-card table{
  table-layout:fixed;
}
.v50-pulse .pulse-analysis-card th:first-child,
.v50-pulse .pulse-analysis-card td:first-child{
  width:54%;
  text-align:left;
}
.v50-pulse .pulse-analysis-card th:nth-child(2),
.v50-pulse .pulse-analysis-card td:nth-child(2),
.v50-pulse .pulse-analysis-card th:nth-child(3),
.v50-pulse .pulse-analysis-card td:nth-child(3){
  width:23%;
  text-align:center;
}
.v51-band-row td{font-weight:900!important}
.v51-band-1 td{background:#eefaf2}
.v51-band-2 td{background:#f4fbff}
.v51-band-3 td{background:#fff8e9}
.v51-band-4 td{background:#fff1f1}
.v51-total-row td{
  background:linear-gradient(90deg,#173f69,#126285)!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:950!important;
  border-color:#406c8d!important;
}
.v51-total-row td:first-child{letter-spacing:.5px}
.v51-filter-settings{
  display:flex;
  align-items:end;
  grid-column:1/-1;
  justify-content:flex-end;
  margin-top:1px;
}
.v51-filter-settings button{
  height:32px;
  border:1px solid #8bc8e2;
  border-radius:9px;
  padding:0 12px;
  background:#eaf8ff;
  color:#075b84;
  font-size:10px;
  font-weight:950;
  cursor:pointer;
}
.v51-filter-settings button:hover{background:#d8f1fc}
.v51-config-card{width:min(720px,92vw)!important}
.v51-config-body{padding:18px!important;display:grid;gap:13px}
.v51-config-help{margin:0;color:#52677c;font-size:11px;font-weight:800}
.v51-config-body label{display:grid;gap:6px;color:#29455f;font-size:10px;font-weight:950;letter-spacing:.4px}
.v51-config-body textarea{
  min-height:58px;
  resize:vertical;
  border:1.5px solid #c5d7e6;
  border-radius:10px;
  padding:10px;
  font:800 12px/1.45 inherit;
  color:#18324b;
  background:#f8fbfe;
}
.v51-config-note{padding:11px;border:1px solid #d9e6f0;border-radius:10px;background:#f5f9fc;color:#536b80;font-size:10px;line-height:1.45}
.v51-config-actions{display:flex;justify-content:flex-end;gap:9px}
.v51-primary-btn,.v51-secondary-btn{border:0;border-radius:9px;padding:10px 14px;font-weight:950;cursor:pointer}
.v51-primary-btn{background:#0d638d;color:#fff}.v51-secondary-btn{background:#e8eef4;color:#344e67}


/* ==========================================================
   V52 — Dashboard column alignment fix
   Fixes clipped Contribution %, One View overflow, header alignment
   ========================================================== */

/* Undo the V50 generic 54/23/23 rule from every pulse-analysis-card. */
.v50-pulse .pulse-analysis-card th:first-child,
.v50-pulse .pulse-analysis-card td:first-child,
.v50-pulse .pulse-analysis-card th:nth-child(2),
.v50-pulse .pulse-analysis-card td:nth-child(2),
.v50-pulse .pulse-analysis-card th:nth-child(3),
.v50-pulse .pulse-analysis-card td:nth-child(3){
  width:auto;
}

/* Only the Soft Skill and Script distribution cards use 54 / 23 / 23. */
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(1) table,
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(2) table{
  width:100%;
  table-layout:fixed;
}
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(1) th:first-child,
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(1) td:first-child,
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(2) th:first-child,
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(2) td:first-child{
  width:54%;
  text-align:left;
}
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(1) th:nth-child(2),
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(1) td:nth-child(2),
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(2) th:nth-child(2),
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(2) td:nth-child(2){
  width:23%;
  text-align:center;
}
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(1) th:nth-child(3),
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(1) td:nth-child(3),
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(2) th:nth-child(3),
.v50-pulse .pulse-analysis-grid > .pulse-analysis-card:nth-child(2) td:nth-child(3){
  width:23%;
  text-align:center;
}

/* One View has six equal-purpose columns and must fit fully in the card. */
.v49-oneview{
  overflow-x:auto !important;
}
.v49-oneview table{
  width:100% !important;
  min-width:900px;
  table-layout:fixed !important;
}
.v49-oneview th,
.v49-oneview td{
  white-space:nowrap;
  text-align:center !important;
  overflow:hidden;
  text-overflow:ellipsis;
}
.v49-oneview th:first-child,
.v49-oneview td:first-child{
  width:26% !important;
  text-align:left !important;
}
.v49-oneview th:nth-child(2),
.v49-oneview td:nth-child(2){
  width:13% !important;
}
.v49-oneview th:nth-child(3),
.v49-oneview td:nth-child(3){
  width:14% !important;
}
.v49-oneview th:nth-child(4),
.v49-oneview td:nth-child(4){
  width:14% !important;
}
.v49-oneview th:nth-child(5),
.v49-oneview td:nth-child(5){
  width:14% !important;
}
.v49-oneview th:nth-child(6),
.v49-oneview td:nth-child(6){
  width:19% !important;
}

/* Make comparison-month bands visually distinct in both header and body. */
.v49-oneview .v51-prev-col,
.pulse-matrix .v51-prev-col{
  background:#fff3d6 !important;
  color:#8c5700 !important;
  border-left:2px solid #e1b94e !important;
  border-right:2px solid #e1b94e !important;
}
.v49-oneview .v51-current-col,
.pulse-matrix .v51-current-col{
  background:#dff3ff !important;
  color:#075d86 !important;
  border-left:2px solid #68b9de !important;
  border-right:2px solid #68b9de !important;
}
.v49-oneview .v51-target-col,
.pulse-matrix .v51-target-col{
  background:#ebe5ff !important;
  color:#5939a3 !important;
  border-left:2px solid #aa96e7 !important;
  border-right:2px solid #aa96e7 !important;
}

/* Table header/body alignment and clean full borders. */
.v50-pulse table th,
.v50-pulse table td{
  box-sizing:border-box;
}
.v50-pulse .pulse-analysis-grid table th,
.v50-pulse .pulse-analysis-grid table td{
  border-right:1px solid #cdddea !important;
  border-bottom:1px solid #cdddea !important;
}
.v50-pulse .pulse-analysis-grid table th:first-child,
.v50-pulse .pulse-analysis-grid table td:first-child{
  border-left:1px solid #cdddea !important;
}
.v50-pulse .pulse-analysis-grid table thead tr:first-child th{
  border-top:1px solid #cdddea !important;
}

/* Strong readable headers. */
.v50-pulse .pulse-analysis-grid table th,
.v49-oneview table th{
  font-weight:950 !important;
  color:#3f5b75 !important;
  background:#eaf2f8;
}
.v50-pulse .pulse-analysis-grid table td,
.v49-oneview table td{
  font-weight:900 !important;
}

/* Total row should clearly close the table at 100%. */
.v51-total-row td{
  border-top:2px solid #0d5f85 !important;
  border-bottom:2px solid #0d5f85 !important;
}
.v51-total-row td:first-child{
  border-left:2px solid #0d5f85 !important;
}
.v51-total-row td:last-child{
  border-right:2px solid #0d5f85 !important;
}


/* ==========================================================
   V53 — Soft Skill / Script distribution structural fix
   ========================================================== */

/* Grid items must be allowed to shrink inside the 3-column analysis grid. */
.v50-pulse .pulse-analysis-grid > *{
  min-width:0 !important;
}
.v53-distribution-card{
  min-width:0 !important;
  overflow:hidden !important;
}

/* Explicit table structure: always 3 visible columns. */
.v53-distribution-table{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  table-layout:fixed !important;
  border-collapse:collapse !important;
}
.v53-distribution-table col.v53-col-score{width:54% !important}
.v53-distribution-table col.v53-col-hc{width:23% !important}
.v53-distribution-table col.v53-col-contribution{width:23% !important}

/* Width comes from colgroup only — prevent older CSS width rules from fighting it. */
.v53-distribution-table th,
.v53-distribution-table td{
  width:auto !important;
  max-width:none !important;
  box-sizing:border-box !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:normal !important;
  padding:10px 9px !important;
  border:1px solid #cdddea !important;
  font-weight:900 !important;
  vertical-align:middle !important;
}
.v53-distribution-table th{
  background:#eaf2f8 !important;
  color:#405c75 !important;
  font-size:10px !important;
  font-weight:950 !important;
}
.v53-distribution-table th:first-child,
.v53-distribution-table td:first-child{
  text-align:left !important;
  overflow-wrap:anywhere !important;
}
.v53-distribution-table th:nth-child(2),
.v53-distribution-table td:nth-child(2),
.v53-distribution-table th:nth-child(3),
.v53-distribution-table td:nth-child(3){
  text-align:center !important;
  white-space:nowrap !important;
}

/* Distinct vertical separators improve readability. */
.v53-distribution-table th:nth-child(2),
.v53-distribution-table td:nth-child(2){
  border-left:2px solid #b8cfe1 !important;
}
.v53-distribution-table th:nth-child(3),
.v53-distribution-table td:nth-child(3){
  border-left:2px solid #b8cfe1 !important;
}

/* Preserve row performance colouring while keeping numeric columns readable. */
.v53-distribution-table .v51-band-1 td{background:#eefaf2 !important}
.v53-distribution-table .v51-band-2 td{background:#f1f9ff !important}
.v53-distribution-table .v51-band-3 td{background:#fff7e5 !important}
.v53-distribution-table .v51-band-4 td{background:#fff0f0 !important}

/* Total row: all three columns must remain visible. */
.v53-distribution-table .v51-total-row td{
  background:linear-gradient(90deg,#163e68,#126487) !important;
  color:#fff !important;
  border-color:#4d7a9a !important;
  font-size:11px !important;
  font-weight:950 !important;
}
.v53-distribution-table .v51-total-row td:nth-child(2),
.v53-distribution-table .v51-total-row td:nth-child(3){
  text-align:center !important;
}

/* Do not let header subtitle steal horizontal table width. */
.v53-distribution-card .pulse-card-head{
  min-width:0 !important;
}
.v53-distribution-card .pulse-card-head strong{
  min-width:0;
  flex:1 1 auto;
}
.v53-distribution-card .pulse-card-head span{
  flex:0 0 auto;
  white-space:nowrap;
}

/* Slightly rebalance cards so both distribution tables have more room. */
.v50-pulse .pulse-analysis-grid{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(280px,.82fr) !important;
}


/* ==========================================================
   V55 — Safe colour coding on V53 stable layout
   IMPORTANT: no width/grid/table-layout rules in this patch.
   ========================================================== */
.v55-score.good{background:#eaf8ef!important;color:#166534!important;font-weight:950!important}
.v55-score.warn{background:#fff5dd!important;color:#8b5b00!important;font-weight:950!important}
.v55-score.bad{background:#fdeaea!important;color:#b42318!important;font-weight:950!important}
.v55-score.neutral{background:#f3f6f9!important;color:#64748b!important;font-weight:950!important}
.v55-hc{background:#eef6fc!important;color:#15557b!important;font-weight:950!important;text-align:center!important}

.v55-defect.good{background:#ecf9f1!important;color:#176a3b!important;font-weight:950!important}
.v55-defect.warn{background:#fff5de!important;color:#8d5a00!important;font-weight:950!important}
.v55-defect.bad{background:#fdeaea!important;color:#b42318!important;font-weight:950!important}
.v55-defect.neutral{background:#f4f7fa!important;color:#64748b!important;font-weight:950!important}

.v55-compliance.good,.v55-defaulters.good{background:#eaf8ef!important;color:#166534!important;font-weight:950!important}
.v55-compliance.warn,.v55-defaulters.warn{background:#fff5dd!important;color:#8b5b00!important;font-weight:950!important}
.v55-compliance.bad,.v55-defaulters.bad{background:#fdeaea!important;color:#b42318!important;font-weight:950!important}
.v55-compliance.neutral,.v55-defaulters.neutral{background:#f3f6f9!important;color:#64748b!important;font-weight:950!important}

/* Keep clickable text legible over status fills. */
.v55-defaulters .v49-link-btn{color:inherit!important;font-weight:950!important}


/* ==========================================================
   V56 — Single scoring base + matrix group alignment
   ========================================================== */

/* Matrix group headings live inside the table, so they can never drift. */
.v56-matrix thead .v56-group-header th{
  position:static !important;
  top:auto !important;
  padding:10px 8px !important;
  color:#fff !important;
  font-size:10px !important;
  font-weight:950 !important;
  letter-spacing:.35px;
  text-align:center !important;
  border-top:1.5px solid #315f80 !important;
  border-bottom:2px solid #315f80 !important;
  border-right:2px solid rgba(255,255,255,.22) !important;
}
.v56-group-quality{background:#163f68 !important}
.v56-group-monthly{background:#15577c !important}
.v56-group-weekly{
  background:#0d718a !important;
  border-left:4px solid #7dd3fc !important;
}
.v56-group-gap{
  background:#186c82 !important;
  border-left:4px solid #a78bfa !important;
}

/* Clear vertical separation between Monthly and Weekly data. */
.v56-matrix .v56-column-header th:nth-child(10),
.v56-matrix tbody td:nth-child(10){
  border-left:4px solid #7dd3fc !important;
}
.v56-matrix .v56-column-header th:nth-child(16),
.v56-matrix tbody td:nth-child(16){
  border-left:4px solid #a78bfa !important;
}

/* Column headings are aligned exactly above the data cells. */
.v56-matrix .v56-column-header th{
  position:sticky;
  top:0;
  z-index:3;
  vertical-align:middle !important;
  text-align:center !important;
  line-height:1.18;
  min-height:44px;
}
.v56-matrix .v56-column-header th:first-child{
  text-align:left !important;
}

/* One View KPI heading/column gets a complete professional border. */
.v56-oneview table{
  border:2px solid #aac2d6 !important;
  border-radius:12px;
  overflow:hidden;
}
.v56-oneview thead th{
  border-top:1.5px solid #9fb9cf !important;
  border-bottom:2px solid #9fb9cf !important;
  border-right:1.5px solid #afc5d8 !important;
}
.v56-oneview thead th:first-child{
  border-left:1.5px solid #9fb9cf !important;
}
.v56-oneview .v56-kpi-head{
  background:linear-gradient(180deg,#e3eef7,#d5e7f3) !important;
  color:#153f63 !important;
  font-size:11px !important;
  font-weight:950 !important;
  letter-spacing:.25px;
}
.v56-oneview tbody td:first-child{
  border-left:1.5px solid #b9ccdc !important;
  border-right:2px solid #a6bfd3 !important;
  background:#f8fbfd;
}
.v56-oneview tbody tr:last-child td{
  border-bottom:1.5px solid #a6bfd3 !important;
}

/* Keep title note readable without weakening the primary heading. */
.v56-title-note{
  float:right;
  margin-top:2px;
  font-size:9px;
  font-weight:850;
  opacity:.78;
  text-transform:none;
  letter-spacing:0;
}

/* Old floating 3-block heading is no longer used in V56 matrix. */
.v56-matrix-shell > .pulse-section-heading{
  display:none !important;
}


/* ==========================================================
   V57 — Matrix width optimisation & subtle section dividers
   ========================================================== */

/* Fit the full matrix in the desktop viewport so Remarks remains visible. */
.v57-matrix{
  width:100% !important;
  min-width:1160px !important;
  table-layout:fixed !important;
}
.v57-matrix col.v57-col-kpi{width:145px}
.v57-matrix col.v57-col-audited{width:78px}
.v57-matrix col.v57-col-month{width:48px}
.v57-matrix col.v57-col-delta{width:58px}
.v57-matrix col.v57-col-week{width:48px}
.v57-matrix col.v57-col-target{width:62px}
.v57-matrix col.v57-col-gap{width:112px}
.v57-matrix col.v57-col-remarks{width:118px}

/* Allow long business text to wrap instead of forcing horizontal scrolling. */
.v57-matrix th,.v57-matrix td{
  padding:9px 6px !important;
  white-space:normal !important;
  overflow-wrap:anywhere;
  line-height:1.15;
}
.v57-matrix .pulse-kpi-name,
.v57-matrix th:first-child{
  padding-left:10px !important;
}
.v57-matrix th:nth-child(17),
.v57-matrix td:nth-child(17),
.v57-matrix th:nth-child(18),
.v57-matrix td:nth-child(18){
  white-space:normal !important;
  text-align:center !important;
}

/* Remove the heavy W1 and Target separators from V56. */
.v57-matrix .v56-column-header th:nth-child(10),
.v57-matrix tbody td:nth-child(10){
  border-left:1px solid #c9d9e6 !important;
}
.v57-matrix .v56-column-header th:nth-child(16),
.v57-matrix tbody td:nth-child(16){
  border-left:1px solid #c9d9e6 !important;
}

/* Keep group distinction professional via header tone rather than thick lines. */
.v57-matrix .v56-group-weekly{
  border-left:1px solid rgba(255,255,255,.26) !important;
  background:linear-gradient(90deg,#0f7188,#14849a) !important;
}
.v57-matrix .v56-group-gap{
  border-left:1px solid rgba(255,255,255,.26) !important;
  background:linear-gradient(90deg,#176c80,#1a7888) !important;
}

/* W1 and Target stay visually distinct using soft fill only. */
.v57-matrix .current-week{
  background:#e5f5fc !important;
  color:#0a6488 !important;
  box-shadow:inset 0 0 0 1px #a8d9ec;
}
.v57-matrix .v51-target-col{
  background:#eee9ff !important;
  color:#5b3aa8 !important;
  border-left:1px solid #c7baf1 !important;
  border-right:1px solid #c7baf1 !important;
}

/* Remarks and achievement should read like business output, not cramped cells. */
.v57-matrix td:nth-child(17),
.v57-matrix td:nth-child(18){
  font-size:10px !important;
  font-weight:900 !important;
}

/* Desktop should normally show the whole matrix without horizontal scrolling. */
@media(min-width:1250px){
  .v56-matrix-shell .pulse-table-wrap{
    overflow-x:hidden !important;
  }
}
@media(max-width:1249px){
  .v56-matrix-shell .pulse-table-wrap{
    overflow-x:auto !important;
  }
}


/* ==========================================================
   V58 — Crystal Clear Accessibility / High-Contrast Polish
   Visual-only patch. No calculation logic changed.
   ========================================================== */

/* Global dashboard text rendering: strong, clean and crisp. */
.v50-pulse{
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
.v50-pulse strong,
.v50-pulse th,
.v50-pulse .pulse-title-bar,
.v50-pulse .pulse-eyebrow,
.v50-pulse .pulse-kpi-name,
.v50-pulse .v49-kpi-link,
.v50-pulse .v49-cell-link{
  letter-spacing:.12px;
}

/* Primary section headings — dark rich gradient, white raised text. */
.v50-pulse .pulse-title-bar,
.v50-pulse .v49-section-head,
.v50-pulse .v50-section-head,
.v50-pulse .v56-group-header th{
  color:#fff !important;
  font-weight:950 !important;
  text-shadow:0 1px 0 rgba(0,0,0,.38),0 2px 6px rgba(0,0,0,.24);
}
.v50-pulse .pulse-title-bar{
  min-height:42px;
  display:flex;
  align-items:center;
  padding:10px 14px !important;
  background:linear-gradient(180deg,#0d4a76 0%,#123b63 52%,#0a3154 100%) !important;
  border:1px solid #072b49 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -2px 0 rgba(0,0,0,.12),
    0 5px 14px rgba(3,28,52,.14) !important;
  font-size:15px !important;
  line-height:1.15;
}
.v50-pulse .pulse-title-bar::before{
  content:"";
  width:5px;
  align-self:stretch;
  margin-right:10px;
  border-radius:4px;
  background:linear-gradient(180deg,#7dd3fc,#22d3ee);
  box-shadow:0 0 10px rgba(34,211,238,.45);
}

/* Matrix group bars — clear hierarchy, no gaudy borders. */
.v57-matrix .v56-group-quality{
  background:linear-gradient(180deg,#173f68,#0e3154) !important;
}
.v57-matrix .v56-group-monthly{
  background:linear-gradient(180deg,#17678e,#0e4d72) !important;
}
.v57-matrix .v56-group-weekly{
  background:linear-gradient(180deg,#12839a,#0c657b) !important;
}
.v57-matrix .v56-group-gap{
  background:linear-gradient(180deg,#236c89,#15566f) !important;
}
.v57-matrix .v56-group-header th{
  font-size:11px !important;
  padding-top:11px !important;
  padding-bottom:11px !important;
  border-color:rgba(255,255,255,.24) !important;
}

/* Table column headings — high contrast blue-grey with embossed text. */
.v50-pulse table thead th,
.v57-matrix .v56-column-header th,
.v49-oneview table thead th,
.v53-distribution-table th{
  color:#173a58 !important;
  background:linear-gradient(180deg,#f8fbfe 0%,#e4eef6 100%) !important;
  font-size:10.5px !important;
  font-weight:950 !important;
  text-shadow:0 1px 0 #fff;
  border-color:#b7cad9 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95);
}

/* Previous / Current / Target remain distinct, but more readable. */
.v50-pulse .v51-prev-col{
  background:linear-gradient(180deg,#fff9e9,#ffe9b5) !important;
  color:#7b4b00 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.8);
}
.v50-pulse .v51-current-col,
.v50-pulse .current-week{
  background:linear-gradient(180deg,#eefaff,#cceeff) !important;
  color:#075478 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.8);
}
.v50-pulse .v51-target-col{
  background:linear-gradient(180deg,#f4f0ff,#ddd4ff) !important;
  color:#4f3498 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.85);
}

/* KPI / Particular names should visually pop from the row. */
.v50-pulse .pulse-kpi-name,
.v50-pulse .v49-oneview tbody td:first-child,
.v50-pulse .v53-distribution-table td:first-child,
.v50-pulse .v49-table-card td:first-child{
  color:#0c4f78 !important;
  font-weight:950 !important;
}
.v50-pulse .v49-kpi-link,
.v50-pulse .v49-cell-link{
  color:#075f8e !important;
  font-weight:950 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.82);
}
.v50-pulse .v49-kpi-link:hover,
.v50-pulse .v49-cell-link:hover{
  color:#063f61 !important;
  background:#dff4ff !important;
  box-shadow:inset 0 0 0 1px #9fd5ee;
}

/* Body cells: darker ink and clearer row boundaries. */
.v50-pulse table td{
  color:#142f49 !important;
  font-weight:900 !important;
  border-color:#c8d7e3 !important;
}
.v50-pulse table tbody tr:nth-child(even) td:not(.v51-prev-col):not(.v51-current-col):not(.v51-target-col):not(.v55-score):not(.v55-defect):not(.v55-compliance):not(.v55-defaulters){
  background-color:#fbfdff;
}

/* Important numeric values should look almost "lit" on the screen. */
.v50-pulse .pulse-kpi-card-main strong,
.v50-pulse .v50-month-metric,
.v50-pulse .pulse-rank-box span,
.v50-pulse .v50-rank span,
.v50-pulse .v49-oneview tbody td:nth-child(n+2),
.v57-matrix tbody td:not(:first-child):not(:nth-child(2)){
  font-variant-numeric:tabular-nums;
}
.v50-pulse .pulse-kpi-card-main strong{
  color:#0b416b !important;
  text-shadow:0 1px 0 #fff,0 2px 5px rgba(15,65,107,.10);
}

/* Filters: labels and selected values crystal clear. */
.v50-pulse .pulse-filter label{
  color:#304d68 !important;
  font-size:9.5px !important;
  font-weight:950 !important;
  letter-spacing:.65px;
}
.v50-pulse .pulse-filter select{
  color:#112f49 !important;
  font-size:13px !important;
  font-weight:950 !important;
  border:1.5px solid #9eb9cf !important;
  background:linear-gradient(180deg,#ffffff,#f3f8fc) !important;
  box-shadow:inset 0 1px 0 #fff,0 2px 6px rgba(12,49,78,.04);
}

/* Card headings — strong particulars without sacrificing content area. */
.v50-pulse .pulse-card-head,
.v50-pulse .v50-card-head{
  background:linear-gradient(180deg,#f7fbfe,#e6f0f7) !important;
  border-bottom:2px solid #b8ccdc !important;
}
.v50-pulse .pulse-card-head strong,
.v50-pulse .v50-card-head strong{
  color:#173f61 !important;
  font-size:12.5px !important;
  font-weight:950 !important;
  text-shadow:0 1px 0 #fff;
}
.v50-pulse .pulse-card-head span,
.v50-pulse .v50-card-head span{
  color:#536d84 !important;
  font-size:9px !important;
  font-weight:900 !important;
}

/* Status pills: stronger border + contrast for reduced vision. */
.v50-pulse .pulse-status,
.v50-pulse .pulse-pill{
  border-width:1.5px !important;
  border-style:solid !important;
  font-weight:950 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}
.v50-pulse .pulse-status.good,.v50-pulse .pulse-pill.good{color:#0d6334 !important;border-color:#8fd0a4 !important}
.v50-pulse .pulse-status.warn,.v50-pulse .pulse-pill.warn{color:#805000 !important;border-color:#e3bd5d !important}
.v50-pulse .pulse-status.bad,.v50-pulse .pulse-pill.bad{color:#a11d16 !important;border-color:#e8a5a2 !important}

/* One View KPI first header/column — stronger professional block. */
.v56-oneview .v56-kpi-head{
  background:linear-gradient(180deg,#d8e9f5,#bfd7e8) !important;
  color:#103c60 !important;
  font-size:11.5px !important;
  font-weight:950 !important;
  border:2px solid #8fb0c8 !important;
  text-shadow:0 1px 0 #fff;
}
.v56-oneview tbody td:first-child{
  background:linear-gradient(90deg,#fbfdff,#eef6fb) !important;
  border-right:2px solid #9db8cc !important;
}

/* Total rows should be unmistakable. */
.v53-distribution-table .v51-total-row td{
  background:linear-gradient(180deg,#164b73,#0d3659) !important;
  color:#fff !important;
  text-shadow:0 1px 0 rgba(0,0,0,.35);
  border-color:#406c8d !important;
}

/* Legends / helper text still readable at a glance. */
.v50-pulse .pulse-guide,
.v50-pulse .v55-legend{
  color:#3f5870 !important;
  font-size:9.5px !important;
  font-weight:900 !important;
  background:#f5f9fc !important;
}

/* Give all major cards a subtle "lift" from the screen. */
.v50-pulse .pulse-matrix-card,
.v50-pulse .pulse-analysis-card,
.v50-pulse .v49-table-card,
.v50-pulse .v49-oneview,
.v50-pulse .v49-behavior,
.v50-pulse .pulse-kpi-card{
  box-shadow:
    0 8px 20px rgba(5,35,60,.07),
    inset 0 1px 0 rgba(255,255,255,.88) !important;
}

/* Accessibility: visible focus ring for keyboard users. */
.v50-pulse button:focus-visible,
.v50-pulse select:focus-visible{
  outline:3px solid #22b8e6 !important;
  outline-offset:2px !important;
}

/* Slightly enlarge typography on large desktop / 4K monitors. */
@media(min-width:1600px){
  .v50-pulse table th{font-size:11px !important}
  .v50-pulse table td{font-size:11.5px !important}
  .v50-pulse .pulse-title-bar{font-size:16px !important}
  .v57-matrix .v56-group-header th{font-size:11.5px !important}
}


/* ==========================================================
   V59 — Role context, distinct KPI colours, Admin target manager
   ========================================================== */
.v59-pulse-hero{padding-bottom:16px!important}
.v59-hero-main{width:100%;min-width:0}
.v59-role-context{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:13px}
.v59-context-card{min-width:0;padding:9px 11px;border:1px solid rgba(255,255,255,.24);border-radius:11px;background:rgba(255,255,255,.105);box-shadow:inset 0 1px 0 rgba(255,255,255,.14);backdrop-filter:blur(7px)}
.v59-context-card.c1{border-left:4px solid #67e8f9}.v59-context-card.c2{border-left:4px solid #c4b5fd}.v59-context-card.c3{border-left:4px solid #86efac}.v59-context-card.c4{border-left:4px solid #fde68a}
.v59-context-card small,.v59-context-card strong,.v59-context-card em{display:block}.v59-context-card small{font-size:8px;font-weight:950;letter-spacing:.55px;text-transform:uppercase;color:#cbeafd}.v59-context-card strong{margin-top:3px;color:#fff;font-size:11px;font-weight:950;line-height:1.25;white-space:normal;overflow-wrap:anywhere}.v59-context-card em{margin-top:3px;font-size:8px;font-style:normal;font-weight:800;color:#c9ddeb}

.v59-admin-controls{gap:8px!important}.v59-admin-controls #v59ManageTargets{border-color:#b9a6ef!important;background:#f0ecff!important;color:#5937a4!important}.v59-admin-controls #v59ManageTargets:hover{background:#e5defe!important}

/* Every KPI has a distinct identity colour, while performance pills still show status. */
.v59-kpi-card{position:relative;overflow:hidden!important;border-width:1.5px!important;background:#fff!important;box-shadow:0 9px 22px rgba(7,32,58,.085)!important}
.v59-kpi-card .v59-kpi-accent{position:absolute;left:0;right:0;top:0;height:6px}
.v59-kpi-card::after{content:"";position:absolute;right:-28px;top:-38px;width:104px;height:104px;border-radius:50%;opacity:.10;pointer-events:none}
.v59-kpi-quality{background:linear-gradient(145deg,#ffffff,#eef8ff)!important;border-color:#8ac8e8!important}.v59-kpi-quality .v59-kpi-accent,.v59-kpi-quality::after{background:#0ea5e9}.v59-kpi-quality .pulse-kpi-card-main strong{color:#075d86!important}
.v59-kpi-script{background:linear-gradient(145deg,#ffffff,#f4efff)!important;border-color:#b9a4ee!important}.v59-kpi-script .v59-kpi-accent,.v59-kpi-script::after{background:#7c3aed}.v59-kpi-script .pulse-kpi-card-main strong{color:#5b21b6!important}
.v59-kpi-soft{background:linear-gradient(145deg,#ffffff,#effcf8)!important;border-color:#8bd9c0!important}.v59-kpi-soft .v59-kpi-accent,.v59-kpi-soft::after{background:#0f9f7f}.v59-kpi-soft .pulse-kpi-card-main strong{color:#08755d!important}
.v59-kpi-fatal{background:linear-gradient(145deg,#ffffff,#fff1ee)!important;border-color:#efa89e!important}.v59-kpi-fatal .v59-kpi-accent,.v59-kpi-fatal::after{background:#e24a3b}.v59-kpi-fatal .pulse-kpi-card-main strong{color:#b3261e!important}
.v59-kpi-tagging{background:linear-gradient(145deg,#ffffff,#fff8e9)!important;border-color:#ebc56f!important}.v59-kpi-tagging .v59-kpi-accent,.v59-kpi-tagging::after{background:#d99500}.v59-kpi-tagging .pulse-kpi-card-main strong{color:#9a6100!important}
.v59-kpi-ptp{background:linear-gradient(145deg,#ffffff,#eff4ff)!important;border-color:#9fb6ea!important}.v59-kpi-ptp .v59-kpi-accent,.v59-kpi-ptp::after{background:#365fc7}.v59-kpi-ptp .pulse-kpi-card-main strong{color:#23479f!important}
.v59-kpi-card .pulse-kpi-card-top>span:first-child{font-size:13px!important;letter-spacing:.1px}.v59-kpi-card .pulse-kpi-card-main strong{text-shadow:0 1px 0 #fff;font-size:32px!important}

.v59-target-card{width:min(780px,94vw)!important}.v59-target-body{padding:18px!important}.v59-target-note{padding:10px 12px;border:1px solid #d9e4ef;border-radius:10px;background:#f6f9fc;color:#466078;font-size:10px;font-weight:850;line-height:1.45}.v59-target-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:13px}.v59-target-grid label{display:grid;gap:5px;padding:10px;border:1px solid #dbe5ee;border-radius:10px;background:#fbfdff}.v59-target-grid label span{font-size:9px;font-weight:950;color:#36516c}.v59-target-grid input{height:36px;border:1.5px solid #bfd0df;border-radius:8px;padding:0 9px;font-size:13px;font-weight:950;color:#173754;background:#fff}.v59-target-grid input:focus{border-color:#18a7d0;outline:2px solid rgba(24,167,208,.15)}.v59-target-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:14px}
@media(max-width:1100px){.v59-role-context{grid-template-columns:repeat(2,minmax(0,1fr))}.v59-target-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.v59-role-context,.v59-target-grid{grid-template-columns:1fr}}


/* ==========================================================
   V60 — Performance-based KPI visibility & low-vision contrast
   ========================================================== */

/* KPI PERFORMANCE CARDS — full card identity comes from performance, not metric. */
.v60-kpi-card{
  border-width:2px!important;
  box-shadow:0 10px 26px rgba(8,31,52,.10)!important;
}
.v60-kpi-card.v60-good{
  background:linear-gradient(145deg,#f2fff6 0%,#dff6e8 100%)!important;
  border-color:#58b978!important;
}
.v60-kpi-card.v60-warn{
  background:linear-gradient(145deg,#fffdf4 0%,#fff0c9 100%)!important;
  border-color:#d9a82e!important;
}
.v60-kpi-card.v60-bad{
  background:linear-gradient(145deg,#fff7f7 0%,#ffdede 100%)!important;
  border-color:#df6b62!important;
}
.v60-kpi-card.v60-neutral{
  background:linear-gradient(145deg,#f9fbfd 0%,#e9f0f5 100%)!important;
  border-color:#97aabd!important;
}
.v60-kpi-card.v60-good .v59-kpi-accent{background:#168a45!important}
.v60-kpi-card.v60-warn .v59-kpi-accent{background:#bf7b00!important}
.v60-kpi-card.v60-bad .v59-kpi-accent{background:#c73228!important}
.v60-kpi-card.v60-neutral .v59-kpi-accent{background:#60758a!important}
.v60-kpi-card.v60-good::after{background:#168a45!important}
.v60-kpi-card.v60-warn::after{background:#bf7b00!important}
.v60-kpi-card.v60-bad::after{background:#c73228!important}
.v60-kpi-card.v60-neutral::after{background:#60758a!important}

/* KPI heading + large value + target + footer all become performance-coloured. */
.v60-kpi-card .pulse-kpi-card-top>span:first-child{
  font-size:14px!important;
  font-weight:1000!important;
  letter-spacing:.15px!important;
  text-shadow:0 1px 0 rgba(255,255,255,.9)!important;
}
.v60-kpi-card .pulse-kpi-card-main strong{
  font-size:34px!important;
  font-weight:1000!important;
  letter-spacing:-.6px!important;
  text-shadow:0 1px 0 #fff,0 2px 5px rgba(0,0,0,.07)!important;
}
.v60-kpi-card .pulse-kpi-card-main small,
.v60-kpi-card .pulse-kpi-card-foot{
  font-size:11px!important;
  font-weight:950!important;
}
.v60-kpi-card.v60-good .pulse-kpi-card-top>span:first-child,
.v60-kpi-card.v60-good .pulse-kpi-card-main strong,
.v60-kpi-card.v60-good .pulse-kpi-card-main small,
.v60-kpi-card.v60-good .pulse-kpi-card-foot{color:#0b6833!important}
.v60-kpi-card.v60-warn .pulse-kpi-card-top>span:first-child,
.v60-kpi-card.v60-warn .pulse-kpi-card-main strong,
.v60-kpi-card.v60-warn .pulse-kpi-card-main small,
.v60-kpi-card.v60-warn .pulse-kpi-card-foot{color:#815000!important}
.v60-kpi-card.v60-bad .pulse-kpi-card-top>span:first-child,
.v60-kpi-card.v60-bad .pulse-kpi-card-main strong,
.v60-kpi-card.v60-bad .pulse-kpi-card-main small,
.v60-kpi-card.v60-bad .pulse-kpi-card-foot{color:#9f2019!important}
.v60-kpi-card.v60-neutral .pulse-kpi-card-top>span:first-child,
.v60-kpi-card.v60-neutral .pulse-kpi-card-main strong,
.v60-kpi-card.v60-neutral .pulse-kpi-card-main small,
.v60-kpi-card.v60-neutral .pulse-kpi-card-foot{color:#40566b!important}

/* Make Topper / Defaulters links strong enough for low-vision reading. */
.v60-kpi-card .v49-link-btn{
  font-size:9px!important;
  font-weight:1000!important;
  text-decoration:underline!important;
  text-underline-offset:2px;
}

/* QUALITY VIEW KPI LABELS — shared row label uses current DIGITIDE/QA performance. */
.v60-qview-kpi{
  padding:0!important;
  border-left-width:3px!important;
}
.v60-qview-kpi .v49-kpi-link{
  display:flex!important;
  align-items:center!important;
  min-height:100%!important;
  width:100%!important;
  padding:11px 10px!important;
  font-size:11.5px!important;
  line-height:1.25!important;
  font-weight:1000!important;
  letter-spacing:.08px!important;
  text-decoration:none!important;
  text-shadow:0 1px 0 rgba(255,255,255,.9)!important;
}
.v60-qview-kpi.v60-good{background:#e8f8ee!important;border-left-color:#16914a!important}
.v60-qview-kpi.v60-warn{background:#fff3d3!important;border-left-color:#c98a12!important}
.v60-qview-kpi.v60-bad{background:#ffe8e6!important;border-left-color:#d13c32!important}
.v60-qview-kpi.v60-neutral{background:#edf3f7!important;border-left-color:#6f8498!important}
.v60-qview-kpi.v60-good .v49-kpi-link{color:#0b6833!important}
.v60-qview-kpi.v60-warn .v49-kpi-link{color:#815000!important}
.v60-qview-kpi.v60-bad .v49-kpi-link{color:#a5221b!important}
.v60-qview-kpi.v60-neutral .v49-kpi-link{color:#40566b!important}

/* QUALITY PERFORMANCE — ONE VIEW KPI names use the same status language. */
.v60-oneview-kpi{
  border-left-width:4px!important;
  padding:0!important;
}
.v60-oneview-kpi .v49-cell-link{
  display:block!important;
  width:100%!important;
  padding:11px 12px!important;
  font-size:11.5px!important;
  line-height:1.2!important;
  font-weight:1000!important;
  text-decoration:none!important;
  text-shadow:0 1px 0 rgba(255,255,255,.9)!important;
}
.v60-oneview-kpi.v60-good{background:#e8f8ee!important;border-left-color:#16914a!important}
.v60-oneview-kpi.v60-warn{background:#fff3d3!important;border-left-color:#c98a12!important}
.v60-oneview-kpi.v60-bad{background:#ffe8e6!important;border-left-color:#d13c32!important}
.v60-oneview-kpi.v60-neutral{background:#edf3f7!important;border-left-color:#6f8498!important}
.v60-oneview-kpi.v60-good .v49-cell-link{color:#0b6833!important}
.v60-oneview-kpi.v60-warn .v49-cell-link{color:#815000!important}
.v60-oneview-kpi.v60-bad .v49-cell-link{color:#a5221b!important}
.v60-oneview-kpi.v60-neutral .v49-cell-link{color:#40566b!important}

/* KPI headings remain readable on hover; do not wash out status colour. */
.v60-qview-kpi .v49-kpi-link:hover,
.v60-oneview-kpi .v49-cell-link:hover{
  background:rgba(255,255,255,.34)!important;
  text-decoration:underline!important;
  text-underline-offset:2px;
}

@media (min-width:1500px){
  .v60-kpi-card .pulse-kpi-card-top>span:first-child{font-size:15px!important}
  .v60-kpi-card .pulse-kpi-card-main strong{font-size:37px!important}
  .v60-qview-kpi .v49-kpi-link,.v60-oneview-kpi .v49-cell-link{font-size:12px!important}
}


/* ==========================================================
   V61 — Sober cards + performance-coloured typography
   ========================================================== */

/* KPI cards stay sober; performance is communicated by typography, not fill. */
.v60-kpi-card,
.v60-kpi-card.v60-good,
.v60-kpi-card.v60-warn,
.v60-kpi-card.v60-bad,
.v60-kpi-card.v60-neutral{
  background:linear-gradient(180deg,#ffffff,#f8fbfe) !important;
  border:1.5px solid #cfdce8 !important;
  box-shadow:0 8px 18px rgba(15,23,42,.055) !important;
}

/* Keep only a restrained accent line. */
.v60-kpi-card .v59-kpi-accent{
  width:5px !important;
  opacity:.72 !important;
}
.v60-kpi-card.v60-good .v59-kpi-accent{background:#178046!important}
.v60-kpi-card.v60-warn .v59-kpi-accent{background:#b77700!important}
.v60-kpi-card.v60-bad .v59-kpi-accent{background:#bd2e26!important}
.v60-kpi-card.v60-neutral .v59-kpi-accent{background:#60758a!important}

/* Disable any large coloured decorative strip/pseudo fill. */
.v60-kpi-card::after{
  background:transparent !important;
  opacity:0 !important;
}

/* Performance-based typography: strong, crystal-clear, accessible. */
.v60-kpi-card.v60-good .pulse-kpi-card-top>span:first-child,
.v60-kpi-card.v60-good .pulse-kpi-card-main strong{
  color:#0b6b36 !important;
}
.v60-kpi-card.v60-warn .pulse-kpi-card-top>span:first-child,
.v60-kpi-card.v60-warn .pulse-kpi-card-main strong{
  color:#8a5600 !important;
}
.v60-kpi-card.v60-bad .pulse-kpi-card-top>span:first-child,
.v60-kpi-card.v60-bad .pulse-kpi-card-main strong{
  color:#a51f18 !important;
}
.v60-kpi-card.v60-neutral .pulse-kpi-card-top>span:first-child,
.v60-kpi-card.v60-neutral .pulse-kpi-card-main strong{
  color:#40566b !important;
}

/* Supporting text remains dark/neutral for readability. */
.v60-kpi-card .pulse-kpi-card-main small,
.v60-kpi-card .pulse-kpi-card-foot{
  color:#41576c !important;
}
.v60-kpi-card .pulse-kpi-card-top>span:first-child{
  font-weight:950 !important;
  letter-spacing:.1px;
}
.v60-kpi-card .pulse-kpi-card-main strong{
  font-weight:950 !important;
}

/* Quality View KPI cells: neutral background only, text carries status. */
.v60-qview-kpi,
.v60-qview-kpi.v60-good,
.v60-qview-kpi.v60-warn,
.v60-qview-kpi.v60-bad,
.v60-qview-kpi.v60-neutral{
  background:#f7fafc !important;
  border-left:4px solid #c6d5e3 !important;
}
.v60-qview-kpi.v60-good{border-left-color:#178046!important}
.v60-qview-kpi.v60-warn{border-left-color:#b77700!important}
.v60-qview-kpi.v60-bad{border-left-color:#bd2e26!important}
.v60-qview-kpi.v60-neutral{border-left-color:#60758a!important}

.v60-qview-kpi.v60-good .v49-kpi-link{color:#0b6b36!important}
.v60-qview-kpi.v60-warn .v49-kpi-link{color:#8a5600!important}
.v60-qview-kpi.v60-bad .v49-kpi-link{color:#a51f18!important}
.v60-qview-kpi.v60-neutral .v49-kpi-link{color:#40566b!important}

/* One View KPI cells: same sober approach. */
.v60-oneview-kpi,
.v60-oneview-kpi.v60-good,
.v60-oneview-kpi.v60-warn,
.v60-oneview-kpi.v60-bad,
.v60-oneview-kpi.v60-neutral{
  background:#f8fbfd !important;
  border-left:4px solid #c6d5e3 !important;
}
.v60-oneview-kpi.v60-good{border-left-color:#178046!important}
.v60-oneview-kpi.v60-warn{border-left-color:#b77700!important}
.v60-oneview-kpi.v60-bad{border-left-color:#bd2e26!important}
.v60-oneview-kpi.v60-neutral{border-left-color:#60758a!important}

.v60-oneview-kpi.v60-good .v49-cell-link{color:#0b6b36!important}
.v60-oneview-kpi.v60-warn .v49-cell-link{color:#8a5600!important}
.v60-oneview-kpi.v60-bad .v49-cell-link{color:#a51f18!important}
.v60-oneview-kpi.v60-neutral .v49-cell-link{color:#40566b!important}

/* Keep status pills compact and subdued. */
.v60-kpi-card .pulse-pill{
  background:#f1f5f9 !important;
  border:1px solid #d7e0e8 !important;
  font-weight:950 !important;
}
.v60-kpi-card .pulse-pill.good{color:#0b6b36!important}
.v60-kpi-card .pulse-pill.warn{color:#8a5600!important}
.v60-kpi-card .pulse-pill.bad{color:#a51f18!important}
.v60-kpi-card .pulse-pill.neutral{color:#40566b!important}

/* Hover stays sober too. */
.v60-kpi-card:hover{
  background:linear-gradient(180deg,#ffffff,#f4f8fb) !important;
  border-color:#b9cada !important;
  box-shadow:0 10px 22px rgba(15,23,42,.08) !important;
}


/* ==========================================================
   V63 — SAFE hidden/click Performance Story drawer
   Base: V61 stable
   ========================================================== */
.v63-story-trigger{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:80;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid #0b6683;
  border-radius:999px;
  padding:10px 15px;
  background:linear-gradient(180deg,#165d7f,#124b6c);
  color:#fff;
  box-shadow:0 10px 26px rgba(15,52,78,.22);
  font-size:11px;
  font-weight:950;
  letter-spacing:.15px;
  cursor:pointer;
}
.v63-story-trigger:hover{
  transform:translateY(-1px);
  box-shadow:0 13px 30px rgba(15,52,78,.28);
}
.v63-story-trigger-icon{
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  border-radius:50%;
  background:rgba(255,255,255,.16);
  font-size:13px;
}
.v63-story-backdrop{
  position:fixed;
  inset:0;
  z-index:88;
  background:rgba(15,23,42,.18);
  opacity:0;
  transition:opacity .16s ease;
}
.v63-story-backdrop.show{opacity:1}
.v63-story-drawer{
  position:fixed;
  top:0;
  right:0;
  width:min(430px,92vw);
  height:100vh;
  z-index:90;
  display:flex;
  flex-direction:column;
  background:#fff;
  border-left:1px solid #c6d5e2;
  box-shadow:-18px 0 46px rgba(15,39,64,.18);
  transform:translateX(104%);
  transition:transform .22s ease;
}
.v63-story-drawer.open{transform:translateX(0)}
.v63-story-head{
  flex:0 0 auto;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:18px 18px 14px;
  background:linear-gradient(135deg,#103d63,#0f6f86);
  color:#fff;
}
.v63-story-kicker{
  display:block;
  margin-bottom:5px;
  font-size:9px;
  font-weight:950;
  letter-spacing:.9px;
  opacity:.9;
}
.v63-story-head h3{
  margin:0;
  color:#fff;
  font-size:19px;
  line-height:1.15;
  font-weight:950;
}
.v63-story-close{
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.12);
  color:#fff;
  width:32px;
  height:32px;
  border-radius:9px;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}
.v63-story-toolbar{
  flex:0 0 auto;
  padding:11px 14px;
  border-bottom:1px solid #d9e4ed;
  background:#f7fafc;
}
.v63-story-context{
  margin-bottom:8px;
  color:#244c69;
  font-size:11px;
  line-height:1.35;
  font-weight:900;
}
.v63-story-lang{
  display:flex;
  width:max-content;
  border:1px solid #b9cbd8;
  border-radius:9px;
  overflow:hidden;
  background:#fff;
}
.v63-story-lang button{
  border:0;
  padding:7px 11px;
  background:#fff;
  color:#4b6174;
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}
.v63-story-lang button.active{
  background:#15577c;
  color:#fff;
}
.v63-story-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:16px;
}
.v63-story-copy p{
  margin:0 0 11px;
  color:#21384a;
  font-size:12.5px;
  line-height:1.58;
  font-weight:720;
}
.v63-story-actions{
  margin-top:14px;
  padding:13px 14px;
  border:1px solid #d0dde7;
  border-left:5px solid #0e7490;
  border-radius:12px;
  background:#fafcfd;
}
.v63-story-actions h4{
  margin:0 0 8px;
  color:#0d526c;
  font-size:12px;
  font-weight:950;
}
.v63-story-actions ol{
  margin:0;
  padding-left:20px;
}
.v63-story-actions li{
  margin:0 0 7px;
  color:#263e50;
  font-size:11.5px;
  line-height:1.48;
  font-weight:740;
}
.v63-story-note{
  margin-top:13px;
  padding-top:10px;
  border-top:1px dashed #c7d4de;
  color:#60758a;
  font-size:9.5px;
  line-height:1.4;
  font-weight:750;
}
@media (max-width:700px){
  .v63-story-trigger{
    right:12px;
    bottom:12px;
  }
}


/* ==========================================================
   V64 — Management-style Performance Review narrative
   ========================================================== */
.v64-story-section{
  margin:0 0 14px;
  padding:0 0 13px;
  border-bottom:1px solid #e3ebf1;
}
.v64-story-section:last-child{
  border-bottom:0;
}
.v64-story-section h4{
  margin:0 0 8px;
  padding:7px 10px;
  border-left:4px solid #17738c;
  border-radius:7px;
  background:#eef6fa;
  color:#123f5d;
  font-size:12px;
  line-height:1.25;
  font-weight:950;
  letter-spacing:.1px;
}
.v64-story-section p{
  margin:0 0 9px !important;
  color:#253c4d !important;
  font-size:12.2px !important;
  line-height:1.62 !important;
  font-weight:700 !important;
}
.v64-story-section p:last-child{
  margin-bottom:0 !important;
}




/* ==========================================================
   V66 — AUDITED BY neutral fix
   Fixes rowspan/nth-child spill into MAY cells
   ========================================================== */

/* Header stays professional dark navy */
.v56-matrix thead .v56-column-header th:nth-child(2),
.pulse-matrix thead tr:last-child th:nth-child(2){
  background:#123f68 !important;
  color:#ffffff !important;
  font-weight:950 !important;
  text-align:center !important;
  border-color:#9fb7ca !important;
}

/* IMPORTANT: style the actual source cell by class, never nth-child.
   This prevents colour spilling into MAY on SBI rows with rowspan. */
.v56-matrix tbody td.pulse-source,
.pulse-matrix tbody td.pulse-source{
  background:#ffffff !important;
  color:#17364f !important;
  font-weight:950 !important;
  text-align:center !important;
  text-shadow:none !important;
  filter:none !important;
  border-left:1px solid #bfd0de !important;
  border-right:1px solid #bfd0de !important;
}

/* Explicitly neutralize any stale V65 colouring on monthly cells */
.v56-matrix tbody td:not(.pulse-source),
.pulse-matrix tbody td:not(.pulse-source){
  text-shadow:none;
}


/* ==========================================================
   V67 — AUDITED BY header neutral + SBI purple only
   ========================================================== */

/* AUDITED BY header: remove dark fill, match the normal column-header row */
.v56-matrix thead .v56-column-header th:nth-child(2),
.pulse-matrix thead tr:last-child th:nth-child(2){
  background:linear-gradient(180deg,#eaf3f9,#dceaf4) !important;
  color:#173b59 !important;
  font-weight:950 !important;
  text-align:center !important;
  text-shadow:none !important;
  border-left:1px solid #b7c9d8 !important;
  border-right:1px solid #b7c9d8 !important;
  border-top:1px solid #b7c9d8 !important;
  border-bottom:1.5px solid #9fb7ca !important;
}

/* Default AUDITED BY cell / DIGITIDE stays neutral */
.v56-matrix tbody td.pulse-source,
.pulse-matrix tbody td.pulse-source{
  background:#ffffff !important;
  color:#17364f !important;
  font-weight:950 !important;
  text-align:center !important;
  text-shadow:none !important;
  border-left:1px solid #bfd0de !important;
  border-right:1px solid #bfd0de !important;
}

/* Only SBI source cells get purple.
   Match by text-independent row pattern safely:
   matrix() renders DIGITIDE first and SBI second for each KPI pair.
   pulse-source itself stays the locator so month cells are never touched. */
.v56-matrix tbody tr:nth-child(even) td.pulse-source,
.pulse-matrix tbody tr:nth-child(even) td.pulse-source{
  background:#6b35a8 !important;
  color:#ffffff !important;
  text-shadow:0 1px 0 rgba(0,0,0,.16) !important;
}

/* DIGITIDE rows explicitly remain white */
.v56-matrix tbody tr:nth-child(odd) td.pulse-source,
.pulse-matrix tbody tr:nth-child(odd) td.pulse-source{
  background:#ffffff !important;
  color:#17364f !important;
  text-shadow:none !important;
}


/* ==========================================================
   V68 — DIGITIDE colour + SBI purple
   ========================================================== */

/* DIGITIDE: deep teal / blue-green, white bold text */
.v56-matrix tbody tr:nth-child(odd) td.pulse-source,
.pulse-matrix tbody tr:nth-child(odd) td.pulse-source{
  background:linear-gradient(180deg,#14758a,#0f6178) !important;
  color:#ffffff !important;
  font-weight:950 !important;
  text-shadow:0 1px 0 rgba(0,0,0,.14) !important;
  border-left:1px solid #0c5266 !important;
  border-right:1px solid #0c5266 !important;
}

/* SBI remains purple */
.v56-matrix tbody tr:nth-child(even) td.pulse-source,
.pulse-matrix tbody tr:nth-child(even) td.pulse-source{
  background:linear-gradient(180deg,#7240b3,#63319f) !important;
  color:#ffffff !important;
  font-weight:950 !important;
  text-shadow:0 1px 0 rgba(0,0,0,.16) !important;
  border-left:1px solid #54268c !important;
  border-right:1px solid #54268c !important;
}


/* ==========================================================
   V69 — Comparison Focus Animation
   Hover either DIGITIDE or SBI row -> both rows focus together
   ========================================================== */

/* Smooth transitions without changing table geometry. */
.pulse-matrix tbody td,
.v56-matrix tbody td,
.v49-oneview tbody td,
.v50-table-shell tbody td{
  transition:
    background-color .16s ease,
    color .16s ease,
    box-shadow .16s ease,
    transform .16s ease,
    filter .16s ease !important;
}

/* Pair comparison: both DIGITIDE + SBI rows are visually grouped. */
.pulse-matrix tbody tr.v69-compare-pair td,
.v56-matrix tbody tr.v69-compare-pair td{
  position:relative;
  z-index:2;
  filter:brightness(1.035) saturate(1.04);
  box-shadow:
    inset 0 1px 0 rgba(14,116,144,.28),
    inset 0 -1px 0 rgba(14,116,144,.28);
  transform:scaleY(1.025);
}

/* The exact row under the pointer is slightly stronger, while its pair stays highlighted. */
.pulse-matrix tbody tr.v69-compare-primary td,
.v56-matrix tbody tr.v69-compare-primary td{
  z-index:3;
  filter:brightness(1.065) saturate(1.08);
  box-shadow:
    inset 0 2px 0 rgba(2,132,199,.55),
    inset 0 -2px 0 rgba(2,132,199,.55),
    0 3px 10px rgba(15,63,91,.10);
  transform:scaleY(1.045);
}

/* KPI name cell visually joins the comparison pair without becoming flashy. */
.pulse-matrix tbody tr.v69-compare-pair .pulse-kpi-name,
.v56-matrix tbody tr.v69-compare-pair .pulse-kpi-name{
  font-weight:950 !important;
}

/* Other comparison / analytical tables: hover the full data row as one unit. */
.v49-oneview tbody tr.v69-row-focus td,
.v50-table-shell tbody tr.v69-row-focus td{
  position:relative;
  z-index:2;
  filter:brightness(1.035);
  box-shadow:
    inset 0 1.5px 0 rgba(14,116,144,.32),
    inset 0 -1.5px 0 rgba(14,116,144,.32),
    0 3px 9px rgba(15,63,91,.08);
  transform:scaleY(1.025);
}

/* Do not let hover overwrite deliberate DIGITIDE/SBI identity colours. */
.pulse-matrix tbody tr.v69-compare-pair td.pulse-source,
.v56-matrix tbody tr.v69-compare-pair td.pulse-source{
  filter:brightness(1.08) saturate(1.06);
}

/* Accessibility: animation is optional; highlighting remains static if reduced motion is preferred. */
@media (prefers-reduced-motion: reduce){
  .pulse-matrix tbody td,
  .v56-matrix tbody td,
  .v49-oneview tbody td,
  .v50-table-shell tbody td{
    transition:none !important;
  }
  .pulse-matrix tbody tr.v69-compare-pair td,
  .v56-matrix tbody tr.v69-compare-pair td,
  .pulse-matrix tbody tr.v69-compare-primary td,
  .v56-matrix tbody tr.v69-compare-primary td,
  .v49-oneview tbody tr.v69-row-focus td,
  .v50-table-shell tbody tr.v69-row-focus td{
    transform:none !important;
  }
}


/* ==========================================================
   V70 — Searchable Agent + verified 6-month behaviour detail
   ========================================================== */
.v70-agent-search-wrap{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:7px;
  align-items:center;
}
.v70-agent-search-wrap input[type="search"]{
  width:100%;
  min-width:0;
  height:38px;
  padding:0 12px;
  border:1.5px solid #8fb4d0;
  border-radius:9px;
  background:#fff;
  color:#17364f;
  font:800 12px/1.2 inherit;
  outline:none;
}
.v70-agent-search-wrap input[type="search"]:focus{
  border-color:#167da0;
  box-shadow:0 0 0 3px rgba(22,125,160,.12);
}
.v70-agent-fallback{
  width:74px !important;
  min-width:74px !important;
  font-size:10px !important;
}
.v70-behavior-modal{
  width:min(920px,94vw) !important;
}
.v70-behavior-summary{
  display:grid;
  grid-template-columns:repeat(5,minmax(120px,1fr));
  gap:9px;
  margin-bottom:11px;
}
.v70-behavior-summary>div{
  padding:10px 11px;
  border:1px solid #cedce7;
  border-radius:10px;
  background:#f8fbfd;
}
.v70-behavior-summary small{
  display:block;
  margin-bottom:4px;
  color:#60758a;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
}
.v70-behavior-summary strong{
  color:#163f5d;
  font-size:12px;
  font-weight:950;
}
.v70-behavior-note{
  margin-bottom:10px;
  color:#526b7f;
  font-size:10px;
  font-weight:800;
}
.v70-behavior-table-wrap{
  overflow:auto;
  max-height:430px;
  border:1px solid #d5e0e8;
  border-radius:10px;
}
.v70-behavior-table-wrap table{
  width:100%;
  border-collapse:collapse;
}
.v70-behavior-table-wrap th,
.v70-behavior-table-wrap td{
  padding:8px 9px;
  border-bottom:1px solid #e1e8ee;
  text-align:left;
  font-size:10.5px;
}
.v70-behavior-table-wrap th{
  position:sticky;
  top:0;
  z-index:2;
  background:#eaf3f8;
  color:#234963;
  font-weight:950;
}
.v50-month-card{
  cursor:pointer;
}
.v50-month-card:hover{
  box-shadow:0 8px 20px rgba(15,63,91,.12);
}
@media (max-width:760px){
  .v70-behavior-summary{grid-template-columns:1fr 1fr}
}


/* ==========================================================
   V72 — Dynamic premium global page header
   ========================================================== */
.cat-dynamic-topbar{
  position:sticky;
  top:0;
  z-index:40;
  min-height:74px;
  padding:9px 18px 9px 20px !important;
  border-bottom:1px solid #cbd9e5 !important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.98),rgba(247,251,254,.98)) !important;
  box-shadow:0 5px 18px rgba(15,52,78,.065);
  overflow:hidden;
}
.cat-dynamic-topbar::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:3px;
  background:linear-gradient(90deg,#14537a,#0f7890,#28a7b5);
  opacity:.95;
}
.cat-topbar-left{
  min-width:0;
  gap:12px !important;
}
.cat-route-icon{
  display:grid;
  place-items:center;
  flex:0 0 42px;
  width:42px;
  height:42px;
  border-radius:13px;
  background:linear-gradient(145deg,#eef7fb,#dcecf5);
  border:1px solid #b7cede;
  color:#155c7b;
  font-size:20px;
  font-weight:950;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95);
}
.cat-route-copy{
  min-width:0;
}
.cat-route-kicker{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:2px;
  color:#60758a;
  font-size:8.5px;
  line-height:1;
  font-weight:950;
  letter-spacing:.65px;
  text-transform:uppercase;
}
.cat-route-live-dot{
  width:6px;
  height:6px;
  flex:0 0 6px;
  border-radius:50%;
  background:#16a36a;
  box-shadow:0 0 0 3px rgba(22,163,106,.10);
}
.cat-dynamic-topbar h2{
  margin:0 !important;
  color:#142f48;
  font-size:20px !important;
  line-height:1.08;
  font-weight:950;
  letter-spacing:-.25px;
}
.cat-dynamic-topbar p{
  margin:3px 0 0 !important;
  color:#526a7e !important;
  font-size:10.5px !important;
  line-height:1.25;
  font-weight:750;
}
.cat-topbar-right{
  gap:9px !important;
}
.cat-user-card{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:190px;
  padding:7px 10px 7px 8px;
  border:1px solid #d1dde7;
  border-radius:12px;
  background:#fff;
  box-shadow:0 3px 10px rgba(15,52,78,.045);
}
.cat-user-avatar{
  display:grid;
  place-items:center;
  flex:0 0 34px;
  width:34px;
  height:34px;
  border-radius:10px;
  background:linear-gradient(145deg,#174f78,#0f7890);
  color:#fff;
  font-size:11px;
  font-weight:950;
  letter-spacing:.4px;
}
.cat-user-card .user-summary{
  min-width:0;
  text-align:left;
}
.cat-user-card .user-summary strong{
  max-width:160px;
  overflow:hidden;
  color:#18344c;
  font-size:11.5px;
  font-weight:950;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.cat-user-card .user-summary span{
  margin-top:2px !important;
  color:#667d90 !important;
  font-size:9px !important;
  font-weight:850;
}
.cat-logout-button{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:38px;
  border:1px solid #cfdae4 !important;
  border-radius:10px !important;
  background:#f7fafc !important;
  color:#344f65 !important;
  font-weight:900 !important;
}
.cat-logout-button:hover{
  background:#eef5f8 !important;
  border-color:#afc4d4 !important;
}

/* Route-specific accent without rebuilding the header */
.cat-dynamic-topbar[data-route="qa-audit"]::after{background:linear-gradient(90deg,#087f5b,#18a36e,#64c796)}
.cat-dynamic-topbar[data-route="cdr-sampling"]::after{background:linear-gradient(90deg,#08758d,#18a5ba,#62cbd5)}
.cat-dynamic-topbar[data-route="cdr-analytics"]::after{background:linear-gradient(90deg,#5145a6,#7165c9,#9c94e0)}
.cat-dynamic-topbar[data-route="po-audit"]::after{background:linear-gradient(90deg,#9a6a06,#c69522,#e0bc5d)}
.cat-dynamic-topbar[data-route="audit-list"]::after{background:linear-gradient(90deg,#315f8d,#4c7fb0,#83a7ca)}
.cat-dynamic-topbar[data-route="rebuttals"]::after{background:linear-gradient(90deg,#a44b2c,#c96d45,#e69b79)}
.cat-dynamic-topbar[data-route="import-export"]::after{background:linear-gradient(90deg,#06736e,#0e9890,#53bdb6)}
.cat-dynamic-topbar[data-route="site-information"]::after{background:linear-gradient(90deg,#0d6b70,#17969a,#57bfc1)}
.cat-dynamic-topbar[data-route="documentation"]::after{background:linear-gradient(90deg,#6d3b94,#8a59ad,#b18bc8)}
.cat-dynamic-topbar[data-route="admin"]::after{background:linear-gradient(90deg,#40556a,#647b91,#96a8b7)}

@media (max-width:900px){
  .cat-route-kicker #pageContextLabel{display:none}
  .cat-user-card{min-width:0}
}
@media (max-width:700px){
  .cat-route-icon{display:none}
  .cat-user-card{display:none}
  .cat-dynamic-topbar h2{font-size:17px !important}
  .cat-route-kicker{font-size:7.5px}
}


/* ==========================================================
   V73 — Centered Digitide + SBI branding in existing topbar
   Height/width of the white strip is intentionally unchanged.
   ========================================================== */
.cat-dynamic-topbar{
  position:sticky;
}

/* Fixed visual center of the white strip, independent of left/right content. */
.cat-center-brand{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  max-width:265px;
  height:40px;
  overflow:hidden;
}

.cat-center-brand img{
  display:block;
  width:auto;
  height:32px;
  max-width:245px;
  object-fit:contain;
  object-position:center;
  background:transparent;
}

/* Keep left/right blocks above the center image only if they approach it. */
.cat-topbar-left,
.cat-topbar-right{
  position:relative;
  z-index:3;
}

/* Preserve current topbar dimensions. */
.cat-dynamic-topbar{
  min-height:74px !important;
  padding-top:9px !important;
  padding-bottom:9px !important;
}

/* Smaller screens: keep branding present but more compact. */
@media (max-width:1150px){
  .cat-center-brand{
    max-width:190px;
  }
  .cat-center-brand img{
    height:26px;
    max-width:180px;
  }
}
@media (max-width:820px){
  .cat-center-brand{
    max-width:145px;
  }
  .cat-center-brand img{
    height:22px;
    max-width:140px;
  }
}
@media (max-width:620px){
  .cat-center-brand{
    opacity:.95;
    max-width:115px;
  }
  .cat-center-brand img{
    height:18px;
    max-width:110px;
  }
}


/* ==========================================================
   V74 — Fatal Error Rate cards + Root Cause Analysis
   ========================================================== */
.v74-fatal-card{
  min-height:104px;
  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
}
.v74-fatal-metric{
  font-size:17px !important;
  font-weight:950 !important;
  line-height:1.05;
}
.v74-fatal-rate{
  font-size:13px;
  font-weight:950;
  color:#203e56;
}
.v74-fatal-trend{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:18px;
  margin-top:3px;
  padding:2px 7px;
  border-radius:999px;
  font-size:8.5px;
  line-height:1.1;
  font-weight:950;
  white-space:nowrap;
}
.v74-fatal-trend.improved{
  color:#0b6b36;
  background:#eaf8ef;
  border:1px solid #8bd0a6;
}
.v74-fatal-trend.worsened{
  color:#a42018;
  background:#fff0ef;
  border:1px solid #efa19b;
}
.v74-fatal-trend.same{
  color:#6a5700;
  background:#fff8dd;
  border:1px solid #e9d281;
}
.v74-fatal-trend.na{
  color:#60758a;
  background:#f1f5f8;
  border:1px solid #d3dee7;
}

/* Fatal card direction colour: lower MoM = green, higher MoM = red */
.v74-fatal-card.good{
  border-color:#82c99d !important;
  background:linear-gradient(180deg,#fbfffc,#eefaf2) !important;
}
.v74-fatal-card.bad{
  border-color:#ef9e98 !important;
  background:linear-gradient(180deg,#fffdfd,#fff0ef) !important;
}
.v74-fatal-card.neutral{
  border-color:#c5d5e1 !important;
  background:linear-gradient(180deg,#fff,#f8fbfd) !important;
}

.v74-fatal-modal{
  width:min(1080px,95vw) !important;
}
.v74-fatal-summary{
  display:grid;
  grid-template-columns:repeat(5,minmax(120px,1fr));
  gap:9px;
  margin-bottom:14px;
}
.v74-fatal-summary>div{
  padding:11px 12px;
  border:1px solid #cedce7;
  border-radius:11px;
  background:#f8fbfd;
}
.v74-fatal-summary>div.improved{background:#eefaf2;border-color:#9bd4af}
.v74-fatal-summary>div.worsened{background:#fff1f0;border-color:#efaaa4}
.v74-fatal-summary small{
  display:block;
  margin-bottom:5px;
  color:#61778a;
  font-size:8.5px;
  font-weight:950;
  text-transform:uppercase;
}
.v74-fatal-summary strong{
  color:#173d59;
  font-size:13px;
  font-weight:950;
}
.v74-rca-section{
  margin:0 0 15px;
  padding:13px 14px;
  border:1px solid #d4e0e9;
  border-radius:12px;
  background:#fff;
}
.v74-rca-section h4{
  margin:0 0 9px;
  color:#123f5f;
  font-size:13px;
  font-weight:950;
}
.v74-rca-section p{
  margin:0 0 8px;
  color:#294356;
  font-size:11.5px;
  line-height:1.55;
  font-weight:720;
}
.v74-role-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}
.v74-role-grid>div{
  padding:10px;
  border-radius:9px;
  background:#f7fafc;
  border:1px solid #dbe5ec;
}
.v74-role-grid h5{
  margin:0 0 7px;
  color:#37566d;
  font-size:10px;
  font-weight:950;
}
.v74-role-grid ul{
  list-style:none;
  margin:0;
  padding:0;
}
.v74-role-grid li{
  display:flex;
  justify-content:space-between;
  gap:8px;
  padding:5px 0;
  border-bottom:1px dashed #d8e2e9;
  color:#334f63;
  font-size:10px;
}
.v74-role-grid li:last-child{border-bottom:0}
.v74-comment-list{
  display:grid;
  gap:8px;
}
.v74-comment-list article{
  padding:9px 10px;
  border-left:4px solid #c04a42;
  border-radius:7px;
  background:#fff7f6;
}
.v74-comment-list article strong{
  color:#7f261f;
  font-size:10px;
  font-weight:950;
}
.v74-comment-list article p{
  margin:4px 0 0 !important;
}
.v74-empty-note{
  padding:10px;
  border-radius:8px;
  background:#f7fafc;
  color:#61778a;
  font-size:10.5px;
  font-weight:750;
}
.v74-training{
  border-left:5px solid #b77700;
  background:#fffdf7;
}
.v74-training ol{
  margin:0;
  padding-left:20px;
}
.v74-training li{
  margin-bottom:7px;
  color:#394d5d;
  font-size:11px;
  line-height:1.5;
  font-weight:760;
}
@media (max-width:800px){
  .v74-fatal-summary{grid-template-columns:1fr 1fr}
  .v74-role-grid{grid-template-columns:1fr}
}


/* ==========================================================
   V75 — Premium bilingual Fatal RCA modal
   ========================================================== */
.v75-fatal-modal{
  width:min(1120px,95vw) !important;
  border-radius:18px !important;
  overflow:hidden;
}
.v75-fatal-head{
  background:linear-gradient(135deg,#123f68,#0f7590) !important;
  padding:14px 16px !important;
}
.v75-head-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
.v75-lang-toggle{
  display:flex;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.38);
  border-radius:9px;
  background:rgba(255,255,255,.12);
}
.v75-lang-toggle button{
  border:0;
  padding:7px 10px;
  background:transparent;
  color:#dceef5;
  font-size:9.5px;
  font-weight:950;
  cursor:pointer;
}
.v75-lang-toggle button.active{
  background:#fff;
  color:#154f6d;
}
.v75-fatal-hero{
  display:grid;
  grid-template-columns:1.15fr 1fr 1.25fr;
  gap:10px;
  margin-bottom:14px;
}
.v75-fatal-hero>div{
  min-height:96px;
  padding:14px 15px;
  border-radius:14px;
  border:1px solid #d0dde7;
  background:linear-gradient(180deg,#fff,#f8fbfd);
  box-shadow:0 4px 14px rgba(15,63,91,.05);
}
.v75-fatal-hero span{
  display:block;
  color:#61778b;
  font-size:8.5px;
  font-weight:950;
  letter-spacing:.45px;
  text-transform:uppercase;
}
.v75-fatal-hero strong{
  display:block;
  margin:7px 0 4px;
  color:#153f5f;
  font-size:23px;
  line-height:1;
  font-weight:950;
}
.v75-fatal-hero em{
  color:#647b8e;
  font-size:9.5px;
  font-style:normal;
  font-weight:800;
}
.v75-fatal-kpi{
  border-left:5px solid #d13f35 !important;
}
.v75-fatal-movement.good{
  border-left:5px solid #16955b !important;
  background:linear-gradient(180deg,#fbfffc,#eefaf3) !important;
}
.v75-fatal-movement.bad{
  border-left:5px solid #d13f35 !important;
  background:linear-gradient(180deg,#fffdfd,#fff0ef) !important;
}
.v75-fatal-movement.neutral{
  border-left:5px solid #7b8d9d !important;
}
.v75-fatal-scope{
  border-left:5px solid #167b9a !important;
}
.v75-section{
  box-shadow:0 3px 12px rgba(15,63,91,.035);
}
.v75-section-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:11px;
}
.v75-section-num{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  flex:0 0 30px;
  border-radius:9px;
  background:linear-gradient(145deg,#eaf5f9,#d7eaf2);
  color:#15627d;
  font-size:10px;
  font-weight:950;
}
.v75-section-title h4{
  margin:0 !important;
  font-size:13px !important;
}
.v75-section-title small{
  display:block;
  margin-top:2px;
  color:#73889a;
  font-size:9px;
  font-weight:760;
}
.v75-action-list{
  display:grid;
  gap:9px;
}
.v75-action-item{
  display:grid;
  grid-template-columns:74px minmax(0,1fr);
  gap:10px;
  align-items:start;
  padding:10px 11px;
  border:1px solid #d8e2e9;
  border-radius:10px;
  background:#fff;
}
.v75-priority{
  display:inline-grid;
  place-items:center;
  min-height:24px;
  border-radius:999px;
  font-size:8.5px;
  font-weight:950;
  letter-spacing:.3px;
}
.v75-action-item.high .v75-priority{
  background:#fff0ef;color:#a5221b;border:1px solid #efa39d;
}
.v75-action-item.medium .v75-priority{
  background:#fff7df;color:#8a5b00;border:1px solid #e9cf81;
}
.v75-action-item.monitor .v75-priority{
  background:#edf6fb;color:#17617e;border:1px solid #aad0e0;
}
.v75-action-item strong{
  color:#27485f;
  font-size:10px;
  font-weight:950;
}
.v75-action-item p{
  margin:4px 0 0 !important;
}
.v75-audit-table{
  max-height:360px;
}
.v75-audit-table th{
  top:0;
  position:sticky;
  z-index:3;
}
@media (max-width:760px){
  .v75-fatal-hero{grid-template-columns:1fr}
  .v75-head-actions{gap:6px}
  .v75-lang-toggle button{padding:6px 8px}
}


/* ==========================================================
   V76 — Fatal language toggle fix + sticky global footer
   ========================================================== */

/* ---------- Fatal RCA language toggle fix ---------- */
.v75-head-actions{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  flex:0 0 auto !important;
}

.v75-lang-toggle{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  width:148px !important;
  min-width:148px !important;
  height:34px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.48) !important;
  border-radius:10px !important;
  background:rgba(255,255,255,.12) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}

.v75-lang-toggle button{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-width:0 !important;
  height:32px !important;
  padding:0 8px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#e7f3f7 !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:950 !important;
  white-space:nowrap !important;
  overflow:visible !important;
  cursor:pointer !important;
}

.v75-lang-toggle button + button{
  border-left:1px solid rgba(255,255,255,.28) !important;
}

.v75-lang-toggle button.active{
  background:#ffffff !important;
  color:#154f6d !important;
  box-shadow:0 1px 5px rgba(0,0,0,.10);
}

.v75-fatal-head > button,
.v75-head-actions > button[data-close]{
  flex:0 0 34px !important;
  width:34px !important;
  min-width:34px !important;
  height:34px !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  border-radius:9px !important;
  font-size:20px !important;
  line-height:1 !important;
}

/* Keep header content readable on narrower modal widths */
@media (max-width:720px){
  .v75-fatal-head{
    align-items:flex-start !important;
  }
  .v75-head-actions{
    gap:6px !important;
  }
  .v75-lang-toggle{
    width:132px !important;
    min-width:132px !important;
  }
  .v75-lang-toggle button{
    font-size:9px !important;
    padding:0 6px !important;
  }
}

/* ---------- Global sticky developer credit bar ---------- */
.cat-global-credit-bar{
  position:fixed;
  left:232px;
  right:0;
  bottom:0;
  z-index:95;
  height:25px;
  min-height:25px;
  background:#050505;
  color:#ffffff;
  border-top:1px solid rgba(255,255,255,.14);
  box-shadow:0 -2px 10px rgba(0,0,0,.16);
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
}

.cat-global-credit-inner{
  width:100%;
  padding:0 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  color:#ffffff;
  font-size:9.5px;
  line-height:1;
  font-weight:700;
  letter-spacing:.08px;
  white-space:nowrap;
  text-align:center;
}

.cat-global-credit-inner strong{
  color:#ffffff;
  font-weight:950;
}

.cat-credit-label{
  color:#d7d7d7;
  font-weight:750;
}

.cat-credit-sep{
  color:#7fd4e4;
  font-size:8px;
  font-weight:950;
}

/* Prevent footer from covering the last content row */
.main-content,
.content-area,
.app-main{
  padding-bottom:31px !important;
}

/* If sidebar is not visible / smaller screens, span full width */
@media (max-width:900px){
  .cat-global-credit-bar{
    left:0;
  }
  .cat-global-credit-inner{
    padding:0 10px;
    gap:6px;
    font-size:8.5px;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

@media (max-width:620px){
  .cat-global-credit-bar{
    height:auto;
    min-height:29px;
    padding:4px 0;
  }
  .cat-global-credit-inner{
    white-space:normal;
    flex-wrap:wrap;
    row-gap:2px;
    line-height:1.2;
  }
}


/* ==========================================================
   V78 — Dashboard KPI Performance comparison cards
   Visual language aligned with Audit Records V77
   ========================================================== */
.v78-title-note{margin-left:8px;color:#cfe9f2;font-size:9px;font-weight:850;letter-spacing:.2px}
.v78-kpi-compare-grid{display:grid;grid-template-columns:repeat(2,minmax(420px,1fr));gap:12px;margin:12px 0 16px}
.v78-kpi-compare-card{overflow:hidden;border:1px solid #cbd8e3;border-radius:12px;background:#fff;box-shadow:0 4px 14px rgba(15,63,91,.045)}
.v78-kpi-card-head{min-height:42px;padding:9px 11px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:linear-gradient(180deg,#f5f9fc,#ebf3f8);border-bottom:1px solid #cbd8e3}
.v78-kpi-card-head>span{color:#718397;font-size:8px;font-weight:850;white-space:nowrap}
.v78-kpi-name-link{border:0;padding:0;background:transparent;color:#173e5b;font-size:11px;font-weight:950;letter-spacing:.1px;cursor:pointer;text-align:left}
.v78-kpi-name-link:hover{color:#0f718b;text-decoration:underline}
.v78-kpi-source-row{display:grid;grid-template-columns:82px minmax(0,1fr) 118px;min-height:68px;border-bottom:1px solid #d9e3eb}
.v78-kpi-source{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#fff;font-weight:950}
.v78-kpi-source span{font-size:10px;letter-spacing:.2px}.v78-kpi-source small{font-size:8px;opacity:.88;font-weight:850}
.v78-kpi-source.qa{background:linear-gradient(180deg,#14758a,#0f6178)}.v78-kpi-source.sbi{background:linear-gradient(180deg,#7240b3,#63319f)}
.v78-kpi-bau-value{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:7px 8px;border-left:1px solid #d8e2ea;background:#fff;text-align:center}
.v78-kpi-bau-label{color:#61778a;font-size:7.5px;font-weight:950;letter-spacing:.35px}.v78-kpi-bau-value strong{margin-top:1px;font-size:18px;line-height:1;font-weight:950}.v78-kpi-bau-value small{margin-top:3px;color:#718397;font-size:7.5px;font-weight:750}
.v78-kpi-target{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:7px 8px;border-left:1px solid #d8e2ea;background:#fafcff;text-align:center}
.v78-kpi-target>span{color:#6e8294;font-size:7.5px;font-weight:900;text-transform:uppercase}.v78-kpi-target>strong{color:#4b3ea8;font-size:12px;font-weight:950}.v78-status-text{font-size:7.5px!important;font-weight:950!important}
.v78-good strong,.v78-good.v78-status-text{color:#0b743d!important}.v78-warn strong,.v78-warn.v78-status-text{color:#9b6000!important}.v78-bad strong,.v78-bad.v78-status-text{color:#b4231a!important}.v78-neutral strong,.v78-neutral.v78-status-text{color:#687c8d!important}
.v78-kpi-links{display:flex;justify-content:flex-end;align-items:center;gap:8px;min-height:35px;padding:6px 10px;background:#fbfdfe}
@media (max-width:1250px){.v78-kpi-compare-grid{grid-template-columns:1fr}}@media (max-width:720px){.v78-kpi-source-row{grid-template-columns:72px minmax(0,1fr) 96px}}


/* ==========================================================
   V79 — KPI cards BAU / HYGIENE / OJT only
   All other dashboard sections remain BAU-only.
   ========================================================== */
.v79-kpi-source-row{
  display:grid;
  grid-template-columns:82px minmax(0,1fr) 108px;
  min-height:74px;
  border-bottom:1px solid #d9e3eb;
}
.v79-calltype-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.v79-type-cell{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:7px 6px;
  text-align:center;
  border-left:1px solid #d8e2ea;
  background:#fff;
}
.v79-type-cell:first-child{border-left:0}
.v79-type-cell>span{
  color:#61778a;
  font-size:7.5px;
  font-weight:950;
  letter-spacing:.3px;
}
.v79-type-cell>strong{
  margin-top:3px;
  font-size:14px;
  line-height:1;
  font-weight:950;
}
.v79-type-cell>small{
  margin-top:4px;
  color:#748899;
  font-size:7.5px;
  font-weight:750;
}
.v79-type-cell.v78-good strong{color:#0b743d}
.v79-type-cell.v78-watch strong,
.v79-type-cell.v78-warn strong{color:#9b6000}
.v79-type-cell.v78-action strong,
.v79-type-cell.v78-bad strong{color:#b4231a}
.v79-type-cell.v78-neutral strong{color:#687c8d;font-size:11px}
.v79-bau{background:linear-gradient(180deg,#fff,#fbfefd)}
.v79-hygiene{background:linear-gradient(180deg,#fff,#fffdfb)}
.v79-ojt{background:linear-gradient(180deg,#fff,#fcfcff)}

.v79-kpi-modal{width:min(1100px,95vw)!important}
.v79-drill-note{
  margin-bottom:12px;
  padding:8px 10px;
  border:1px solid #cfe0ea;
  border-radius:9px;
  background:#f4f9fc;
  color:#49677d;
  font-size:10px;
  font-weight:800;
}
.v79-drill-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:11px;
}
.v79-drill-type{
  overflow:hidden;
  border:1px solid #cbd9e4;
  border-radius:11px;
  background:#fff;
}
.v79-drill-type-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:9px 10px;
  background:#eaf3f8;
  border-bottom:1px solid #cbd9e4;
}
.v79-drill-type-head strong{color:#173f5d;font-size:11px;font-weight:950}
.v79-drill-type-head span{color:#667d90;font-size:8.5px;font-weight:850}
.v79-bau .v79-drill-type-head{border-top:4px solid #15915a}
.v79-hygiene .v79-drill-type-head{border-top:4px solid #d45b46}
.v79-ojt .v79-drill-type-head{border-top:4px solid #6256b5}
.v79-drill-table-wrap{max-height:420px;overflow:auto}
.v79-drill-table-wrap table{width:100%;border-collapse:collapse}
.v79-drill-table-wrap th,.v79-drill-table-wrap td{
  padding:7px 6px;
  border:1px solid #d9e3eb;
  font-size:9.5px;
  text-align:left;
}
.v79-drill-table-wrap th{
  position:sticky;top:0;z-index:2;
  background:#f5f9fc;color:#34546b;font-weight:950;
}
@media(max-width:1150px){
  .v79-drill-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .v79-kpi-source-row{grid-template-columns:68px minmax(0,1fr) 90px}
  .v79-type-cell>strong{font-size:12px}
}


/* ==========================================================
   V80 — Wide compact KPI drill-down popup
   Keeps BAU / HYGIENE / OJT visible together on desktop.
   ========================================================== */
.v79-kpi-modal{
  width:min(1420px,97vw)!important;
  max-height:92vh!important;
  top:4vh!important;
  border-radius:16px!important;
}
.v79-kpi-modal .v49-modal-head{
  flex:0 0 auto;
  min-height:58px;
  padding:11px 15px!important;
}
.v79-kpi-modal .v49-modal-body{
  flex:1 1 auto;
  min-height:0;
  overflow:hidden!important;
  padding:0 0 10px;
}
.v79-drill-note{
  margin:0!important;
  padding:7px 12px!important;
  border-radius:0!important;
  border-left:0!important;
  border-right:0!important;
  font-size:9px!important;
}
.v79-drill-grid{
  height:calc(92vh - 106px);
  min-height:430px;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  padding:10px 12px 0!important;
  align-items:stretch;
}
.v79-drill-type{
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
  border-radius:10px!important;
}
.v79-drill-type-head{
  flex:0 0 auto;
  min-height:38px;
  padding:7px 9px!important;
}
.v79-drill-type-head strong{
  font-size:10.5px!important;
}
.v79-drill-type-head span{
  font-size:8px!important;
}
.v79-drill-table-wrap{
  flex:1 1 auto;
  min-height:0;
  max-height:none!important;
  overflow:auto!important;
  scrollbar-width:thin;
}
.v79-drill-table-wrap table{
  table-layout:fixed;
  width:100%!important;
}
.v79-drill-table-wrap th,
.v79-drill-table-wrap td{
  padding:6px 6px!important;
  font-size:9px!important;
  line-height:1.25;
  vertical-align:middle;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.v79-drill-table-wrap th:nth-child(1),
.v79-drill-table-wrap td:nth-child(1){width:38px;text-align:center!important}
.v79-drill-table-wrap th:nth-child(2),
.v79-drill-table-wrap td:nth-child(2){width:auto}
.v79-drill-table-wrap th:nth-child(3),
.v79-drill-table-wrap td:nth-child(3){width:58px;text-align:center!important}
.v79-drill-table-wrap th:nth-child(4),
.v79-drill-table-wrap td:nth-child(4){width:82px;text-align:center!important}

/* 3-column desktop view should remain active much longer. */
@media(min-width:901px) and (max-width:1150px){
  .v79-kpi-modal{width:98vw!important}
  .v79-drill-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;padding-left:7px!important;padding-right:7px!important}
  .v79-drill-table-wrap th,.v79-drill-table-wrap td{font-size:8.5px!important;padding:5px 4px!important}
}
@media(max-width:900px){
  .v79-kpi-modal{
    top:2vh!important;
    width:96vw!important;
    max-height:96vh!important;
  }
  .v79-kpi-modal .v49-modal-body{overflow:auto!important}
  .v79-drill-grid{
    height:auto;
    min-height:0;
    grid-template-columns:1fr!important;
  }
  .v79-drill-type{height:auto;min-height:220px}
  .v79-drill-table-wrap{max-height:320px!important}
}


/* ==========================================================
   V81 — KPI drill-down visible data columns fix
   ========================================================== */

.v80-drilldown-modal,
.v79-kpi-drilldown-modal,
.v79-drill-modal,
.v80-kpi-drill-modal{
  width:min(1260px,94vw) !important;
  max-width:1260px !important;
  height:min(760px,82vh) !important;
  max-height:82vh !important;
}

.v80-drilldown-grid,
.v79-drilldown-grid,
.v79-kpi-drilldown-grid,
.v80-kpi-drilldown-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
  min-height:0 !important;
}

.v80-drilldown-panel,
.v79-drilldown-panel,
.v79-calltype-panel,
.v80-calltype-panel{
  min-width:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}

.v80-drilldown-panel table,
.v79-drilldown-panel table,
.v79-calltype-panel table,
.v80-calltype-panel table{
  width:100% !important;
  table-layout:fixed !important;
  border-collapse:collapse !important;
}

.v80-drilldown-panel th,
.v80-drilldown-panel td,
.v79-drilldown-panel th,
.v79-drilldown-panel td,
.v79-calltype-panel th,
.v79-calltype-panel td,
.v80-calltype-panel th,
.v80-calltype-panel td{
  border:1px solid #cbd7e1 !important;
  padding:6px 7px !important;
  font-size:9px !important;
  vertical-align:middle !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

.v80-drilldown-panel th,
.v79-drilldown-panel th,
.v79-calltype-panel th,
.v80-calltype-panel th{
  background:#edf4f8 !important;
  color:#31516a !important;
  font-weight:950 !important;
  text-align:center !important;
}

.v81-col-rank{
  width:34px !important;
  text-align:center !important;
}
.v81-col-agent{
  width:38% !important;
  text-align:left !important;
}
.v81-col-audits{
  width:56px !important;
  text-align:center !important;
}
.v81-col-score{
  width:78px !important;
  text-align:center !important;
  font-weight:950 !important;
}
.v81-col-status{
  width:92px !important;
  text-align:center !important;
}

.v81-status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:68px;
  max-width:88px;
  min-height:21px;
  padding:2px 6px;
  border-radius:999px;
  font-size:7.5px;
  font-weight:950;
  white-space:nowrap;
}
.v81-status-badge.good{
  background:#eaf8ef;
  color:#0b6b36;
  border:1px solid #8bd0a6;
}
.v81-status-badge.watch,
.v81-status-badge.warning{
  background:#fff7df;
  color:#8a5b00;
  border:1px solid #e9cf81;
}
.v81-status-badge.bad,
.v81-status-badge.action{
  background:#fff0ef;
  color:#a5221b;
  border:1px solid #efa39d;
}
.v81-status-badge.neutral{
  background:#f1f5f8;
  color:#60758a;
  border:1px solid #d3dee7;
}

/* Let populated lists use available vertical space but avoid page scrolling. */
.v80-drilldown-panel tbody,
.v79-drilldown-panel tbody,
.v79-calltype-panel tbody,
.v80-calltype-panel tbody{
  max-height:520px;
}

/* Empty call-type panels should not look like giant blank sheets. */
.v80-drilldown-panel:has(.v49-empty),
.v79-drilldown-panel:has(.v49-empty),
.v79-calltype-panel:has(.v49-empty),
.v80-calltype-panel:has(.v49-empty){
  min-height:150px !important;
}

@media (max-width:1050px){
  .v80-drilldown-grid,
  .v79-drilldown-grid,
  .v79-kpi-drilldown-grid,
  .v80-kpi-drilldown-grid{
    grid-template-columns:1fr !important;
  }

  .v80-drilldown-modal,
  .v79-drilldown-modal,
  .v79-kpi-drill-modal,
  .v80-kpi-drill-modal{
    height:auto !important;
    max-height:86vh !important;
  }
}


/* ==========================================================
   V82 — KPI drilldown full columns + compact Audit Records filters
   ========================================================== */
.v82-kpi-modal{
  width:min(1280px,94vw) !important;
  max-width:1280px !important;
  height:min(720px,80vh) !important;
  max-height:80vh !important;
  overflow:hidden !important;
}
.v82-modal-body{
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
}
.v82-drill-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow:hidden !important;
}
.v82-drill-type{
  min-width:0 !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}
.v82-drill-table-wrap{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow:auto !important;
}
.v82-drill-table{
  width:100% !important;
  table-layout:fixed !important;
  border-collapse:collapse !important;
}
.v82-drill-table .c-rank{width:34px}
.v82-drill-table .c-agent{width:auto}
.v82-drill-table .c-audits{width:58px}
.v82-drill-table .c-score{width:78px}
.v82-drill-table .c-status{width:100px}
.v82-drill-table th,
.v82-drill-table td{
  border:1px solid #cbd7e1 !important;
  padding:6px 7px !important;
  font-size:9px !important;
  vertical-align:middle !important;
}
.v82-drill-table th{
  position:sticky !important;
  top:0 !important;
  z-index:2 !important;
  background:#edf4f8 !important;
  color:#31516a !important;
  font-weight:950 !important;
  text-align:center !important;
}
.v82-rank,.v82-audits,.v82-score,.v82-status{text-align:center !important}
.v82-agent{text-align:left !important;font-weight:800 !important;color:#29485f !important}
.v82-score{font-weight:950 !important;color:#173f5f !important}
.v82-status-pill{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-width:70px;
  max-width:92px;
  min-height:21px;
  padding:2px 6px;
  border-radius:999px;
  font-size:7.5px;
  font-weight:950;
  white-space:nowrap;
}
.v82-status-pill.good{background:#eaf8ef;color:#0b6b36;border:1px solid #8bd0a6}
.v82-status-pill.watch{background:#fff7df;color:#8a5b00;border:1px solid #e9cf81}
.v82-status-pill.action,.v82-status-pill.bad{background:#fff0ef;color:#a5221b;border:1px solid #efa39d}
.v82-status-pill.neutral{background:#f1f5f8;color:#60758a;border:1px solid #d3dee7}
@media(max-width:1050px){
  .v82-drill-grid{grid-template-columns:1fr !important;overflow:auto !important}
  .v82-kpi-modal{height:auto !important;max-height:86vh !important}
}


/* ==========================================================
   V83 — Global duplicate page-heading cleanup
   Global sticky topbar is the single page identity.
   ========================================================== */

/* Action-only heading keeps functional controls without repeating title/subtitle. */
.section-heading-actions-only{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  min-height:0 !important;
  margin:0 0 10px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}

/* Audit Records: Export remains functional but no duplicate heading row. */
.audit-records-filter-panel{
  position:relative;
}

.audit-records-filter-topline{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:start;
  gap:12px;
}

.audit-records-filter-topline #auditListFilters{
  min-width:0;
}

.audit-records-export-button{
  align-self:start;
  min-width:118px;
  white-space:nowrap;
  margin-top:0;
}

/* With duplicate headings removed, content begins cleanly below the global header. */
.app-view > .filter-panel:first-child,
.app-view > .two-column-grid:first-child,
.app-view > .tab-bar:first-child,
.app-view > [id$="Root"]:first-child{
  margin-top:0 !important;
}

@media (max-width:900px){
  .audit-records-filter-topline{
    grid-template-columns:1fr;
  }
  .audit-records-export-button{
    justify-self:end;
  }
}


/* ==========================================================
   V84 — KPI drill-down hard fix
   Fixed five-column CSS grid; no legacy table width conflict.
   ========================================================== */

.v84-kpi-modal{
  width:min(1180px,92vw) !important;
  max-width:1180px !important;
  max-height:78vh !important;
  overflow:hidden !important;
  border-radius:14px !important;
}

.v84-note{
  flex:0 0 auto;
  padding:7px 11px;
  border-bottom:1px solid #d5e1e9;
  background:#f7fafc;
  color:#526d80;
  font-size:8.5px;
  font-weight:850;
}

.v84-panels{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
  padding:9px;
  min-height:0;
  overflow:hidden;
}

.v84-type-panel{
  min-width:0;
  max-height:59vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid #bfd0dc;
  border-radius:10px;
  background:#fff;
}

.v84-type-head{
  flex:0 0 36px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:0 9px;
  background:#edf4f8;
  border-bottom:1px solid #c6d5df;
}

.v84-bau .v84-type-head{border-top:4px solid #15915a}
.v84-hygiene .v84-type-head{border-top:4px solid #d45b46}
.v84-ojt .v84-type-head{border-top:4px solid #6256b5}

.v84-type-head strong{
  color:#173f5d;
  font-size:10px;
  font-weight:950;
}

.v84-type-head span{
  color:#667d90;
  font-size:8px;
  font-weight:850;
}

.v84-grid-head,
.v84-grid-row{
  display:grid;
  grid-template-columns:28px minmax(95px,1.55fr) 50px 72px 86px;
  align-items:center;
}

.v84-grid-head{
  flex:0 0 31px;
  background:#e8f1f7;
  color:#31516a;
  border-bottom:1px solid #b9cbd8;
  font-size:8px;
  font-weight:950;
  text-transform:uppercase;
}

.v84-grid-head>div,
.v84-grid-row>div{
  min-width:0;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:5px 5px;
  border-right:1px solid #cad8e2;
}

.v84-grid-head>div:last-child,
.v84-grid-row>div:last-child{
  border-right:0;
}

.v84-grid-head>div:nth-child(2),
.v84-c-agent{
  justify-content:flex-start !important;
}

.v84-grid-body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  scrollbar-width:thin;
}

.v84-grid-row{
  min-height:32px;
  border-bottom:1px solid #d3dfe7;
  color:#29485f;
  font-size:8.6px;
  background:#fff;
}

.v84-grid-row:nth-child(even){
  background:#fbfdfe;
}

.v84-grid-row:hover{
  background:#eef7fb;
}

.v84-c-rank,
.v84-c-audits{
  text-align:center;
}

.v84-c-agent{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:850;
}

.v84-c-score{
  color:#173f5f;
  font-weight:950;
}

.v84-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:78px;
  min-height:19px;
  padding:2px 5px;
  border-radius:999px;
  font-size:7px;
  font-weight:950;
  white-space:nowrap;
}

.v84-status.good{
  background:#eaf8ef;
  color:#0b6b36;
  border:1px solid #8bd0a6;
}
.v84-status.watch{
  background:#fff7df;
  color:#8a5b00;
  border:1px solid #e9cf81;
}
.v84-status.action,
.v84-status.bad{
  background:#fff0ef;
  color:#a5221b;
  border:1px solid #efa39d;
}
.v84-status.neutral{
  background:#f1f5f8;
  color:#60758a;
  border:1px solid #d3dee7;
}

.v84-empty{
  min-height:72px;
  display:grid;
  place-items:center;
  color:#8195a5;
  font-size:8.5px;
  font-weight:800;
  background:#fbfdfe;
}

@media(max-width:980px){
  .v84-kpi-modal{
    width:95vw !important;
    max-height:86vh !important;
    overflow:auto !important;
  }
  .v84-panels{
    grid-template-columns:1fr !important;
    overflow:visible !important;
  }
  .v84-type-panel{
    max-height:300px;
  }
}


/* ==========================================================
   V86 — Dashboard Custom Date Range
   ========================================================== */
.v86-custom-range{
  grid-column:1/-1;
  display:flex;
  align-items:end;
  gap:9px;
  flex-wrap:wrap;
  padding:9px 10px;
  border:1px solid #c8d9e5;
  border-radius:10px;
  background:linear-gradient(180deg,#f8fbfd,#f2f8fb);
}
.v86-custom-range .pulse-filter{
  min-width:170px;
  flex:0 0 190px;
}
.v86-custom-range input[type="date"]{
  width:100%;
  min-height:34px;
  padding:0 9px;
  border:1.5px solid #8fb4d0;
  border-radius:8px;
  background:#fff;
  color:#183a54;
  font-size:10px;
  font-weight:800;
}
.v86-range-btn{
  min-height:34px;
  padding:0 12px;
  border:1px solid #b9cad6;
  border-radius:8px;
  background:#fff;
  color:#38566d;
  font-size:9px;
  font-weight:900;
  cursor:pointer;
}
.v86-range-btn.primary{
  border-color:#167d9b;
  background:#167d9b;
  color:#fff;
}
.v86-range-active{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 10px;
  border-radius:8px;
  background:#e9f7ef;
  border:1px solid #a3d7b8;
  color:#116a3b;
  font-size:8.5px;
  font-weight:900;
}


/* ==========================================================
   V95 — Core six-month Digitide vs SBI paired summary
   ========================================================== */
.v95-sixmonth-compare{
  margin:14px 0 16px;
  border:1px solid #b8cddd;
  border-radius:13px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 5px 16px rgba(17,64,92,.055);
}
.v95-sixmonth-title{
  min-height:52px;
  padding:10px 13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  background:linear-gradient(90deg,#123f68,#0f718b);
  color:#fff;
}
.v95-sixmonth-title span{
  display:block;
  font-size:9px;
  font-weight:850;
  letter-spacing:.45px;
  opacity:.86;
}
.v95-sixmonth-title strong{
  display:block;
  margin-top:3px;
  font-size:12px;
  font-weight:950;
}
.v95-sixmonth-title small{
  font-size:8px;
  font-weight:850;
  opacity:.86;
  white-space:nowrap;
}
.v95-table-wrap{overflow-x:auto;background:#fff;}
.v95-compare-table{
  width:100%;
  min-width:1500px;
  border-collapse:collapse;
  table-layout:fixed;
  background:#fff;
}
.v95-compare-table th,
.v95-compare-table td{
  border:1px solid #b9cbd8;
  padding:7px 5px;
  text-align:center;
  vertical-align:middle;
  font-size:8.5px;
  font-weight:850;
  white-space:nowrap;
}
.v95-status-head{
  width:130px;
  background:#123f68 !important;
  color:#fff !important;
  font-size:9px !important;
  font-weight:950 !important;
}
.v95-period-head th{
  color:#fff;
  font-size:8.5px;
  font-weight:950;
}
.v95-month-group{background:#0d8db5 !important;}
.v95-week-group{background:#5b46bd !important;}
.v95-week-group.current{
  background:#3f2aa7 !important;
  box-shadow:inset 0 -3px 0 #ffd45c;
}
.v95-wow-group{background:#0f7c56 !important;}
.v95-source-head th{
  padding:5px 3px;
  font-size:7.5px;
  font-weight:950;
}
.v95-sub-qa{
  background:#e7f7f8 !important;
  color:#086c7a !important;
  border-right:2px solid #6d8092 !important;
}
.v95-sub-sbi{
  background:#f1eafd !important;
  color:#6336a6 !important;
}
.v95-metric-name{
  position:sticky;
  left:0;
  z-index:2;
  background:#eef4f8 !important;
  color:#173e5b !important;
  text-align:left !important;
  padding-left:10px !important;
  font-size:9px !important;
  font-weight:950 !important;
  border-right:2px solid #8ca6b8 !important;
}
.v95-source-cell{
  font-size:8.5px !important;
  font-weight:950 !important;
}
.v95-qa-cell{
  background:#f4fbfc;
  color:#086c7a;
  border-right:2px solid #6d8092 !important;
}
.v95-sbi-cell{
  background:#fbf8ff;
  color:#6537a6;
}
.v95-good{color:#0b743d !important;background:#eef9f2 !important;}
.v95-warn{color:#976000 !important;background:#fff8e8 !important;}
.v95-bad{color:#b4231a !important;background:#fff1ef !important;}
.v95-neutral{color:#39566d !important;}
.v95-wow-cell{background:#f6fbf8;font-weight:950 !important;}
.v95-guide{
  padding:7px 11px;
  border-top:1px solid #ccd9e3;
  background:#f7fafc;
  color:#526b7d;
  font-size:7.7px;
  font-weight:800;
}


/* ==========================================================
   V96 — Paired summary placement + fit-to-screen refinement
   ========================================================== */
.v95-sixmonth-compare{
  margin-top:12px !important;
  margin-bottom:16px !important;
}
.v95-table-wrap{
  overflow-x:auto;
}
.v95-compare-table{
  min-width:1120px !important;
  width:100% !important;
  table-layout:fixed !important;
}
.v95-status-head{
  width:86px !important;
  min-width:86px !important;
  max-width:86px !important;
}
.v95-metric-name{
  width:86px !important;
  min-width:86px !important;
  max-width:86px !important;
  padding-left:6px !important;
  padding-right:3px !important;
  font-size:7.8px !important;
  white-space:normal !important;
  line-height:1.15 !important;
}
.v95-compare-table th,
.v95-compare-table td{
  padding:5px 2px !important;
  font-size:7.6px !important;
}
.v95-period-head th{
  font-size:7.6px !important;
  padding:5px 1px !important;
}
.v95-source-head th{
  font-size:6.8px !important;
  padding:4px 1px !important;
}
.v95-source-cell{
  font-size:7.5px !important;
  padding-left:1px !important;
  padding-right:1px !important;
}
.v95-sixmonth-title{
  min-height:46px !important;
  padding:8px 10px !important;
}
.v95-sixmonth-title strong{
  font-size:10px !important;
}
.v95-sixmonth-title span{
  font-size:7.8px !important;
}
.v95-sixmonth-title small{
  font-size:6.9px !important;
}
@media (min-width:1280px){
  .v95-table-wrap{overflow-x:hidden !important;}
}


/* ==========================================================
   V99 — OFFICE HIGH VISIBILITY / HIGH CONTRAST MODE
   Based on stable V97. Styling only; no business logic change.
   ========================================================== */

/* LEFT NAV: true black base + bright text for low-contrast office monitors */
.app-sidebar,
.sidebar,
aside.sidebar,
#sidebar,
[data-sidebar],
.cat-sidebar {
  background: #05070a !important;
  color: #ffffff !important;
  border-right: 1px solid #1e293b !important;
}

.app-sidebar *,
.sidebar *,
aside.sidebar *,
#sidebar *,
[data-sidebar] *,
.cat-sidebar * {
  text-shadow: none !important;
}

.app-sidebar .nav-item,
.sidebar .nav-item,
aside.sidebar .nav-item,
#sidebar .nav-item,
[data-sidebar] .nav-item,
.cat-sidebar .nav-item {
  color: #ffffff !important;
}

.app-sidebar .nav-item .title,
.app-sidebar .nav-item .label,
.app-sidebar .nav-item span,
.sidebar .nav-item .title,
.sidebar .nav-item .label,
.sidebar .nav-item span,
aside.sidebar .nav-item span,
#sidebar .nav-item span {
  color: #ffffff !important;
  font-weight: 800 !important;
}

.app-sidebar .nav-item small,
.sidebar .nav-item small,
aside.sidebar .nav-item small,
#sidebar .nav-item small,
[data-sidebar] small,
.cat-sidebar small {
  color: #d5dde8 !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}

.app-sidebar .nav-group-title,
.sidebar .nav-group-title,
aside.sidebar .nav-group-title,
#sidebar .nav-group-title,
[data-sidebar] .nav-group-title,
.cat-sidebar .nav-group-title {
  color: #aebdce !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
}

/* inactive item hover */
.app-sidebar .nav-item:hover,
.sidebar .nav-item:hover,
aside.sidebar .nav-item:hover,
#sidebar .nav-item:hover {
  background: #111827 !important;
  color: #ffffff !important;
}

/* active navigation item: stronger contrast and brighter label */
.app-sidebar .nav-item.active,
.sidebar .nav-item.active,
aside.sidebar .nav-item.active,
#sidebar .nav-item.active,
[data-sidebar] .nav-item.active,
.cat-sidebar .nav-item.active {
  background: linear-gradient(135deg,#1557d9,#177ddc) !important;
  border-color: #59a7ff !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 8px 18px rgba(21,87,217,.32) !important;
}

.app-sidebar .nav-item.active *,
.sidebar .nav-item.active *,
aside.sidebar .nav-item.active *,
#sidebar .nav-item.active * {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* Sidebar footer */
.app-sidebar .offline-ready,
.sidebar .offline-ready,
#sidebar .offline-ready,
.cat-sidebar .offline-ready {
  color: #0b5a30 !important;
  font-weight: 900 !important;
}

/* GLOBAL CONTENT TEXT: avoid light grey / hazy look */
main,
.main-content,
.content,
.page-content,
.dashboard-shell {
  color: #12263a !important;
}

main label,
.main-content label,
.content label,
.page-content label {
  color: #20394f !important;
  font-weight: 850 !important;
}

main small,
.main-content small,
.content small,
.page-content small {
  color: #536b7d;
  font-weight: 700;
}

/* Inputs and dropdowns — darker readable text */
input,
select,
textarea {
  color: #12263a !important;
  font-weight: 750 !important;
}

input::placeholder,
textarea::placeholder {
  color: #66788a !important;
  opacity: 1 !important;
}

/* Table readability on lower quality monitors */
table th {
  color: #173d5a !important;
  font-weight: 900 !important;
}

table td {
  color: #1d3448;
  font-weight: 700;
}

/* Dashboard hero text */
.quality-performance-pulse,
.pulse-hero,
.dashboard-hero,
[class*="pulse-hero"] {
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

.quality-performance-pulse h1,
.quality-performance-pulse h2,
.pulse-hero h1,
.pulse-hero h2,
.dashboard-hero h1,
.dashboard-hero h2 {
  color: #ffffff !important;
  font-weight: 950 !important;
  letter-spacing: .01em !important;
}

/* Avoid washed-out text in cards */
.card,
.panel,
.metric-card,
.kpi-card,
.pulse-card,
[class*="card"] {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.card-title,
.panel-title,
.metric-card .label,
.kpi-card .label,
.pulse-card .label {
  color: #173d5a;
  font-weight: 900;
}

/* Slightly stronger borders throughout important controls */
input,
select,
textarea,
.card,
.panel,
table,
th,
td {
  border-color: #b5c6d5;
}

/* Keep performance-value colors, but strengthen text */
.good,
.success,
.text-good,
.text-success,
[class*="good"] strong {
  font-weight: 900 !important;
}
.warn,
.warning,
.text-warn,
.text-warning,
[class*="warn"] strong {
  font-weight: 900 !important;
}
.bad,
.danger,
.text-bad,
.text-danger,
[class*="bad"] strong {
  font-weight: 900 !important;
}

/* Windows/office monitor font rendering */
html, body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

@media (min-width: 1200px) {
  body { font-weight: 500; }
}


/* ==========================================================
   V102 — GLOBAL SOBER BRAND HEADER
   Applies to every section through the shared dynamic topbar.
   Existing header height is preserved.
   ========================================================== */
.cat-dynamic-topbar{
  min-height:74px !important;
  padding-top:9px !important;
  padding-bottom:9px !important;
  background:
    radial-gradient(circle at 50% -30%, rgba(255,255,255,.96) 0%, rgba(255,255,255,.60) 34%, transparent 60%),
    linear-gradient(100deg,#eaf2f7 0%,#f5f8fb 46%,#e8f3f5 100%) !important;
  border-top:1px solid #edf4f8 !important;
  border-bottom:1px solid #b8ccd9 !important;
  box-shadow:
    0 4px 14px rgba(15,52,78,.08),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
}

.cat-center-brand{
  min-width:250px;
  padding:3px 14px;
  border:1px solid rgba(164,188,204,.55);
  border-radius:14px;
  background:rgba(255,255,255,.52);
  box-shadow:
    0 3px 10px rgba(23,65,92,.055),
    inset 0 1px 0 rgba(255,255,255,.90);
  backdrop-filter:blur(2px);
}

.cat-center-brand img{
  filter:none !important;
  opacity:1 !important;
}

.cat-dynamic-topbar h2{
  color:#102f47 !important;
  font-weight:950 !important;
}
.cat-dynamic-topbar p{
  color:#3f5f75 !important;
  font-weight:800 !important;
}
.cat-route-kicker{
  color:#49677c !important;
  font-weight:950 !important;
}

.cat-route-icon{
  background:linear-gradient(145deg,#ffffff,#deedf4) !important;
  border-color:#aac6d7 !important;
  box-shadow:
    0 3px 9px rgba(30,75,105,.08),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
}

.cat-user-card{
  background:rgba(255,255,255,.76) !important;
  border-color:#bfd0dc !important;
  box-shadow:0 3px 9px rgba(25,65,90,.055) !important;
}
.cat-logout-button{
  background:rgba(255,255,255,.66) !important;
  border-color:#bfd0dc !important;
}

.cat-dynamic-topbar::after{
  height:3px !important;
  opacity:.82 !important;
}

@media (max-width:1150px){
  .cat-center-brand{
    min-width:180px;
    padding-left:10px;
    padding-right:10px;
  }
}
@media (max-width:820px){
  .cat-center-brand{
    min-width:136px;
    padding-left:7px;
    padding-right:7px;
    border-radius:10px;
  }
}

/* V108 — main menu is hidden until the hamburger is clicked */
#sidebar{transform:translateX(-100%)!important;visibility:hidden;transition:transform .2s ease,visibility .2s;z-index:110!important}
#sidebar.open{transform:translateX(0)!important;visibility:visible}
#appShell .main-area{width:100%!important;margin-left:0!important}
#menuToggle{display:inline-flex!important;align-items:center;justify-content:center;font-size:26px!important;position:relative;z-index:111}
@media print{#sidebar,#menuToggle,.cdr-menu-toolbar,#askCdrTab,#askCdrDrawer{display:none!important}}
/* Keep the menu button reachable while the overlay is open. */
#appShell .topbar{z-index:120!important}
#sidebar{top:84px!important}

/* Universal High-Contrast Excel Gridlines across all tables */
.vi-excel-table,
table.vi-excel-table,
.vi-comp-table,
table.vi-comp-table {
  border-collapse: collapse !important;
  border: 2px solid #475569 !important;
  width: 100% !important;
  background: #ffffff !important;
}
.vi-excel-table th,
table.vi-excel-table th,
.vi-comp-table th,
table.vi-comp-table th {
  border: 1px solid #64748b !important;
  background: #e2e8f0 !important;
  color: #0f172a !important;
  font-weight: 800 !important;
  font-size: 11.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
  padding: 7px 9px !important;
  white-space: nowrap !important;
  text-align: left;
}
.vi-excel-table td,
table.vi-excel-table td,
.vi-comp-table td,
table.vi-comp-table td {
  border: 1px solid #94a3b8 !important;
  padding: 6px 9px !important;
  font-size: 12px !important;
  color: #0f172a !important;
  background: #ffffff;
  white-space: nowrap !important;
}
.vi-excel-table tr:nth-child(even) td,
table.vi-excel-table tr:nth-child(even) td {
  background: #f8fafc !important;
}
.vi-excel-table tr:hover td,
table.vi-excel-table tr:hover td {
  background: #dbeafe !important;
}
.vi-excel-table tr.row-mtd td,
table.vi-excel-table tr.row-mtd td {
  background: #e0f2fe !important;
  font-weight: 800 !important;
  border-top: 2px solid #0284c7 !important;
  border-bottom: 2px solid #0284c7 !important;
  color: #0369a1 !important;
}
.vi-excel-table tfoot td,
table.vi-excel-table tfoot td {
  border: 1px solid #334155 !important;
  background: #0f172a !important;
  color: #ffffff !important;
  font-weight: 800 !important;
  padding: 8px 10px !important;
}

/* Incident tables: wrapped cells with automatic row height, including status badges. */
#vendorInvoiceRoot .vi-incident-table-wrap{width:100%;max-width:100%;margin:12px 0;overflow-x:auto}
#vendorInvoiceRoot table.vi-incident-table{table-layout:fixed!important;width:100%!important;min-width:0!important;border-collapse:collapse!important}
#vendorInvoiceRoot .vi-incident-table th,#vendorInvoiceRoot .vi-incident-table td,#vendorInvoiceRoot .vi-incident-summary th,#vendorInvoiceRoot .vi-incident-summary td{white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;height:auto!important;max-height:none!important;line-height:1.45!important;vertical-align:top!important;box-sizing:border-box;padding:8px 6px!important}
#vendorInvoiceRoot .vi-incident-table tr{height:auto!important;max-height:none!important}
#vendorInvoiceRoot .vi-incident-table td span{display:inline-block;max-width:100%;white-space:normal!important;overflow-wrap:anywhere!important;box-sizing:border-box}
#vendorInvoiceRoot .vi-incident-summary{max-width:680px;table-layout:fixed!important}
#vendorInvoiceRoot .vi-date-warning{padding:10px 14px;background:#fff7e6;color:#754a10;border:1px solid #eed39f;border-radius:8px;font-size:13px;line-height:1.5}

/* QA fields share a layout even while asynchronous master data loads. */
#cat-qa-form .cat-form-field {display:flex;flex-direction:column;gap:7px;min-width:0;}
#cat-qa-form .cat-form-field label {display:block;font-weight:700;color:#344054;}
#cat-qa-form .cat-form-field input,
#cat-qa-form .cat-form-field select,
#cat-qa-form .cat-form-field textarea {box-sizing:border-box;width:100%;min-width:0;min-height:40px;padding:10px 12px;border:1px solid #cbd5e1;border-radius:8px;font:inherit;font-size:14px;background:#fff;color:#253247;}
#cat-qa-form .cat-form-field input[readonly] {background:#f1f5f9;}
#cat-qa-form .cat-form-field textarea {min-height:90px;resize:vertical;}