/* Final surface layer: loaded after legacy and feature styles. */
.page-shell {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

.card,
.metric-card,
.summary-card,
.category-compact-card,
.strategy-tabs,
.approval-offer-card,
.channel-item-card,
.channel-empty,
.ranking-offer-card,
.advanced-fields,
.category-picker,
.storefront-logo-upload {
  border-color: var(--surface-border) !important;
  box-shadow: var(--surface-shadow) !important;
}

.card.dashboard-sales-card {
  border: 0 !important;
  background: linear-gradient(135deg, #ff6900 0%, #ff8430 56%, #ff9f46 100%) !important;
  box-shadow: 0 18px 38px rgba(232, 102, 10, .24) !important;
}

.card.dashboard-sales-card > p,
.card.dashboard-sales-card small,
.card.dashboard-sales-card b,
.card.dashboard-sales-card > strong {
  color: #fff !important;
}

.card.dashboard-metric-card.orange {
  background: linear-gradient(145deg, #fff 4%, var(--app-orange-card) 68%, var(--app-orange-card-strong) 100%) !important;
}

.card.dashboard-metric-card.purple {
  background: linear-gradient(145deg, #fff 4%, var(--app-purple-card) 68%, var(--app-purple-card-strong) 100%) !important;
}

@media (min-width: 1181px) {
  .dashboard-summary-grid {
    grid-template-columns: 1.5fr 1.5fr repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 821px) and (max-width: 1180px) {
  .dashboard-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dashboard-sales-card {
    grid-column: 1 / -1;
    grid-row: auto;
  }
}

/* Nexly application design system
   This file is the final cascade layer for every authenticated page. */
:root {
  --app-ink: #241d3b;
  --app-muted: #6e7184;
  --app-line: #ded9e8;
  --app-line-strong: #ccc3df;
  --app-purple: #4c369f;
  --app-purple-soft: #f5f1ff;
  --app-purple-card: #ddd0ff;
  --app-purple-card-strong: #cbb7ff;
  --app-purple-border: #7654ce;
  --app-orange: #ff7900;
  --app-orange-soft: #fff6ec;
  --app-orange-card: #ffdfb9;
  --app-orange-card-strong: #ffc887;
  --app-orange-border: #d97216;
  --app-green: #08664f;
  --app-surface: #ffffff;
  --app-radius: 20px;
  --app-shadow: 0 10px 28px rgba(46, 35, 84, .08);
  --app-shadow-hover: 0 15px 34px rgba(46, 35, 84, .13);
}

.page-shell {
  color: var(--app-ink);
}

.page-head {
  margin-bottom: 24px;
}

.page-head h1 {
  color: var(--app-ink) !important;
  font-weight: 850;
}

.page-head p,
.card-head p,
.store-section-head p {
  color: var(--app-muted) !important;
}

.card,
.metric-card,
.summary-card,
.category-compact-card,
.strategy-tabs,
.approval-offer-card,
.channel-item-card,
.channel-empty,
.ranking-offer-card,
.advanced-fields,
.category-picker,
.storefront-logo-upload,
.storefront-background-upload,
.selected-store-card,
.quick-action,
.insight,
.group-setting,
.highlight-row,
.choice-pill {
  border: 1px solid var(--app-line) !important;
  border-radius: var(--app-radius) !important;
  box-shadow: var(--app-shadow) !important;
}

.card,
.metric-card,
.summary-card,
.approval-offer-card,
.channel-item-card,
.channel-empty,
.advanced-fields,
.category-picker {
  background: var(--app-surface) !important;
}

.card:hover,
.metric-card:hover,
.summary-card:hover,
.category-compact-card:hover,
.approval-offer-card:hover,
.channel-item-card:hover,
.ranking-offer-card:hover,
.quick-action:hover {
  box-shadow: var(--app-shadow-hover) !important;
}

.card-head {
  padding-bottom: 2px;
}

.card-head h2,
.store-section-head h2 {
  color: var(--app-ink) !important;
  font-weight: 850 !important;
}

.section-eyebrow {
  color: var(--app-purple) !important;
}

/* KPI and summary cards share the same complete outline. */
.kpi-grid > .kpi,
.balance-grid > .balance-card,
.store-grid .store-card {
  border: 1.5px solid var(--app-line) !important;
  border-top-width: 1.5px !important;
  border-top-color: var(--app-line) !important;
  min-height: 126px;
  position: relative;
  isolation: isolate;
}

.page-shell .kpi-grid > .kpi:nth-child(n),
.page-shell .balance-grid > .balance-card:nth-child(n),
.page-shell .store-grid .store-card:nth-child(n) {
  border: 1.5px solid var(--app-line) !important;
  border-top: 1.5px solid var(--app-line) !important;
  box-shadow: 0 6px 18px rgba(46, 35, 84, .06) !important;
}

.kpi-grid > .kpi::after,
.balance-grid > .balance-card::after,
.media-report-kpis > div::after,
.report-detail-grid > div::after {
  background: currentColor;
  border-radius: 999px;
  content: "";
  height: 78px;
  opacity: .055;
  position: absolute;
  right: -25px;
  top: -30px;
  width: 78px;
  z-index: -1;
}

.kpi-grid > .kpi:nth-child(odd),
.balance-grid > .balance-card:nth-child(odd),
.media-report-kpis > div:nth-child(odd),
.report-detail-grid > div:nth-child(odd) {
  background: linear-gradient(145deg, #f5f1ff 0%, var(--app-purple-card) 58%, var(--app-purple-card-strong) 100%) !important;
  border-color: var(--app-purple-border) !important;
  color: var(--app-purple);
}

.kpi-grid > .kpi:nth-child(even),
.balance-grid > .balance-card:nth-child(even),
.media-report-kpis > div:nth-child(even),
.report-detail-grid > div:nth-child(even) {
  background: linear-gradient(145deg, #fff1df 0%, var(--app-orange-card) 58%, var(--app-orange-card-strong) 100%) !important;
  border-color: var(--app-orange-border) !important;
  color: var(--app-orange);
}

.kpi-label,
.balance-card > span,
.metric-card > span,
.summary-card > span {
  color: #4a405f !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  line-height: 1.25 !important;
}

.kpi-grid > .kpi:nth-child(odd) .kpi-label,
.balance-grid > .balance-card:nth-child(odd) > span,
.media-report-kpis > div:nth-child(odd) > span,
.report-detail-grid > div:nth-child(odd) .kpi-label {
  color: #3f278f !important;
}

.kpi-grid > .kpi:nth-child(even) .kpi-label,
.balance-grid > .balance-card:nth-child(even) > span,
.media-report-kpis > div:nth-child(even) > span,
.report-detail-grid > div:nth-child(even) .kpi-label {
  color: #a94700 !important;
}

.kpi-value,
.balance-card b,
.metric-card strong,
.summary-card strong {
  color: var(--app-ink) !important;
  font-weight: 850 !important;
}

.kpi-label i {
  background: #f0ebff !important;
  color: var(--app-purple) !important;
}

.trend,
.trend.neutral {
  color: var(--app-green) !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
}

.trend.down {
  color: #c84863 !important;
}

/* Tabs and filters use purple; primary actions keep the Nexly orange. */
.strategy-tabs {
  background: rgba(255, 255, 255, .96) !important;
  gap: 8px;
  padding: 10px !important;
}

.period-select {
  background: #fff !important;
  border: 1px solid var(--app-line-strong) !important;
  border-radius: 14px !important;
  box-shadow: 0 5px 16px rgba(46, 35, 84, .06) !important;
}

.strategy-tabs .button,
.period-button {
  border-radius: 11px !important;
  box-shadow: none !important;
}

.strategy-tabs .button.primary,
.strategy-tab.active,
.period-button.active {
  background: var(--app-purple) !important;
  border-color: var(--app-purple) !important;
  color: #fff !important;
}

.button.primary,
button.primary {
  background: linear-gradient(135deg, #ff7100, #ff941f) !important;
  border-color: var(--app-orange) !important;
  box-shadow: 0 8px 20px rgba(255, 121, 0, .20) !important;
  color: #fff !important;
}

.button.primary:hover,
button.primary:hover {
  background: linear-gradient(135deg, #ed6900, #ff8610) !important;
  box-shadow: 0 11px 24px rgba(255, 121, 0, .27) !important;
}

.button.soft {
  background: var(--app-purple-soft) !important;
  border-color: #ded5f6 !important;
  color: var(--app-purple) !important;
}

/* Forms have one field language and an accessible focus state. */
.form-row label,
.stack-form label {
  color: #3c354f !important;
  font-size: 12px !important;
  font-weight: 750 !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea,
.storefront-address-input {
  background: #fff !important;
  border: 1px solid #d5cfdf !important;
  border-radius: 12px !important;
  color: var(--app-ink) !important;
  box-shadow: 0 2px 7px rgba(40, 29, 76, .025) !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus,
select:focus,
textarea:focus,
.storefront-address-input:focus-within {
  border-color: #8068cf !important;
  box-shadow: 0 0 0 3px rgba(76, 54, 159, .12) !important;
  outline: 0;
}

.form-row small,
.muted-note {
  color: var(--app-muted) !important;
}

/* Tables sit inside a real surface instead of loose horizontal lines. */
.table-wrap {
  background: #fff;
  border: 1px solid var(--app-line) !important;
  border-radius: 15px !important;
  box-shadow: 0 5px 15px rgba(46, 35, 84, .045);
  overflow: auto;
}

.table-wrap table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}

.table-wrap thead th {
  background: #f6f3fb !important;
  border-bottom: 1px solid var(--app-line) !important;
  color: #5c5670 !important;
  font-size: 11px !important;
  letter-spacing: .03em;
}

.table-wrap tbody td {
  border-bottom: 1px solid #ece9f1 !important;
  color: #352e49 !important;
}

.table-wrap tbody tr:last-child td {
  border-bottom: 0 !important;
}

.table-wrap tbody tr:hover td {
  background: #fcfaff !important;
}

/* Operational cards and marketplace lists. */
.store-grid .store-card {
  background: linear-gradient(145deg, #f5f1ff 0%, var(--app-purple-card) 60%, var(--app-purple-card-strong) 100%) !important;
  border-color: var(--app-purple-border) !important;
  min-height: 190px;
}

.store-grid .store-card:nth-child(even) {
  background: linear-gradient(145deg, #fff1df 0%, var(--app-orange-card) 60%, var(--app-orange-card-strong) 100%) !important;
  border-color: var(--app-orange-border) !important;
}

.store-grid .store-card h3,
.category-compact-main strong,
.channel-item-card h3,
.approval-offer-copy strong,
.ranking-offer-card h3 {
  color: #3f278f !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  line-height: 1.3 !important;
}

.store-grid .store-card:nth-child(even) h3,
.category-compact-card:nth-child(even) .category-compact-main strong,
.channel-item-card:nth-child(even) h3,
.approval-offer-card:nth-child(even) .approval-offer-copy strong,
.ranking-offer-card:nth-child(even) h3 {
  color: #a94700 !important;
}

.store-card .store-logo,
.source-chip .store-logo {
  border: 1px solid var(--app-line) !important;
  box-shadow: 0 6px 16px rgba(46, 35, 84, .08) !important;
}

/* Actions inside marketplace cards must remain readable over colored surfaces. */
.store-grid .store-card .store-actions .store-action-link {
  background: var(--app-purple) !important;
  border: 1px solid var(--app-purple) !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  opacity: 1 !important;
}

.store-grid .store-card:nth-child(even) .store-actions .store-action-link {
  background: #c95a00 !important;
  border-color: #c95a00 !important;
}

.store-grid .store-card .store-actions button {
  background: rgba(255, 255, 255, .9) !important;
  border: 1px solid #8068cf !important;
  color: #372478 !important;
  font-size: 10px !important;
  font-weight: 850 !important;
}

.store-grid .store-card:nth-child(even) .store-actions button {
  border-color: #d87821 !important;
  color: #8f3d00 !important;
}

.ranking-offer-card,
.approval-offer-card,
.channel-item-card,
.category-compact-card,
.quick-action,
.insight,
.selected-store-card {
  background: linear-gradient(145deg, #f5f1ff 0%, var(--app-purple-card) 62%, var(--app-purple-card-strong) 100%) !important;
  border: 1.5px solid var(--app-purple-border) !important;
  box-shadow: 0 6px 18px rgba(46, 35, 84, .06) !important;
}

.ranking-offer-card:nth-child(even),
.approval-offer-card:nth-child(even),
.channel-item-card:nth-child(even),
.category-compact-card:nth-child(even) {
  background: linear-gradient(145deg, #fff1df 0%, var(--app-orange-card) 62%, var(--app-orange-card-strong) 100%) !important;
  border-color: var(--app-orange-border) !important;
}

.ranking-signals span {
  background: #f1ecff !important;
  color: var(--app-purple) !important;
}

.channel-empty {
  color: var(--app-muted) !important;
}

.stat-row {
  border-bottom-color: #ebe7f0 !important;
}

.stat-row strong,
.stat-row b {
  color: var(--app-ink) !important;
}

.insight-icon {
  background: linear-gradient(145deg, var(--app-orange), #ff9d32) !important;
  box-shadow: 0 7px 18px rgba(255, 121, 0, .20) !important;
  color: #fff !important;
}

.tag.purple {
  background: #f0ebff !important;
  border-color: #cfc1f6 !important;
  color: var(--app-purple) !important;
}

.tag.success {
  background: #d8f2e8 !important;
  border-color: #78c9af !important;
  color: #075c47 !important;
  font-weight: 850 !important;
}

/* Reports and media campaign summaries also use the same mini-card pattern. */
.media-report-kpis > div,
.report-detail-grid > div,
.awin-finance-status > div,
.commission-flow-step,
.funnel-diagnostic,
.connect-step {
  background: linear-gradient(145deg, #f5f1ff 0%, var(--app-purple-card) 62%, var(--app-purple-card-strong) 100%) !important;
  border: 1.5px solid var(--app-purple-border) !important;
  border-radius: 15px !important;
  box-shadow: 0 5px 16px rgba(46, 35, 84, .05) !important;
  position: relative;
}

.media-report-kpis > div:nth-child(even),
.report-detail-grid > div:nth-child(even),
.awin-finance-status > div:nth-child(even),
.commission-flow-step:nth-child(even),
.funnel-diagnostic:nth-child(even),
.connect-step:nth-child(even) {
  background: linear-gradient(145deg, #fff1df 0%, var(--app-orange-card) 62%, var(--app-orange-card-strong) 100%) !important;
  border-color: var(--app-orange-border) !important;
}

/* Legacy marketplace KPI accents created colored bars and uneven shadows. */
.market-kpi .kpi-accent {
  display: none !important;
}

.page-shell .market-kpi {
  border-width: 2px !important;
  box-shadow: 0 6px 18px rgba(46, 35, 84, .06) !important;
}

/* A single, high-contrast card language across every application area. */
.page-shell .kpi-grid > .kpi:nth-child(odd),
.page-shell .balance-grid > .balance-card:nth-child(odd),
.page-shell .instagram-kpis > .instagram-kpi:nth-child(odd),
.page-shell .capacity-grid > .capacity-card:nth-child(odd),
.page-shell .shopee-mode-grid > .shopee-mode-card:nth-child(odd),
.page-shell .operation-health-steps > .operation-health-step:nth-child(odd),
.page-shell .instagram-media-grid > .instagram-media-card:nth-child(odd),
.page-shell .plans-grid > .plan-card:nth-child(odd),
.page-shell .group-settings > .group-setting:nth-child(odd) {
  border: 2px solid var(--app-purple-border) !important;
}

.page-shell .kpi-grid > .kpi:nth-child(even),
.page-shell .balance-grid > .balance-card:nth-child(even),
.page-shell .instagram-kpis > .instagram-kpi:nth-child(even),
.page-shell .capacity-grid > .capacity-card:nth-child(even),
.page-shell .shopee-mode-grid > .shopee-mode-card:nth-child(even),
.page-shell .operation-health-steps > .operation-health-step:nth-child(even),
.page-shell .instagram-media-grid > .instagram-media-card:nth-child(even),
.page-shell .plans-grid > .plan-card:nth-child(even),
.page-shell .group-settings > .group-setting:nth-child(even) {
  border: 2px solid var(--app-orange-border) !important;
}

.page-shell .ranking-offer-card,
.page-shell .approval-offer-card,
.page-shell .channel-item-card,
.page-shell .category-compact-card,
.page-shell .quick-action,
.page-shell .insight,
.page-shell .selected-store-card,
.page-shell .media-report-kpis > div,
.page-shell .report-detail-grid > div,
.page-shell .awin-finance-status > div,
.page-shell .commission-flow-step,
.page-shell .funnel-diagnostic,
.page-shell .connect-step {
  border-width: 2px !important;
}

.page-shell .dashboard-metric-card.purple {
  border: 2px solid var(--app-purple-border) !important;
}

.page-shell .dashboard-metric-card.orange {
  border: 2px solid var(--app-orange-border) !important;
}

.page-shell .plan-card.popular,
.page-shell .group-setting:has(input:checked) {
  border-color: var(--app-orange-border) !important;
}

/* Main labels are intentionally larger than supporting copy. */
.page-shell .kpi-label,
.page-shell .market-kpi .kpi-label > span,
.page-shell .balance-card > span,
.page-shell .media-report-kpis > div > span,
.page-shell .report-detail-grid .kpi-label,
.page-shell .instagram-kpi small,
.page-shell .dashboard-metric-head > span {
  color: #3f278f !important;
  font-size: 16px !important;
  font-weight: 850 !important;
  letter-spacing: -.01em !important;
  line-height: 1.25 !important;
  text-transform: none !important;
}

.page-shell .kpi-grid > .kpi:nth-child(even) .kpi-label,
.page-shell .kpi-grid > .kpi:nth-child(even) .kpi-label > span,
.page-shell .balance-grid > .balance-card:nth-child(even) > span,
.page-shell .media-report-kpis > div:nth-child(even) > span,
.page-shell .report-detail-grid > div:nth-child(even) .kpi-label,
.page-shell .instagram-kpis > .instagram-kpi:nth-child(even) small {
  color: #974000 !important;
}

.page-shell .store-card h3,
.page-shell .category-compact-main strong,
.page-shell .channel-item-card h3,
.page-shell .approval-offer-copy strong,
.page-shell .ranking-offer-card h3,
.page-shell .shopee-mode-card strong,
.page-shell .capacity-card-head strong,
.page-shell .operation-health-step strong,
.page-shell .instagram-media-card strong,
.page-shell .connect-step strong,
.page-shell .commission-flow-step strong,
.page-shell .funnel-diagnostic strong {
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.3 !important;
}

.media-report-kpis > div > span,
.report-detail-grid .kpi-label,
.awin-finance-status > div > span,
.commission-flow-step strong,
.funnel-diagnostic strong,
.connect-step strong {
  font-size: 14px !important;
  font-weight: 850 !important;
}

/* Instagram journey: solid steps and matching numbered markers. */
.page-shell .instagram-flow-card .connect-steps { gap: 12px; }

.page-shell .instagram-flow-card .connect-step {
  min-height: 82px;
  border-width: 2px !important;
  box-shadow: none !important;
}

.page-shell .instagram-flow-card .connect-step:nth-child(odd) {
  background: linear-gradient(135deg, #e8ddff 0%, #c9b6ff 100%) !important;
  border-color: #6845cf !important;
}

.page-shell .instagram-flow-card .connect-step:nth-child(even) {
  background: linear-gradient(135deg, #ffe4c3 0%, #ffc982 100%) !important;
  border-color: #d66708 !important;
}

.page-shell .instagram-flow-card .connect-step > b {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: #5a35bf !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  box-shadow: 0 6px 14px rgba(77, 45, 164, .22);
}

.page-shell .instagram-flow-card .connect-step:nth-child(even) > b {
  background: #c85600 !important;
  box-shadow: 0 6px 14px rgba(180, 75, 0, .20);
}

.page-shell .instagram-flow-card .connect-step strong {
  color: #24183f !important;
  font-size: 16px !important;
}

.page-shell .instagram-flow-card .connect-step span {
  color: #5c536d !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

/* Product names in Telegram/strategy ranking cards. */
.page-shell .ranking-offer-main > strong {
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal !important;
  text-overflow: unset !important;
  color: #3f278f !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
}

.page-shell .ranking-offer-card:nth-child(even) .ranking-offer-main > strong {
  color: #984000 !important;
}

/* Plans use the same complete outline, solid surface and compact status badge. */
.page-shell .plan-card {
  overflow: visible !important;
  background: linear-gradient(145deg, #f7f2ff 0%, #e4d8ff 100%) !important;
  border-width: 2px !important;
  box-shadow: 0 8px 22px rgba(55, 35, 105, .08) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.page-shell .plan-card:nth-child(even) {
  background: linear-gradient(145deg, #fff4e6 0%, #ffd9a9 100%) !important;
}

.page-shell .plan-card::before {
  display: none !important;
  content: none !important;
}

.page-shell .plan-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 36px rgba(54, 34, 101, .16) !important;
}

.page-shell .plan-card.current {
  box-shadow: 0 14px 32px rgba(79, 49, 158, .16) !important;
}

.page-shell .plan-card-top { padding-right: 70px; }

.page-shell .plan-card-top > .tag.success {
  position: absolute;
  top: 18px;
  right: 18px;
  min-width: auto;
  padding: 7px 11px;
  border-radius: 999px;
  background: #087b5d !important;
  border-color: #087b5d !important;
  color: #fff !important;
  font-size: 10px !important;
  line-height: 1 !important;
  box-shadow: 0 5px 12px rgba(8, 123, 93, .20);
}

.page-shell .plan-card h2 {
  color: #3c248c !important;
  font-size: 25px !important;
  font-weight: 900 !important;
}

.page-shell .plan-card:nth-child(even) h2 { color: #963d00 !important; }
.page-shell .plan-kicker { color: #5b35be !important; }
.page-shell .plan-card:nth-child(even) .plan-kicker { color: #bd4e00 !important; }

@media (max-width: 820px) {
  .page-head {
    align-items: flex-start;
    gap: 16px;
  }

  .strategy-tabs {
    border-radius: 16px !important;
  }

  .card,
  .metric-card,
  .summary-card,
  .strategy-tabs {
    border-radius: 16px !important;
  }
}

/* Navigation architecture: connection hub and ownership notices */
.integration-hub-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.integration-hub-card {
  min-height: 132px;
  padding: 20px;
  display: grid;
  grid-template-columns: 42px 1fr;
  grid-template-rows: auto auto;
  gap: 5px 13px;
  text-align: left;
  border: 2px solid #7552d6;
  border-radius: 20px;
  background: linear-gradient(145deg, #eee8ff, #d8cbff);
  color: #28184f;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease;
}

.integration-hub-card:nth-child(even) {
  border-color: #e56d08;
  background: linear-gradient(145deg, #fff0dd, #ffd29d);
}

.integration-hub-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(55, 31, 101, .14);
}

.integration-hub-card > .material-symbols-rounded {
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  background: rgba(255,255,255,.72);
  color: #5632b6;
}

.integration-hub-card:nth-child(even) > .material-symbols-rounded { color: #b84b00; }
.integration-hub-card strong { align-self: end; font: 800 15px Manrope, sans-serif; }
.integration-hub-card small { color: #615873; font-size: 11px; line-height: 1.4; }

.operational-owner-note,
.plan-scope-note {
  margin-top: 14px;
  display: flex;
  align-items: center;
  gap: 14px;
}

.operational-owner-note > .material-symbols-rounded {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 13px;
  background: #eee8ff;
  color: #5b35be;
}

.operational-owner-note > div,
.plan-scope-note .card-head > div { flex: 1; }
.operational-owner-note p { margin: 3px 0 0; color: var(--muted); }
.settings-account-status { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
.settings-account-status p { margin: 9px 0 0; color: var(--muted); }
.inline-link { padding: 0; border: 0; background: transparent; color: #5632b6; font: inherit; font-weight: 800; cursor: pointer; }

@media (max-width: 980px) {
  .integration-hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .integration-hub-grid { grid-template-columns: 1fr; }
  .operational-owner-note { align-items: flex-start; flex-wrap: wrap; }
}
/* Shared workspace navigation keeps merged areas understandable without
   reintroducing duplicate entries in the sidebar. */
.workspace-navigation {
  margin-bottom: 18px;
  border: 1px solid rgba(92, 52, 169, .22);
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 12px 30px rgba(49, 20, 95, .06);
}

.result-data-status {
  margin-bottom: 14px;
  border-width: 1.5px;
}

.result-data-status.is-measured {
  border-color: rgba(25, 153, 111, .45);
  background: linear-gradient(135deg, rgba(223, 251, 240, .92), rgba(255, 255, 255, .96));
}

.result-data-status.needs-data {
  border-color: rgba(255, 116, 0, .45);
  background: linear-gradient(135deg, rgba(255, 238, 218, .94), rgba(255, 255, 255, .96));
}