:root {
    --pl-bg: #f6f8fb;
    --pl-surface: #ffffff;
    --pl-border: #e7ebf2;
    --pl-text: #111827;
    --pl-muted: #7b8496;
    --pl-primary: #6266f1;
    --pl-teal: #12a3a0;
    --pl-success: #22c55e;
    --pl-danger: #ef476f;
    --pl-warning: #f59e0b;
}

* {
    box-sizing: border-box;
}

html,
body {
    background: var(--pl-bg);
    color: var(--pl-text);
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    margin: 0;
    overflow-x: hidden;
}

img,
svg {
    max-width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

.text-muted {
    color: var(--pl-muted) !important;
}

.positive {
    color: var(--pl-success);
}

.app-shell {
    min-height: 100vh;
    overflow-x: hidden;
}

.main-content {
    background: var(--pl-bg);
    min-height: 100vh;
    overflow-x: hidden;
    padding: 88px 24px 32px !important;
}

.mud-main-content,
.mud-container,
.mud-grid,
.mud-grid-item,
.dashboard-page,
.dashboard-card,
.kpi-card {
    min-width: 0;
}

.signin-page {
    align-items: flex-start;
    background:
        radial-gradient(circle at 12% -18%, rgba(98, 102, 241, .18), transparent 34%),
        radial-gradient(circle at 86% 12%, rgba(18, 163, 160, .13), transparent 30%),
        #263244;
    display: flex;
    justify-content: center;
    min-height: 100vh;
    overflow: hidden;
    padding: 28px 16px 48px;
    position: relative;
}

.signin-hero {
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
}

.signin-topbar {
    align-items: center;
    display: flex;
    height: 80px;
    justify-content: center;
    position: relative;
    z-index: 2;
}

.signin-brand {
    align-items: center;
    color: white;
    display: flex;
    font-size: 1.2rem;
    font-weight: 800;
    gap: 10px;
    letter-spacing: .01em;
}

.signin-brand .brand-mark {
    background: linear-gradient(135deg, #6266f1, #12a3a0);
}

.hero-pattern {
    border: 2px solid rgba(255, 255, 255, .04);
    position: absolute;
}

.pattern-one {
    border-radius: 999px;
    height: 720px;
    left: -180px;
    top: -420px;
    width: 980px;
}

.pattern-two {
    border-left: 36px solid rgba(98, 102, 241, .08);
    border-right: 36px solid rgba(98, 102, 241, .03);
    bottom: -60px;
    height: 220px;
    left: 28%;
    transform: skew(-28deg);
    width: 220px;
}

.signin-card {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, .92);
    border-radius: 14px;
    box-shadow: 0 24px 72px rgba(15, 23, 42, .28);
    max-width: 460px;
    margin-top: 285px;
    padding: 34px 34px 32px;
    position: relative;
    width: calc(100% - 32px);
    z-index: 3;
}

.signin-card .mud-typography-h5 {
    color: #101828;
    font-weight: 800;
}

.signin-muted {
    color: #667085;
    margin-top: 8px;
}

.demo-creds {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #d7deeb;
    border-radius: 8px;
    color: #475467;
    display: flex;
    justify-content: space-between;
    margin-top: 24px;
    padding: 11px 12px;
}

.demo-creds strong {
    color: #101828;
}

.signin-form {
    display: grid;
    gap: 10px;
    margin-top: 22px;
}

.role-fieldset {
    border: 0;
    display: grid;
    gap: 9px;
    margin: 0 0 4px;
    padding: 0;
}

.role-fieldset legend {
    color: #344054;
    font-size: .78rem;
    font-weight: 800;
    margin-bottom: 2px;
}

.role-option {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    cursor: pointer;
    display: grid;
    gap: 11px;
    grid-template-columns: 22px 1fr;
    min-height: 58px;
    padding: 10px 12px;
    transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.role-option:hover {
    background: #ffffff;
    border-color: #cbd5e1;
}

.role-option input {
    height: 1px;
    opacity: 0;
    position: absolute;
    width: 1px;
}

.role-check {
    align-items: center;
    background: white;
    border: 2px solid #cbd5e1;
    border-radius: 6px;
    display: flex;
    height: 22px;
    justify-content: center;
    width: 22px;
}

.role-check::after {
    border-bottom: 2px solid white;
    border-right: 2px solid white;
    content: "";
    height: 9px;
    opacity: 0;
    transform: rotate(45deg) translate(-1px, -1px);
    width: 5px;
}

.role-option strong,
.role-option small {
    display: block;
}

.role-option strong {
    color: #101828;
    font-size: .86rem;
}

.role-option small {
    color: #667085;
    font-size: .72rem;
    line-height: 1.25;
    margin-top: 2px;
}

.role-option:has(input:checked) {
    background: #eef4ff;
    border-color: #6266f1;
    box-shadow: 0 0 0 3px rgba(98, 102, 241, .14);
}

.role-option:has(input:checked) .role-check {
    background: var(--pl-primary);
    border-color: var(--pl-primary);
}

.role-option:has(input:checked) .role-check::after {
    opacity: 1;
}

.role-option:has(input:focus-visible) {
    box-shadow: 0 0 0 3px rgba(98, 102, 241, .16);
}

.field-label {
    color: #344054;
    font-size: .78rem;
    font-weight: 700;
}

.auth-input {
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    color: var(--pl-text);
    font: inherit;
    height: 44px;
    outline: none;
    padding: 0 13px;
    width: 100%;
}

.auth-input:focus {
    border-color: var(--pl-primary);
    box-shadow: 0 0 0 3px rgba(98, 102, 241, .12);
}

.auth-submit {
    background: var(--pl-primary);
    border: 0;
    border-radius: 8px;
    color: white;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    height: 46px;
    margin-top: 8px;
}

.signin-footer-text {
    color: #667085;
    display: block;
    margin-top: 20px;
}

.signin-footer {
    bottom: 18px;
    color: rgba(255, 255, 255, .74);
    font-size: .78rem;
    left: 0;
    position: absolute;
    right: 0;
    text-align: center;
}

.page-heading {
    align-items: center;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    margin-bottom: 18px;
}

.executive-heading {
    margin-bottom: 14px;
}

.dashboard-page {
    margin: 0 auto;
    max-width: 1540px;
    width: 100%;
}

.formulary-page {
    max-width: none;
}

.dashboard-page.executive-page {
    max-width: none;
}

.scenario-management-page,
.scenario-editor-page {
    max-width: none;
}

.dashboard-grid {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

.dashboard-grid > .mud-grid-item {
    min-width: 0;
}

.dashboard-middle-grid {
    align-items: start;
    display: grid;
    gap: 14px;
    grid-auto-rows: max-content;
    grid-template-columns: minmax(0, 2.25fr) minmax(320px, .95fr);
    width: 100%;
}

.dashboard-middle-main,
.dashboard-side-stack {
    min-width: 0;
}

.dashboard-side-stack {
    align-self: start;
    display: grid;
    gap: 14px;
    grid-auto-rows: max-content;
}

.dashboard-side-stack > .dashboard-card {
    height: auto;
}

.exec-story-card {
    align-items: center;
    background: linear-gradient(135deg, #111827, #303949);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 8px;
    color: white;
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(0, 1fr) auto;
    margin-bottom: 14px;
    overflow: hidden;
    padding: 22px 24px;
    position: relative;
}

.personal-hero {
    align-items: center;
    background: linear-gradient(135deg, #0f766e, #303949);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 8px;
    color: white;
    display: grid;
    gap: 26px;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 440px);
    margin-bottom: 14px;
    padding: 22px 24px;
}

.personal-hero .eyebrow,
.personal-hero .mud-typography-body2 {
    color: rgba(255, 255, 255, .74) !important;
}

.personal-hero .mud-typography-h4 {
    color: white;
    font-weight: 900;
}

.personal-progress {
    display: grid;
    gap: 14px;
}

.personal-progress div {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: 44px 1fr 44px;
}

.personal-progress span,
.personal-progress b {
    color: white;
    font-size: .78rem;
}

.exec-story-card::after {
    border: 1px solid rgba(255, 255, 255, .06);
    border-radius: 999px;
    content: "";
    height: 280px;
    position: absolute;
    right: -110px;
    top: -150px;
    width: 420px;
}

.story-copy {
    max-width: 780px;
    position: relative;
    z-index: 1;
}

.story-copy .eyebrow,
.story-copy .text-muted {
    color: rgba(255, 255, 255, .72) !important;
}

.story-copy .mud-typography-h5 {
    color: white;
    font-weight: 850;
    margin: 6px 0 8px;
}

.story-metrics {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(120px, 1fr));
    position: relative;
    z-index: 1;
}

.story-metrics div {
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 8px;
    padding: 12px 14px;
}

.story-metrics strong,
.story-metrics span {
    display: block;
}

.story-metrics strong {
    font-size: 1.1rem;
}

.story-metrics span {
    color: rgba(255, 255, 255, .68);
    font-size: .72rem;
    margin-top: 2px;
}

.eyebrow {
    color: #697386;
    font-weight: 800;
}

.heading-actions {
    align-items: center;
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}

.logout-form {
    margin: 0;
}

.filter-select {
    min-width: 150px;
}

.insight-filter-select {
    min-width: 178px;
}

.insight-filter-bar {
    align-items: center;
    background: #f8fafc;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: -4px 0 14px;
    padding: 10px;
}

.insight-filter-pill {
    background: #fff;
    border: 1px solid #d8e0ec;
    border-radius: 999px;
    color: #334155;
    cursor: pointer;
    font-size: .76rem;
    font-weight: 800;
    line-height: 1;
    padding: 8px 11px;
}

.insight-filter-pill:hover,
.insight-filter-pill.active {
    background: #eef2ff;
    border-color: #6266f1;
    color: #4f46e5;
}

.kpi-card,
.dashboard-card {
    background: var(--pl-surface);
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    overflow: hidden;
}

.kpi-card {
    align-items: center;
    display: flex;
    justify-content: space-between;
    min-height: 126px;
    padding: 22px;
}

.exec-kpi {
    min-height: 142px;
}

.quick-impact-result-kpis .exec-kpi {
    align-items: flex-start;
    gap: 8px;
    justify-content: center;
    min-height: 118px;
}

.quick-impact-result-kpis .kpi-title,
.quick-impact-result-kpis .text-muted {
    line-height: 1.25;
}

.quick-impact-result-kpis .mud-typography-h5 {
    overflow-wrap: anywhere;
}

.quick-impact-comparison-kpis .comparison-kpi {
    border-left: 4px solid #64748b;
    min-height: 116px;
}

.quick-impact-comparison-kpis .comparison-kpi.baseline {
    border-left-color: #4f46e5;
}

.quick-impact-comparison-kpis .comparison-kpi.adjusted {
    border-left-color: #0f9f84;
}

.quick-impact-comparison-kpis .comparison-kpi.upside {
    background: #effcf5;
    border-color: #b6e8ce;
    border-left-color: #16a34a;
}

.quick-impact-comparison-kpis .comparison-kpi.upside.downside {
    background: #fff5f5;
    border-color: #fecaca;
    border-left-color: #e11d48;
}

.quick-impact-comparison {
    background: linear-gradient(90deg, #f8fbff 0%, #ffffff 48%, #f3fcf8 100%);
    border: 1px solid #dce7f1;
    border-radius: 10px;
    padding: 18px 20px;
}

.quick-impact-comparison-heading {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    margin-bottom: 14px;
}

.quick-impact-comparison-heading .mud-typography-caption {
    color: #718096;
    display: block;
    margin-top: 3px;
}

.quick-impact-comparison-steps {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.quick-impact-comparison-step {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    min-width: 0;
    padding: 13px 16px;
    position: relative;
}

.quick-impact-comparison-step:not(:last-child)::after {
    color: #94a3b8;
    content: "→";
    font-size: 1.15rem;
    font-weight: 700;
    position: absolute;
    right: -23px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}

.quick-impact-comparison-step span,
.quick-impact-comparison-step small {
    color: #64748b;
    display: block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.quick-impact-comparison-step strong {
    color: #1e293b;
    display: block;
    font-size: 1.28rem;
    line-height: 1.2;
    margin: 5px 0 4px;
    overflow-wrap: anywhere;
}

.quick-impact-comparison-step small {
    font-size: .7rem;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
}

.quick-impact-comparison-step.adjusted {
    border-color: #b8d8ef;
}

.quick-impact-comparison-step.upside {
    background: #effcf5;
    border-color: #9de0bd;
}

.quick-impact-comparison-step.upside strong {
    color: #059669;
}

.quick-impact-comparison-step.upside.downside {
    background: #fff5f5;
    border-color: #fecaca;
}

.quick-impact-comparison-step.upside.downside strong {
    color: #e11d48;
}

@media (max-width: 800px) {
    .quick-impact-comparison {
        padding: 16px;
    }

    .quick-impact-comparison-steps {
        grid-template-columns: 1fr;
    }

    .quick-impact-comparison-step:not(:last-child)::after {
        bottom: -20px;
        left: 50%;
        right: auto;
        top: auto;
        transform: translateX(-50%) rotate(90deg);
    }
}

.kpi-title {
    color: #4b5565;
    font-weight: 600;
}

.kpi-row {
    align-items: center;
    display: flex;
    gap: 10px;
    margin: 10px 0 2px;
}

.kpi-value {
    color: #111827;
    font-size: 1.55rem;
    font-weight: 800;
    letter-spacing: -.02em;
}

.kpi-badge {
    border-radius: 6px;
    font-size: .72rem;
    font-weight: 800;
    padding: 4px 7px;
}

.kpi-badge.good {
    background: rgba(34, 197, 94, .14);
    color: #16a34a;
}

.kpi-badge.hot {
    background: rgba(239, 71, 111, .13);
    color: #ef476f;
}

.sparkline {
    height: 58px;
    max-width: 150px;
    width: 36%;
}

.dashboard-card {
    height: 100%;
    padding: 22px;
}

.opportunity-table {
    overflow-x: auto;
}

.opportunity-table .mud-table-container,
.scenario-library-table .mud-table-container,
.scenario-product-table .mud-table-container,
.workbench-table .mud-table-container {
    overflow-x: auto;
}

.opportunity-table .mud-table-root,
.scenario-library-table .mud-table-root,
.scenario-product-table .mud-table-root,
.workbench-table .mud-table-root {
    min-width: 720px;
}

.scenario-history-table .mud-table-root {
    min-width: 1380px;
}

.chart-card {
    min-height: 382px;
}

.card-heading {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}

.card-heading.compact {
    align-items: flex-start;
}

.action-card {
    min-height: 424px;
}

.action-table .mud-table-cell {
    vertical-align: middle;
}

.quick-impact-modal-table tr.quick-impact-focus-row td {
    background: #eefdfa;
    border-bottom-color: #c8f3ed;
    border-top: 1px solid #99e4da;
}

.quick-impact-modal-table tr.quick-impact-focus-row td:first-child {
    border-left: 4px solid #12a3a0;
}

.quick-impact-modal-table tr.quick-impact-leakage-row td {
    background: #fff1f2;
    border-bottom-color: #fecdd3;
    border-top: 1px solid #fecdd3;
}

.quick-impact-modal-table tr.quick-impact-leakage-row td:first-child {
    border-left: 4px solid #f43f5e;
}

.quick-impact-focus-guidance {
    align-items: center;
    background: #f0fdfa;
    border: 1px solid #99e4da;
    border-left: 4px solid #12a3a0;
    border-radius: 8px;
    color: #0f766e;
    display: flex;
    flex-wrap: wrap;
    font-size: .78rem;
    gap: 8px;
    line-height: 1.35;
    margin-top: 10px;
    padding: 9px 11px;
}

.quick-impact-focus-chip {
    background: #d9fbf5;
    border: 1px solid #8ce3d6;
    border-radius: 999px;
    color: #087a75;
    display: inline-flex;
    font-size: .68rem;
    font-weight: 800;
    line-height: 1;
    margin-left: 8px;
    padding: 5px 8px;
    vertical-align: middle;
}

.quick-impact-focus-chip.standalone {
    margin-left: 0;
}

.quick-impact-leakage-chip {
    background: #ffe4e6;
    border: 1px solid #fda4af;
    border-radius: 999px;
    color: #be123c;
    display: inline-flex;
    font-size: .68rem;
    font-weight: 800;
    line-height: 1;
    margin-left: 8px;
    padding: 5px 8px;
    vertical-align: middle;
}

.rank-pill {
    align-items: center;
    background: #eef2ff;
    border-radius: 999px;
    color: #4f46e5;
    display: inline-flex;
    font-size: .75rem;
    font-weight: 900;
    height: 26px;
    justify-content: center;
    width: 26px;
}

.table-sub {
    color: var(--pl-muted);
    display: block;
    font-size: .72rem;
    margin-top: 2px;
}

.sep-compliance-cell {
    align-items: flex-start;
    display: inline-flex;
    flex-direction: column;
    gap: 4px;
    min-width: 150px;
}

.formulary-workbench {
    align-items: start;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
}

.formulary-nav-panel,
.formulary-context-card,
.formulary-builder-card {
    align-self: start;
}

.formulary-nav-panel {
    max-height: calc(100vh - 126px);
    overflow: auto;
    position: sticky;
    top: 86px;
}

.formulary-list {
    display: grid;
    gap: .55rem;
}

.formulary-modify-panel {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.formulary-context-card {
    padding-bottom: 14px;
}

.formulary-detail-fields {
    display: grid;
    gap: .75rem 1rem;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.formulary-detail-fields.compact {
    gap: .6rem .8rem;
}

.formulary-detail-fields > span {
    min-width: 0;
}

.formulary-list-row {
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    cursor: pointer;
    display: grid;
    gap: .35rem;
    padding: .68rem .72rem;
    text-align: left;
    width: 100%;
}

.formulary-list-row strong {
    line-height: 1.15;
}

.formulary-list-row:hover,
.formulary-list-row.selected {
    background: #f7f8ff;
    border-color: var(--pl-primary);
}

.formulary-row-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.formulary-counts {
    color: var(--pl-muted);
    font-size: .78rem;
}

.formulary-builder-grid {
    align-items: start;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(440px, 38%) minmax(680px, 1fr);
}

.formulary-builder-card {
    min-height: 0;
    padding: 14px;
}

.builder-toolbar,
.add-resource-row {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 300px);
    margin-bottom: 10px;
}

.add-resource-row {
    grid-template-columns: minmax(150px, .85fr) minmax(210px, 1fr) auto;
}

.product-add-row {
    grid-template-columns: auto minmax(150px, .75fr) minmax(220px, 1fr) auto;
}

.search-field {
    max-width: 320px;
    width: 100%;
}

.workbench-table .mud-table-container {
    max-height: 380px;
    overflow: auto;
}

.selected-resource-cell {
    box-shadow: inset 3px 0 0 var(--pl-primary);
}

.selectable-workbench-table .mud-table-row {
    cursor: pointer;
}

.selectable-workbench-table .mud-table-row.selected-resource-row {
    background: #f7f8ff;
}

.selectable-workbench-table .mud-table-row.selected-resource-row .mud-table-cell:first-child {
    box-shadow: inset 3px 0 0 var(--pl-primary);
}

.scenario-library-table .mud-table-cell {
    vertical-align: middle;
}

.scenario-row-select {
    background: transparent;
    border: 0;
    color: var(--pl-text);
    cursor: pointer;
    display: block;
    font: inherit;
    font-weight: 850;
    line-height: 1.35;
    padding: 0;
    text-align: left;
    width: 100%;
}

.scenario-row-select:hover,
.scenario-row-select:focus-visible {
    color: var(--pl-primary);
    outline: none;
}

.scenario-actions-cell {
    text-align: right;
}

.scenario-actions-menu {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    min-height: 36px;
    min-width: 36px;
}

.commercial-fields {
    display: grid;
    gap: 6px;
    grid-template-columns: minmax(100px, 1fr) minmax(90px, .7fr);
}

.targets-inline {
    border-top: 1px solid var(--pl-border);
    margin-top: 10px;
    padding-top: 10px;
}

.formulary-management-shell {
    display: grid;
    gap: 12px;
}

.formulary-switcher-card,
.formulary-selection-summary,
.formulary-inn-rail,
.formulary-product-workspace {
    padding: 14px;
}

.formulary-switcher-heading,
.formulary-summary-row,
.product-workspace-heading {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
}

.formulary-switcher-list {
    display: flex;
    gap: 8px;
    margin-top: 10px;
    overflow-x: auto;
    padding-bottom: 2px;
}

.formulary-switcher-item {
    align-items: center;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    color: var(--pl-muted);
    cursor: pointer;
    display: grid;
    flex: 0 0 min(360px, 100%);
    font: inherit;
    gap: 5px 12px;
    grid-template-columns: minmax(170px, 1fr) auto auto auto;
    min-height: 56px;
    padding: 9px 11px;
    text-align: left;
}

.formulary-switcher-item:hover,
.formulary-switcher-item.selected {
    background: #f7f8ff;
    border-color: var(--pl-primary);
    box-shadow: inset 3px 0 0 var(--pl-primary);
}

.formulary-switcher-title {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.formulary-switcher-title strong {
    color: var(--pl-text);
}

.formulary-mode-pill,
.formulary-active-dot {
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 800;
    justify-self: start;
    padding: 2px 7px;
}

.formulary-mode-pill.editable {
    background: #dcfce7;
    color: #15803d;
}

.formulary-mode-pill.reference {
    background: #e0f2fe;
    color: #0369a1;
}

.formulary-active-dot {
    background: #eef2ff;
    color: var(--pl-primary);
}

.formulary-breadcrumb {
    align-items: center;
    color: var(--pl-muted);
    display: flex;
    flex-wrap: wrap;
    font-size: .76rem;
    gap: 4px;
    margin-bottom: 10px;
}

.formulary-breadcrumb strong {
    color: var(--pl-primary);
}

.formulary-summary-row > :first-child {
    min-width: 260px;
}

.formulary-summary-metrics {
    align-items: stretch;
    display: flex;
    gap: 8px;
    margin-left: auto;
}

.formulary-summary-metrics > span {
    background: #f8fafc;
    border: 1px solid var(--pl-border);
    border-radius: 7px;
    display: grid;
    min-width: 92px;
    padding: 7px 10px;
}

.formulary-summary-metrics small {
    color: var(--pl-muted);
    font-size: .68rem;
}

.formulary-hierarchy-grid {
    align-items: stretch;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(270px, 320px) minmax(0, 1fr);
    min-height: 520px;
}

.formulary-inn-rail {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.hierarchy-panel-heading {
    display: grid;
    gap: 10px;
}

.hierarchy-step {
    align-items: center;
    display: flex;
    gap: 9px;
    min-width: 0;
}

.hierarchy-step > span {
    align-items: center;
    background: var(--pl-primary);
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    flex: 0 0 26px;
    font-size: .76rem;
    font-weight: 900;
    height: 26px;
    justify-content: center;
}

.hierarchy-step > div {
    display: grid;
    min-width: 0;
}

.hierarchy-step small {
    color: var(--pl-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.formulary-inn-list {
    display: grid;
    gap: 6px;
    margin: 10px -4px 10px 0;
    max-height: 430px;
    overflow: auto;
    padding-right: 4px;
}

.formulary-inn-item {
    align-items: center;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    color: var(--pl-text);
    cursor: pointer;
    display: grid;
    font: inherit;
    gap: 3px 8px;
    grid-template-columns: minmax(0, 1fr) auto auto;
    padding: 9px 10px;
    text-align: left;
}

.formulary-inn-item:hover,
.formulary-inn-item.selected {
    background: #f7f8ff;
    border-color: var(--pl-primary);
}

.formulary-inn-item.selected {
    box-shadow: inset 3px 0 0 var(--pl-primary);
}

.formulary-inn-item > span:first-child,
.formulary-inn-meta {
    display: grid;
    min-width: 0;
}

.formulary-inn-item strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.formulary-inn-item small,
.formulary-inn-status {
    color: var(--pl-muted);
    font-size: .68rem;
}

.formulary-inn-meta {
    justify-items: end;
}

.formulary-inn-status {
    grid-column: 1 / 3;
}

.formulary-add-inn {
    border-top: 1px solid var(--pl-border);
    display: grid;
    gap: 6px;
    margin-top: auto;
    padding-top: 10px;
}

.formulary-add-inn > div {
    align-items: center;
    display: grid;
    gap: 6px;
    grid-template-columns: minmax(0, 1fr) auto;
}

.formulary-product-workspace {
    min-width: 0;
}

.product-workspace-heading {
    border-bottom: 1px solid var(--pl-border);
    padding-bottom: 10px;
}

.product-workspace-counts {
    color: var(--pl-muted);
    display: flex;
    font-size: .72rem;
    gap: 12px;
    margin-left: auto;
    white-space: nowrap;
}

.product-workspace-counts b {
    color: var(--pl-text);
}

.selected-inn-settings {
    align-items: center;
    background: #f8fafc;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    display: grid;
    gap: 8px;
    grid-template-columns: auto minmax(130px, 180px) minmax(160px, 220px) auto;
    margin-top: 10px;
    padding: 8px 10px;
}

.settings-label {
    font-size: .72rem;
    font-weight: 850;
    white-space: nowrap;
}

.product-management-toolbar {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(160px, .8fr) minmax(220px, 1.2fr);
    margin: 10px 0;
}

.product-toolbar-label {
    align-items: baseline;
    display: flex;
    gap: 8px;
    margin-top: 10px;
}

.product-toolbar-label span {
    color: var(--pl-muted);
    font-size: .72rem;
}

.product-list-toolbar {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 340px);
    margin: 10px 0;
}

.product-list-toolbar > div {
    display: grid;
}

.product-list-toolbar span {
    color: var(--pl-muted);
    font-size: .72rem;
}

.add-product-context {
    align-items: center;
    background: #f8fafc;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    padding: 10px 12px;
}

.add-product-context span {
    display: grid;
}

.add-product-context small {
    color: var(--pl-muted);
    font-size: .68rem;
}

.product-management-toolbar > :nth-child(3),
.product-management-toolbar > :nth-child(4) {
    justify-self: end;
}

.formulary-products-table .mud-table-container {
    max-height: 440px;
    overflow: auto;
}

.formulary-products-table .mud-table-cell {
    vertical-align: middle;
}

.formulary-empty-selection {
    align-items: center;
    color: var(--pl-muted);
    display: flex;
    flex-direction: column;
    gap: 6px;
    justify-content: center;
    min-height: 420px;
    text-align: center;
}

.formulary-empty-selection strong {
    color: var(--pl-text);
}

@media (max-width: 1450px) {
    .product-workspace-counts {
        display: none;
    }
}

@media (max-width: 1180px) {
    .formulary-hierarchy-grid {
        grid-template-columns: 300px minmax(0, 1fr);
    }

    .product-management-toolbar {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 900px) {
    .formulary-hierarchy-grid {
        grid-template-columns: 1fr;
    }

    .formulary-inn-list {
        max-height: 300px;
    }

    .formulary-summary-row,
    .product-workspace-heading {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .formulary-summary-metrics {
        margin-left: 0;
    }

    .selected-inn-settings,
    .product-management-toolbar,
    .product-list-toolbar {
        grid-template-columns: 1fr;
    }
}

.scenario-editor-shell {
    min-height: 0;
}

.scenario-editor-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(270px, 330px) minmax(0, 1fr);
}

.scenario-inn-rail {
    border-right: 1px solid var(--pl-border);
    display: grid;
    gap: 10px;
    max-height: calc(100vh - 260px);
    min-height: 520px;
    overflow: hidden;
    padding-right: 12px;
}

.scenario-inn-list {
    display: grid;
    gap: 6px;
    overflow: auto;
    padding-right: 4px;
}

.scenario-inn-item {
    align-items: center;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    color: var(--pl-text);
    cursor: pointer;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 9px 10px;
    text-align: left;
}

.scenario-inn-item:hover,
.scenario-inn-item.selected {
    background: #f7f8ff;
    border-color: var(--pl-primary);
}

.scenario-inn-item.selected {
    box-shadow: inset 3px 0 0 var(--pl-primary);
}

.scenario-inn-item strong,
.scenario-inn-item small {
    display: block;
}

.scenario-inn-item small {
    color: var(--pl-muted);
    font-size: .7rem;
    margin-top: 2px;
}

.scenario-product-panel {
    min-width: 0;
}

.scenario-product-heading {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 10px;
}

.scenario-editor-toolbar {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(220px, 1fr) auto;
    margin-bottom: 10px;
}

.scenario-mini-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.scenario-mini-metrics span {
    background: #f8fafc;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    min-width: 96px;
    padding: 8px 10px;
}

.scenario-mini-metrics strong,
.scenario-mini-metrics small {
    display: block;
}

.scenario-mini-metrics small {
    color: var(--pl-muted);
    font-size: .68rem;
}

.scenario-product-table .mud-table-container {
    max-height: calc(100vh - 335px);
    overflow: auto;
}

.scenario-product-row-dirty {
    background: #fffbeb;
}

.scenario-product-row-dirty .mud-table-cell:first-child {
    box-shadow: inset 3px 0 0 #f59e0b;
}

.scenario-product-row-saved .mud-table-cell:first-child {
    box-shadow: inset 3px 0 0 #0ea5e9;
}

.scenario-product-row-exception {
    background: #fffaf0;
}

.scenario-product-row-exception .mud-table-cell:first-child {
    box-shadow: inset 3px 0 0 #f59e0b;
}

.compact-input {
    min-width: 88px;
    max-width: 130px;
}

.scenario-cell-input {
    width: 100%;
    min-width: 84px;
    height: 34px;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #fff;
    color: #0f172a;
    font: inherit;
    padding: 0 10px;
}

.scenario-cell-input-wide {
    min-width: 180px;
}

.scenario-cell-input:focus {
    border-color: #635bff;
    box-shadow: 0 0 0 2px rgba(99, 91, 255, 0.14);
    outline: none;
}

.scenario-toggle {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.scenario-toggle input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.scenario-toggle span {
    position: relative;
    width: 38px;
    height: 20px;
    border-radius: 999px;
    background: #cbd5e1;
    transition: background 140ms ease;
}

.scenario-toggle span::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.2);
    transition: transform 140ms ease;
}

.scenario-toggle input:checked + span {
    background: #635bff;
}

.scenario-toggle input:checked + span::after {
    transform: translateX(18px);
}

.readonly-metric {
    color: var(--pl-muted);
    font-weight: 700;
}

.target-history-value {
    color: var(--pl-text);
    font-weight: 700;
    white-space: nowrap;
}

.target-history-empty {
    color: var(--pl-muted);
    font-size: .72rem;
    white-space: nowrap;
}

.target-adjustment {
    display: inline-flex;
    align-items: center;
    min-width: 72px;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    white-space: nowrap;
}

.target-adjustment-up {
    color: #047857;
    background: #ecfdf5;
}

.target-adjustment-down {
    color: #be123c;
    background: #fff1f2;
}

.target-adjustment-neutral {
    color: #64748b;
    background: #f1f5f9;
}

.formulary-wizard {
    display: grid;
    gap: 20px;
    grid-template-columns: 210px minmax(0, 1fr);
    min-width: min(760px, 82vw);
}

.wizard-steps {
    border-right: 1px solid var(--pl-border);
    display: grid;
    gap: 8px;
    padding-right: 14px;
}

.wizard-step {
    border-radius: 8px;
    display: grid;
    gap: 3px 10px;
    grid-template-columns: 26px 1fr;
    padding: 10px;
}

.wizard-step.active {
    background: #eef2ff;
    color: var(--pl-primary);
}

.wizard-step span {
    align-items: center;
    background: #e8edf4;
    border-radius: 999px;
    display: flex;
    font-size: .75rem;
    font-weight: 900;
    height: 24px;
    justify-content: center;
    width: 24px;
}

.wizard-step.active span {
    background: var(--pl-primary);
    color: white;
}

.wizard-step strong,
.wizard-step small {
    display: block;
}

.wizard-step small {
    color: var(--pl-muted);
    font-size: .72rem;
    grid-column: 2;
}

.formulary-dialog-grid {
    display: grid;
    gap: 10px 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 16px;
}

@media (max-width: 1100px) {
    .dashboard-middle-grid,
    .formulary-workbench,
    .formulary-builder-grid,
    .scenario-editor-grid,
    .builder-toolbar,
    .add-resource-row,
    .product-add-row,
    .formulary-wizard,
    .formulary-dialog-grid {
        grid-template-columns: 1fr;
    }

    .formulary-nav-panel {
        max-height: none;
        position: static;
    }

    .scenario-inn-rail {
        border-right: 0;
        max-height: none;
        min-height: 0;
        padding-right: 0;
    }

    .formulary-detail-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .scenario-editor-toolbar {
        grid-template-columns: 1fr;
    }

    .wizard-steps {
        border-right: 0;
        border-bottom: 1px solid var(--pl-border);
        padding: 0 0 12px;
    }
}

.gap-hot {
    color: var(--pl-danger);
}

.gap-warm {
    color: var(--pl-warning);
}

.line-chart {
    display: grid;
    gap: 12px;
    grid-template-columns: 46px 1fr;
    height: 276px;
}

.line-chart svg {
    height: 100%;
    width: 100%;
}

.grid-lines line {
    stroke: #edf1f6;
    stroke-width: 2;
}

.y-axis {
    color: #98a2b3;
    display: flex;
    flex-direction: column;
    font-size: .76rem;
    justify-content: space-around;
}

.chart-legend,
.mini-legend {
    align-items: center;
    color: #64748b;
    display: flex;
    flex-wrap: wrap;
    font-size: .78rem;
    gap: 18px;
}

.chart-legend i,
.mini-legend i {
    border-radius: 999px;
    display: inline-block;
    height: 9px;
    margin-right: 7px;
    width: 9px;
}

.bar-list {
    display: grid;
    gap: 22px;
    margin-top: 26px;
}

.bar-label {
    display: flex;
    font-size: .84rem;
    justify-content: space-between;
    margin-bottom: 8px;
}

.alignment-card {
    text-align: center;
}

.exec-alignment-card {
    min-height: 424px;
}

.compact-mapl-card {
    align-self: start;
    height: auto;
    max-height: 360px;
    min-height: 300px;
    padding-bottom: 18px;
}

.compact-mapl-card .exec-donut {
    height: 136px;
    margin: 14px auto 12px;
    width: 136px;
}

.compact-mapl-card .donut-center {
    height: 78px;
    width: 78px;
}

.priority-mix-card {
    text-align: left;
}

.donut {
    align-items: center;
    background: conic-gradient(#6266f1 0 42%, #12a3a0 42% 74%, #ef476f 74% 100%);
    border-radius: 999px;
    display: flex;
    height: 174px;
    justify-content: center;
    margin: 28px auto 22px;
    width: 174px;
}

.donut-center {
    align-items: center;
    background: white;
    border-radius: 999px;
    display: flex;
    flex-direction: column;
    height: 104px;
    justify-content: center;
    width: 104px;
}

.donut-center strong {
    font-size: 1.45rem;
}

.donut-center span {
    color: var(--pl-muted);
    font-size: .78rem;
}

.exec-donut {
    height: 188px;
    margin-top: 24px;
    width: 188px;
}

.alignment-breakdown {
    display: grid;
    gap: 10px;
    margin-top: 18px;
    text-align: left;
}

.alignment-breakdown div {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.alignment-breakdown span {
    align-items: center;
    color: #526078;
    display: flex;
    font-size: .82rem;
    gap: 8px;
}

.alignment-breakdown i {
    border-radius: 999px;
    display: inline-block;
    height: 9px;
    width: 9px;
}

.mini-legend {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    margin-left: 12px;
    text-align: left;
}

.mini-legend .both {
    background: #6266f1;
}

.mini-legend .mapl {
    background: #12a3a0;
}

.mini-legend .risk {
    background: #ef476f;
}

.alignment-breakdown .both {
    background: #6266f1;
}

.alignment-breakdown .mapl {
    background: #12a3a0;
}

.alignment-breakdown .risk {
    background: #ef476f;
}

.shift-list,
.impact-list,
.supplier-list,
.task-list,
.guidance-stack {
    display: grid;
    gap: 13px;
    margin-top: 18px;
}

.shift-item {
    background: #f8fafc;
    border: 1px solid #edf1f6;
    border-radius: 8px;
    padding: 13px;
}

.shift-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.shift-head span {
    color: var(--pl-success);
    font-weight: 850;
}

.shift-bar {
    background: #e8edf4;
    border-radius: 999px;
    height: 9px;
    margin-top: 11px;
    position: relative;
}

.shift-bar span {
    background: #12a3a0;
    border-radius: inherit;
    display: block;
    height: 100%;
}

.shift-bar b {
    background: #6266f1;
    border: 2px solid white;
    border-radius: 999px;
    box-shadow: 0 1px 4px rgba(17, 24, 39, .22);
    height: 17px;
    margin-left: -8px;
    position: absolute;
    top: -4px;
    width: 17px;
}

.shift-rollup {
    align-items: center;
    background: #eef4ff;
    border: 1px solid #dbe7ff;
    border-radius: 8px;
    color: #64748b;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 14px;
    padding: 10px 13px;
}

.shift-rollup strong {
    color: var(--pl-ink);
}

.mix-list {
    display: grid;
    gap: 14px;
    margin-top: 18px;
}

.mix-item {
    background: #f8fafc;
    border: 1px solid #edf1f6;
    border-radius: 8px;
    padding: 13px;
}

.mix-head,
.mix-meta,
.mix-rollup {
    align-items: center;
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.mix-head span {
    color: var(--pl-ink);
    font-weight: 850;
}

.mix-meta {
    color: #71809a;
    font-size: .79rem;
    margin-top: 4px;
}

.mix-bar {
    background: #e8edf4;
    border-radius: 999px;
    height: 9px;
    margin-top: 12px;
    overflow: hidden;
}

.mix-bar span {
    border-radius: inherit;
    display: block;
    height: 100%;
}

.mix-bar .critical {
    background: #ef476f;
}

.mix-bar .star {
    background: #22c55e;
}

.mix-bar .resource {
    background: #f59e0b;
}

.mix-bar .review {
    background: #94a3b8;
}

.mix-bar .standard {
    background: #1da1f2;
}

.mix-rollup {
    background: #eef4ff;
    border: 1px solid #dbe7ff;
    border-radius: 8px;
    color: #64748b;
    flex-wrap: wrap;
    margin-top: 14px;
    padding: 10px 13px;
}

.mix-rollup strong {
    color: var(--pl-ink);
}

.scenario-chart-card {
    min-height: 260px;
}

.value-bar-stack,
.quick-impact-value-visual,
.ranked-bars,
.movement-bars {
    display: grid;
    gap: 14px;
}

.value-bar-row,
.ranked-bar-row,
.movement-row {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(150px, 1.1fr) minmax(180px, 2fr) minmax(92px, auto);
}

.value-bar-row span,
.ranked-bar-row span,
.movement-row span {
    color: #172033;
    font-size: .86rem;
    font-weight: 800;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.value-bar-row strong,
.ranked-bar-row strong,
.movement-row strong {
    font-size: .86rem;
    justify-self: end;
}

.value-bar-track,
.ranked-bar-track,
.movement-track {
    background: #eef3f8;
    border-radius: 999px;
    height: 12px;
    overflow: hidden;
}

.value-bar-track i,
.ranked-bar-track i,
.movement-track i {
    border-radius: inherit;
    display: block;
    height: 100%;
}

.bar-current {
    background: #16a6b6;
}

.bar-formulary {
    background: #2378c9;
}

.bar-scenario,
.positive-bar {
    background: #18b95f;
}

.baseline-bar {
    background: #6266f1;
}

.negative-bar {
    background: #e33b4f;
}

strong.positive-bar {
    background: transparent;
    color: #10a552;
}

strong.negative-bar {
    background: transparent;
    color: #d9263e;
}

.stacked-mix {
    background: #eef3f8;
    border-radius: 999px;
    display: flex;
    height: 18px;
    overflow: hidden;
}

.stacked-mix i {
    display: block;
    min-width: 2px;
}

.mix-both {
    background: #18b95f;
}

.mix-mapl {
    background: #1fa4d8;
}

.mix-preferred {
    background: #f5a000;
}

.mix-risk {
    background: #a5adba;
}

.chart-key-grid {
    display: grid;
    gap: 10px 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 18px;
}

.chart-key-grid div {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: 10px minmax(0, 1fr) auto;
}

.chart-key-grid i {
    border-radius: 999px;
    display: block;
    height: 10px;
    width: 10px;
}

.chart-key-grid span {
    color: #526078;
    font-size: .82rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chart-key-grid strong {
    font-size: .86rem;
}

.scenario-analysis-card {
    padding-bottom: 18px;
}

.scenario-decision-card {
    align-items: center;
    background: #172033;
    color: #fff;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    margin-bottom: 16px;
}

.scenario-decision-card .eyebrow,
.scenario-decision-card .mud-typography-body2 {
    color: rgba(255, 255, 255, .74);
}

.scenario-decision-kpis {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(130px, 1fr));
    min-width: min(560px, 100%);
}

.scenario-decision-kpis span {
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 8px;
    padding: 14px;
}

.scenario-decision-kpis strong,
.scenario-decision-kpis small {
    display: block;
}

.scenario-decision-kpis strong {
    color: #fff;
    font-size: 1.05rem;
}

.scenario-decision-kpis small {
    color: rgba(255, 255, 255, .7);
    font-size: .78rem;
    margin-top: 4px;
}

.scenario-kpi-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 14px;
}

.scenario-kpi-grid div {
    border: 1px solid #e3e9f1;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(17, 24, 39, .04);
    min-height: 98px;
    padding: 16px;
}

.scenario-kpi-grid span,
.scenario-kpi-grid small {
    color: #6f7b91;
    display: block;
    font-size: .82rem;
}

.scenario-kpi-grid strong {
    color: #172033;
    display: block;
    font-size: 1.15rem;
    margin: 8px 0;
}

@media (max-width: 1100px) {
    .scenario-decision-card {
        align-items: stretch;
        flex-direction: column;
    }

    .scenario-decision-kpis {
        grid-template-columns: 1fr;
        min-width: 0;
    }
}

.legacy-chart-card {
    min-height: 330px;
}

.vertical-chart {
    display: grid;
    gap: 12px;
    grid-template-columns: 58px minmax(0, 1fr);
    height: 250px;
    margin-top: 22px;
}

.vertical-axis {
    color: #526078;
    display: flex;
    flex-direction: column;
    font-size: .76rem;
    justify-content: space-between;
    text-align: right;
}

.vertical-plot {
    border-bottom: 1px solid #526078;
    position: relative;
}

.vertical-grid {
    background:
        linear-gradient(to bottom, #e7ecf3 1px, transparent 1px) 0 0 / 100% 33.33%;
    inset: 0;
    position: absolute;
}

.vertical-bars {
    align-items: end;
    display: flex;
    gap: 70px;
    height: 100%;
    justify-content: center;
    padding: 0 32px;
    position: relative;
    z-index: 1;
}

.three-bar-chart .vertical-bars {
    gap: 56px;
}

.vertical-bar-item {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: end;
    min-width: 110px;
    position: relative;
}

.vertical-bar-item i {
    border-radius: 3px 3px 0 0;
    display: block;
    min-height: 4px;
    width: 76px;
}

.vertical-bar-item strong {
    color: #172033;
    font-size: .78rem;
    font-weight: 900;
    margin-bottom: 4px;
}

.vertical-bar-item span {
    color: #526078;
    font-size: .78rem;
    margin-top: 9px;
    min-height: 32px;
    text-align: center;
}

.result-donut {
    align-items: center;
    border-radius: 999px;
    display: flex;
    height: 178px;
    justify-content: center;
    margin: 18px auto;
    width: 178px;
}

.result-donut-center {
    align-items: center;
    background: white;
    border-radius: 999px;
    box-shadow: inset 0 0 0 1px #e6ecf4;
    display: flex;
    flex-direction: column;
    height: 96px;
    justify-content: center;
    width: 96px;
}

.result-donut-center strong {
    font-size: 1.35rem;
}

.result-donut-center span {
    color: #6f7b91;
    font-size: .76rem;
}

.diverging-chart {
    display: grid;
    gap: 12px;
}

.quick-impact-split-movement {
    display: grid;
    gap: 22px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.movement-section-title {
    color: #172033;
    font-size: .8rem;
    font-weight: 900;
    letter-spacing: .02em;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.movement-section-title.positive {
    color: #08a84f;
}

.movement-section-title.negative {
    color: #df3045;
}

.diverging-row {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(220px, 1.2fr) minmax(280px, 3fr) minmax(120px, auto);
}

.diverging-row.compact {
    grid-template-columns: minmax(160px, 1.1fr) minmax(180px, 2fr) minmax(110px, auto);
}

.diverging-product {
    min-width: 0;
}

.diverging-product strong {
    color: #172033;
    display: block;
    font-size: .82rem;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.diverging-product span,
.diverging-deltas span {
    color: #6f7b91;
    display: block;
    font-size: .74rem;
    font-weight: 700;
    margin-top: 2px;
}

.diverging-deltas {
    text-align: right;
}

.diverging-deltas strong {
    display: block;
    font-size: .82rem;
}

.diverging-track {
    background:
        linear-gradient(to right, transparent calc(50% - .5px), #7a8494 calc(50% - .5px), #7a8494 calc(50% + .5px), transparent calc(50% + .5px)),
        repeating-linear-gradient(to right, #eef3f8 0, #eef3f8 1px, transparent 1px, transparent 10%);
    height: 18px;
    position: relative;
}

.diverging-track i {
    border-radius: 2px;
    display: block;
    height: 12px;
    position: absolute;
    top: 3px;
}

@media (max-width: 1100px) {
    .quick-impact-split-movement {
        grid-template-columns: 1fr;
    }
}

.impact-item {
    align-items: center;
    background: #f8fafc;
    border-radius: 8px;
    display: grid;
    gap: 12px;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    padding: 12px;
}

.impact-icon {
    align-items: center;
    background: rgba(98, 102, 241, .12);
    border-radius: 8px;
    color: #4f46e5;
    display: flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.impact-icon.employee {
    background: rgba(18, 163, 160, .12);
    color: #0f8f8c;
}

.impact-item strong,
.impact-item small {
    display: block;
}

.impact-item small {
    color: var(--pl-muted);
    font-size: .72rem;
    margin-top: 2px;
}

.impact-item b {
    color: var(--pl-success);
}

.bridge-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 18px;
}

.bridge-step {
    background: #f8fafc;
    border: 1px solid #edf1f6;
    border-radius: 8px;
    padding: 12px;
}

.bridge-step span,
.bridge-step strong {
    display: block;
}

.bridge-step span {
    color: var(--pl-muted);
    font-size: .72rem;
}

.bridge-step strong {
    font-size: 1.05rem;
    margin-top: 4px;
}

.bridge-step.warning strong {
    color: var(--pl-danger);
}

.bridge-step.success {
    background: rgba(34, 197, 94, .08);
    border-color: rgba(34, 197, 94, .18);
}

.bridge-step.success strong {
    color: var(--pl-success);
}

.exec-line-chart {
    height: 226px;
}

.supplier-card {
    min-height: 382px;
}

.supplier-item {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #edf1f6;
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    padding: 13px;
}

.supplier-item strong,
.supplier-item span,
.supplier-ask small,
.supplier-ask b {
    display: block;
}

.supplier-item span,
.supplier-ask small {
    color: var(--pl-muted);
    font-size: .72rem;
    margin-top: 2px;
}

.supplier-ask {
    text-align: right;
}

.supplier-ask b {
    color: var(--pl-primary);
}

.task-item {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #edf1f6;
    border-radius: 8px;
    display: grid;
    gap: 12px;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    padding: 13px;
}

.task-status {
    border-radius: 999px;
    display: block;
    height: 12px;
    width: 12px;
}

.task-status.hot {
    background: var(--pl-danger);
}

.task-status.good {
    background: var(--pl-success);
}

.task-status.warn {
    background: var(--pl-warning);
}

.task-item strong,
.task-item small {
    display: block;
}

.task-item small {
    color: var(--pl-muted);
    font-size: .72rem;
    margin-top: 2px;
}

.task-item b {
    color: var(--pl-primary);
}

.target-rings {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 28px 0 18px;
}

.target-ring {
    align-items: center;
    background: conic-gradient(#6266f1 0 68%, #edf1f6 68% 100%);
    border-radius: 999px;
    display: flex;
    flex-direction: column;
    height: 132px;
    justify-content: center;
    margin: 0 auto;
    position: relative;
    width: 132px;
}

.target-ring.otc {
    background: conic-gradient(#22c55e 0 82%, #edf1f6 82% 100%);
}

.target-ring::after {
    background: white;
    border-radius: inherit;
    content: "";
    inset: 17px;
    position: absolute;
}

.target-ring strong,
.target-ring span {
    position: relative;
    z-index: 1;
}

.target-ring strong {
    font-size: 1.25rem;
}

.target-ring span {
    color: var(--pl-muted);
    font-size: .75rem;
}

.compact-bridge {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 18px;
}

.scenario-overview-card {
    padding: 26px;
}

.scenario-story-hero {
    align-items: flex-start;
    background: #f8fafc;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    display: flex;
    gap: 22px;
    justify-content: space-between;
    margin-top: 18px;
    padding: 20px;
}

.scenario-story-copy {
    max-width: 760px;
}

.scenario-story-copy .mud-typography-h5 {
    margin: 4px 0 6px;
}

.scenario-story-status {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
    min-width: 220px;
}

.scenario-overview-kpis {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 14px;
}

.scenario-overview-kpi {
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-height: 92px;
    padding: 14px;
}

.scenario-overview-kpi span,
.scenario-execution-strip span {
    color: var(--pl-muted);
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: 0;
}

.scenario-overview-kpi strong {
    color: var(--pl-text);
    font-size: 1rem;
    line-height: 1.25;
}

.scenario-overview-kpi small {
    color: var(--pl-muted);
    line-height: 1.25;
}

.scenario-execution-strip {
    align-items: stretch;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-top: 14px;
    overflow: hidden;
}

.scenario-execution-strip div {
    background: #fff;
    border-right: 1px solid var(--pl-border);
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 13px 14px;
}

.scenario-execution-strip div:last-child {
    border-right: 0;
}

.scenario-execution-strip strong {
    color: var(--pl-text);
    font-size: .95rem;
    line-height: 1.25;
}

.scenario-support-grid .mud-table {
    margin-top: 10px;
}

.scenario-support-card {
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    min-height: 280px;
    padding: 18px;
}

.guidance-stack div {
    background: #f8fafc;
    border: 1px solid #edf1f6;
    border-radius: 8px;
    padding: 14px;
}

.guidance-stack strong,
.guidance-stack span {
    display: block;
}

.guidance-stack span {
    color: var(--pl-muted);
    font-size: .78rem;
    line-height: 1.35;
    margin-top: 5px;
}

.opportunity-table th {
    background: #f1f4f8;
    color: #334155;
    font-size: .78rem;
    font-weight: 800;
}

.product-stack {
    display: grid;
    gap: 14px;
    margin-top: 16px;
}

.product-mini {
    align-items: center;
    background: #f6f8fb;
    border-radius: 8px;
    display: grid;
    gap: 12px;
    grid-template-columns: 42px 1fr auto;
    padding: 12px;
}

.pill-icon {
    align-items: center;
    background: rgba(98, 102, 241, .13);
    border-radius: 8px;
    color: #4f46e5;
    display: flex;
    font-weight: 800;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.product-mini strong,
.product-mini span {
    display: block;
}

.product-mini span {
    color: var(--pl-muted);
    font-size: .78rem;
    margin-top: 2px;
}

.product-mini b {
    color: var(--pl-success);
}

.sep-tier-stack {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.sep-tier-row {
    align-items: center;
    background: #f8fafc;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(110px, .8fr) minmax(0, 1fr) auto;
    padding: 10px 12px;
}

.sep-tier-row strong {
    color: #172033;
    font-size: .86rem;
}

.sep-tier-row b {
    color: var(--pl-success);
    justify-self: end;
}

/* Data Operations Control Centre */
.data-ops-page { padding-bottom: 28px; }
.ops-control-strip { align-items: center; background: #172033; border: 1px solid #2f3b50; border-radius: 8px; color: #fff; display: flex; gap: 20px; justify-content: space-between; margin-bottom: 14px; padding: 12px 16px; }
.ops-control-copy, .ops-control-actions, .ops-policy-pill { align-items: center; display: flex; }
.ops-control-copy { gap: 10px; }
.ops-control-copy strong, .ops-control-copy span { display: block; }
.ops-control-copy strong { font-size: .84rem; }
.ops-control-copy span { color: #aab4c5; font-size: .72rem; margin-top: 2px; }
.ops-live-dot { background: #22c55e; border: 4px solid rgba(34,197,94,.18); border-radius: 50%; height: 14px; width: 14px; }
.ops-control-actions { flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.ops-policy-pill { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.11); border-radius: 999px; color: #d9e1ee; font-size: .7rem; font-weight: 700; gap: 5px; padding: 6px 9px; }
.ops-kpi-grid { display: grid; gap: 10px; grid-template-columns: repeat(7, minmax(0,1fr)); margin-bottom: 14px; }
.ops-kpi { align-items: flex-start; background: #fff; border: 1px solid var(--pl-border); border-radius: 8px; color: var(--pl-text); cursor: pointer; display: flex; gap: 10px; min-height: 112px; padding: 14px; text-align: left; transition: border-color .15s, box-shadow .15s, transform .15s; }
.ops-kpi:hover, .ops-kpi.selected { border-color: #9da0ff; box-shadow: 0 3px 12px rgba(17,24,39,.08); transform: translateY(-1px); }
.ops-kpi-icon { align-items: center; background: #f1f4f8; border-radius: 7px; color: #64748b; display: flex; flex: 0 0 34px; height: 34px; justify-content: center; }
.ops-kpi.success .ops-kpi-icon { background: #eafaf0; color: #16a34a; }
.ops-kpi.info .ops-kpi-icon { background: #eaf7ff; color: #0284c7; }
.ops-kpi.warning .ops-kpi-icon { background: #fff7e6; color: #d97706; }
.ops-kpi.danger .ops-kpi-icon { background: #fff0f3; color: #e1345c; }
.ops-kpi-copy { min-width: 0; }
.ops-kpi-copy span, .ops-kpi-copy strong, .ops-kpi-copy small { display: block; }
.ops-kpi-copy span { color: #536077; font-size: .72rem; font-weight: 700; }
.ops-kpi-copy strong { font-size: 1.25rem; letter-spacing: -.02em; margin: 4px 0 2px; white-space: nowrap; }
.ops-kpi-copy small { color: var(--pl-muted); font-size: .65rem; line-height: 1.25; }
.ops-filter-bar { align-items: center; background: #fff; border: 1px solid var(--pl-border); border-radius: 8px; display: flex; gap: 14px; justify-content: space-between; margin-bottom: 14px; padding: 8px 10px; }
.ops-view-tabs { display: flex; gap: 3px; }
.ops-view-tabs button { background: transparent; border: 0; border-radius: 6px; color: #657086; cursor: pointer; font: inherit; font-size: .76rem; font-weight: 800; padding: 9px 12px; }
.ops-view-tabs button.active { background: #eef2ff; color: #4f46e5; }
.ops-filter-fields { align-items: center; display: flex; gap: 8px; }
.ops-filter { min-width: 138px; }
.ops-clear-filter { align-items: center; background: #fff7e6; border: 1px solid #f4d69b; border-radius: 999px; color: #9a5c00; display: flex; font-size: .7rem; font-weight: 800; gap: 4px; padding: 6px 8px 6px 10px; }
.ops-primary-grid { align-items: start; display: grid; gap: 14px; grid-template-columns: minmax(0,2.3fr) minmax(320px,.8fr); }
.ops-table-card { padding: 0; }
.ops-table-card .card-heading { margin: 0; padding: 16px 18px 10px; }
.ops-table-legend { align-items: center; color: var(--pl-muted); display: flex; font-size: .67rem; gap: 5px; }
.ops-table-legend span { border-radius: 50%; height: 7px; margin-left: 5px; width: 7px; }
.ops-table-legend .good { background: #22c55e; } .ops-table-legend .warn { background: #f59e0b; } .ops-table-legend .bad { background: #ef476f; }
.ops-table-scroll { overflow-x: auto; }
.ops-table { border-collapse: collapse; font-size: .72rem; min-width: 1120px; width: 100%; }
.ops-table th { background: #f1f4f8; color: #405068; font-size: .67rem; font-weight: 800; padding: 9px 10px; text-align: left; text-transform: uppercase; }
.ops-table td { border-top: 1px solid #edf0f5; cursor: pointer; padding: 10px; vertical-align: middle; }
.ops-table tr:hover td, .ops-table tr.selected td { background: #f8f9ff; }
.ops-table tr.selected td:first-child { box-shadow: inset 3px 0 #6266f1; }
.ops-table td strong, .ops-table td span { display: block; }
.ops-table td strong { color: #172033; font-size: .74rem; }
.ops-table td > span { color: var(--pl-muted); font-size: .64rem; margin-top: 2px; }
.ops-stage-head { align-items: center; display: flex; justify-content: space-between; min-width: 145px; }
.ops-stage-head b { color: #64748b; font-size: .65rem; }
.ops-status { background: #f1f4f8; border-radius: 999px; color: #64748b; display: inline-flex !important; font-size: .64rem !important; font-weight: 800; line-height: 1; margin: 0 !important; padding: 5px 7px; width: max-content; }
.ops-status.success { background: #eafaf0; color: #138a42; } .ops-status.info { background: #eaf7ff; color: #087cae; } .ops-status.warning { background: #fff5df; color: #a86400; } .ops-status.danger { background: #fff0f3; color: #cf264f; }
.ops-progress { background: #edf1f6; border-radius: 999px; height: 4px; margin-top: 6px; overflow: hidden; }
.ops-progress i { background: #6266f1; display: block; height: 100%; }
.ops-row-action { background: #fff; border: 1px solid #ccd5e2; border-radius: 6px; color: #475569; cursor: pointer; font-size: .67rem; font-weight: 800; padding: 6px 8px; }
.ops-detail-card { height: auto; padding: 17px; position: sticky; top: 84px; }
.ops-detail-heading { align-items: flex-start; display: flex; justify-content: space-between; }
.ops-detail-heading .mud-typography-h6 { margin-top: 9px; }
.ops-detail-meta { background: #f8fafc; border: 1px solid #edf1f6; border-radius: 8px; display: grid; gap: 12px; grid-template-columns: 1fr 1fr; margin: 14px 0; padding: 12px; }
.ops-detail-meta span, .ops-detail-meta strong { display: block; }
.ops-detail-meta span { color: var(--pl-muted); font-size: .64rem; }
.ops-detail-meta strong { font-size: .72rem; margin-top: 3px; overflow-wrap: anywhere; }
.ops-impact { color: #4f46e5; }
.ops-stepper { display: grid; gap: 0; }
.ops-step { align-items: start; display: grid; gap: 10px; grid-template-columns: 26px 1fr; min-height: 47px; position: relative; }
.ops-step:not(:last-child)::after { background: #dde3ec; content: ""; height: 22px; left: 12px; position: absolute; top: 27px; width: 1px; }
.ops-step > span { align-items: center; background: #f1f4f8; border: 1px solid #dfe5ed; border-radius: 50%; color: #8a94a6; display: flex; height: 26px; justify-content: center; width: 26px; }
.ops-step.done > span { background: #eafaf0; border-color: #bce9ca; color: #16a34a; } .ops-step.active > span { background: #eef2ff; border-color: #c7c9ff; color: #4f46e5; } .ops-step.error > span { background: #fff0f3; border-color: #ffc3d0; color: #dc3159; }
.ops-step strong, .ops-step small { display: block; } .ops-step strong { font-size: .74rem; } .ops-step small { color: var(--pl-muted); font-size: .64rem; margin-top: 1px; }
.ops-reconcile-mini { border-bottom: 1px solid var(--pl-border); border-top: 1px solid var(--pl-border); display: grid; gap: 8px; grid-template-columns: repeat(3,1fr); margin: 6px 0 14px; padding: 12px 0; }
.ops-reconcile-mini span, .ops-reconcile-mini strong { display: block; } .ops-reconcile-mini span { color: var(--pl-muted); font-size: .62rem; } .ops-reconcile-mini strong { font-size: .69rem; margin-top: 2px; }
.ops-warning-text { color: #b66c00; }
.ops-detail-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.ops-action-message { align-items: center; background: #eefaf3; border: 1px solid #c8ead4; border-radius: 7px; color: #16733b; display: flex; font-size: .69rem; gap: 6px; margin-top: 12px; padding: 8px 9px; }
.ops-action-message.wide { margin: 12px 0; }
.ops-lower-grid { display: grid; gap: 14px; grid-template-columns: 1fr 1fr; margin-top: 14px; }
.ops-coverage-total { color: #172033; font-size: .9rem; }
.ops-coverage-bar { background: #edf1f6; border-radius: 999px; display: flex; height: 9px; margin: 8px 0; overflow: hidden; }
.ops-coverage-bar i { background: #22c55e; width: 95.8%; } .ops-coverage-bar b { background: #f59e0b; width: 2.8%; } .ops-coverage-bar em { background: #ef476f; width: 1.4%; }
.ops-coverage-legend { color: #687386; display: flex; font-size: .66rem; gap: 14px; margin-bottom: 12px; }
.ops-coverage-legend span { align-items: center; display: flex; gap: 4px; } .ops-coverage-legend i { border-radius: 50%; height: 7px; width: 7px; } .ops-coverage-legend .ready { background: #22c55e; } .ops-coverage-legend .late { background: #f59e0b; } .ops-coverage-legend .failed { background: #ef476f; }
.ops-source-rows { display: grid; gap: 7px; }
.ops-source-rows > div { align-items: center; background: #f8fafc; border: 1px solid #edf1f6; border-radius: 7px; display: grid; gap: 9px; grid-template-columns: 31px minmax(125px,1fr) minmax(100px,1.2fr) auto auto; padding: 8px; }
.ops-source-icon { align-items: center; background: #edf1ff; border-radius: 6px; color: #5559da; display: flex; height: 29px; justify-content: center; width: 29px; }
.ops-source-rows strong { font-size: .72rem; } .ops-source-rows strong small { color: var(--pl-muted); display: block; font-size: .61rem; font-weight: 500; margin-top: 1px; }
.ops-source-progress { background: #e6ebf2; border-radius: 99px; height: 5px; overflow: hidden; } .ops-source-progress i { background: #12a3a0; display: block; height: 100%; }
.ops-source-rows b { font-size: .68rem; white-space: nowrap; }
.ops-source-status { border-radius: 999px; font-size: .6rem; font-weight: 800; padding: 4px 6px; white-space: nowrap; } .ops-source-status.success { background: #eafaf0; color: #168843; } .ops-source-status.warning { background: #fff5df; color: #a86400; }
.ops-readiness-card { padding-bottom: 12px; }
.ops-model-row { align-items: center; border-top: 1px solid #edf1f6; display: grid; gap: 10px; grid-template-columns: 34px 1fr auto; padding: 10px 0; }
.ops-model-icon { align-items: center; background: #edf1ff; border-radius: 7px; color: #5559da; display: flex; height: 34px; justify-content: center; width: 34px; } .ops-model-icon.danger { background: #fff0f3; color: #d73057; } .ops-model-icon.success { background: #eafaf0; color: #168843; }
.ops-model-row strong, .ops-model-row small { display: block; } .ops-model-row strong { font-size: .73rem; } .ops-model-row small { color: var(--pl-muted); font-size: .62rem; margin-top: 2px; }
.ops-model-row button { background: #fff; border: 1px solid #d5dce7; border-radius: 6px; color: #526077; font-size: .63rem; font-weight: 800; padding: 6px 7px; }
.ops-model-states { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; } .ops-model-states span { border-radius: 4px; font-size: .57rem; font-weight: 800; padding: 3px 5px; } .ops-model-states .success { background: #eafaf0; color: #168843; } .ops-model-states .warning { background: #fff5df; color: #a86400; } .ops-model-states .danger { background: #fff0f3; color: #cf264f; }
.ops-exception-grid { display: grid; gap: 14px; grid-template-columns: 1fr 1fr; }
.ops-queue-card { height: auto; } .ops-count-badge { border-radius: 999px; font-size: .65rem; font-weight: 800; padding: 5px 8px; } .ops-count-badge.warning { background: #fff5df; color: #a86400; } .ops-count-badge.danger { background: #fff0f3; color: #cf264f; }
.ops-exception-row { align-items: start; border-top: 1px solid #edf1f6; display: grid; gap: 10px; grid-template-columns: 34px minmax(0,1fr) auto; padding: 13px 0; }
.ops-exception-icon { align-items: center; background: #fff7e6; border-radius: 7px; color: #d97706; display: flex; height: 34px; justify-content: center; width: 34px; } .failed .ops-exception-icon { background: #fff0f3; color: #dc3159; }
.ops-exception-row strong, .ops-exception-row small { display: block; } .ops-exception-row strong { font-size: .75rem; } .ops-exception-row small { color: var(--pl-muted); font-size: .64rem; margin-top: 2px; } .ops-exception-row p { color: #58657a; font-size: .69rem; line-height: 1.35; margin: 7px 0 0; }
.ops-age { color: #8a5a09; font-size: .64rem; font-weight: 800; white-space: nowrap; }
.ops-exception-actions { display: flex; gap: 5px; grid-column: 2 / 4; } .ops-exception-actions button { background: #fff; border: 1px solid #d5dce7; border-radius: 6px; color: #526077; font-size: .63rem; font-weight: 800; padding: 6px 8px; }
.ops-reconciliation-grid { display: grid; gap: 14px; }
.ops-recon-flow { align-items: center; display: grid; gap: 9px; grid-template-columns: repeat(7,auto); margin: 18px 0; }
.ops-recon-flow > div { background: #f8fafc; border: 1px solid #e9edf3; border-radius: 8px; min-width: 150px; padding: 13px; } .ops-recon-flow span, .ops-recon-flow strong, .ops-recon-flow small { display: block; } .ops-recon-flow span { color: var(--pl-muted); font-size: .65rem; } .ops-recon-flow strong { font-size: .82rem; margin-top: 3px; } .ops-recon-flow small { color: #667085; font-size: .64rem; margin-top: 2px; } .ops-recon-flow > i { color: #9aa4b4; font-style: normal; }
.ops-recon-summary { border-top: 1px solid var(--pl-border); display: grid; gap: 8px; grid-template-columns: repeat(4,1fr); padding-top: 12px; } .ops-recon-summary span { color: var(--pl-muted); font-size: .67rem; } .ops-recon-summary strong { color: #172033; display: block; font-size: .86rem; }
.ops-window-days { display: grid; gap: 8px; grid-template-columns: repeat(7,1fr); margin-top: 15px; }
.ops-window-days > div { background: #f8fafc; border: 1px solid #e9edf3; border-top: 3px solid #cbd5e1; border-radius: 7px; padding: 10px; } .ops-window-days > div.corrected { border-top-color: #f59e0b; } .ops-window-days > div.new, .ops-window-days > div.current { border-top-color: #22c55e; } .ops-window-days strong, .ops-window-days span, .ops-window-days b, .ops-window-days small { display: block; } .ops-window-days strong { font-size: .72rem; } .ops-window-days span { color: var(--pl-muted); font-size: .61rem; } .ops-window-days b { font-size: .68rem; margin-top: 9px; } .ops-window-days small { color: var(--pl-muted); font-size: .59rem; margin-top: 2px; }
.ops-window-result { align-items: center; background: #eefaf3; border: 1px solid #caebd6; border-radius: 8px; color: #16733b; display: flex; gap: 10px; margin-top: 12px; padding: 11px; } .ops-window-result strong, .ops-window-result span { display: block; } .ops-window-result strong { font-size: .75rem; } .ops-window-result span { color: #4f6d5b; font-size: .66rem; margin-top: 2px; }

@media (max-width: 1500px) { .ops-kpi-grid { grid-template-columns: repeat(4,1fr); } .ops-kpi:last-child { grid-column: auto; } .ops-primary-grid { grid-template-columns: minmax(0,1.8fr) minmax(310px,.75fr); } }
@media (max-width: 1100px) { .ops-primary-grid, .ops-lower-grid, .ops-exception-grid { grid-template-columns: 1fr; } .ops-detail-card { position: static; } .ops-filter-bar, .ops-control-strip { align-items: stretch; flex-direction: column; } .ops-control-actions { justify-content: flex-start; } .ops-filter-fields { flex-wrap: wrap; } }
@media (max-width: 700px) {
    .ops-kpi-grid { grid-template-columns: repeat(2,1fr); }
    .ops-kpi { min-height: 102px; padding: 11px; }
    .ops-kpi-copy strong { font-size: 1.08rem; }
    .ops-filter-bar { padding: 7px; }
    .ops-view-tabs { overflow-x: auto; width: 100%; }
    .ops-view-tabs button { flex: 0 0 auto; white-space: nowrap; }
    .ops-filter-fields { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .ops-filter { min-width: 0; width: 100%; }
    .ops-control-actions { display: grid; }
    .ops-detail-meta, .ops-reconcile-mini, .ops-source-rows > div, .ops-model-row, .ops-recon-summary, .ops-window-days { grid-template-columns: 1fr; }
    .ops-source-progress { width: 100%; }
    .ops-model-row button { justify-self: start; }
    .ops-recon-flow { align-items: stretch; grid-template-columns: 1fr; }
    .ops-recon-flow > i { text-align: center; transform: rotate(90deg); }
    .ops-window-days { grid-template-columns: repeat(2,1fr); }
    .ops-window-result { align-items: flex-start; }
}

#blazor-error-ui {
    background: #fff3cd;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, .2);
    display: none;
    left: 0;
    padding: .6rem 1.25rem .7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

@media (max-width: 900px) {
    .main-content {
        padding: 78px 14px 24px !important;
    }

    .page-heading,
    .card-heading,
    .scenario-product-heading,
    .scenario-story-hero,
    .heading-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .page-heading {
        gap: 12px;
    }

    .topbar-search {
        display: none;
    }

    .app-topbar .mud-chip {
        display: none;
    }

    .signin-card {
        margin-top: 140px;
        padding: 26px 22px 24px;
        top: auto;
        width: 100%;
    }

    .exec-story-card,
    .personal-hero,
    .story-metrics,
    .bridge-grid,
    .scenario-overview-kpis,
    .scenario-execution-strip,
    .scenario-kpi-grid,
    .chart-key-grid,
    .target-rings,
    .compact-bridge,
    .impact-item,
    .task-item,
    .product-mini,
    .sep-tier-row,
    .value-bar-row,
    .ranked-bar-row,
    .movement-row,
    .diverging-row,
    .diverging-row.compact {
        grid-template-columns: 1fr;
    }

    .exec-story-card,
    .personal-hero,
    .dashboard-card,
    .kpi-card,
    .scenario-overview-card {
        padding: 16px;
    }

    .kpi-card {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
        min-height: 0;
    }

    .kpi-row,
    .mix-head,
    .mix-meta,
    .mix-rollup,
    .shift-head,
    .supplier-item {
        align-items: flex-start;
        flex-direction: column;
    }

    .kpi-value {
        font-size: 1.32rem;
    }

    .story-metrics div,
    .scenario-decision-kpis span {
        padding: 10px 12px;
    }

    .formulary-detail-fields {
        grid-template-columns: 1fr;
    }

    .formulary-builder-card,
    .formulary-context-card {
        padding: 14px;
    }

    .commercial-fields {
        grid-template-columns: 1fr;
    }

    .scenario-story-status {
        justify-content: flex-start;
        min-width: 0;
    }

    .scenario-execution-strip {
        overflow: visible;
    }

    .scenario-execution-strip div {
        border-bottom: 1px solid var(--pl-border);
        border-right: 0;
    }

    .scenario-execution-strip div:last-child {
        border-bottom: 0;
    }

    .value-bar-row strong,
    .ranked-bar-row strong,
    .movement-row strong,
    .diverging-deltas,
    .supplier-ask,
    .sep-tier-row b {
        justify-self: start;
        text-align: left;
    }

    .value-bar-row span,
    .ranked-bar-row span,
    .movement-row span,
    .diverging-product strong,
    .chart-key-grid span {
        white-space: normal;
    }

    .line-chart,
    .vertical-chart {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .vertical-bars {
        gap: 24px;
        justify-content: flex-start;
        overflow-x: auto;
        padding: 0 14px;
    }

    .vertical-bar-item {
        min-width: 88px;
    }
}

@media (max-width: 1260px) {
    .heading-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .filter-select {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .main-content {
        padding: 74px 10px 20px !important;
    }

    .mud-typography-h4 {
        font-size: 1.45rem;
        line-height: 1.18;
    }

    .mud-typography-h5 {
        font-size: 1.18rem;
        line-height: 1.22;
    }

    .dashboard-grid {
        margin-top: 8px !important;
    }

    .dashboard-card,
    .kpi-card,
    .formulary-builder-card,
    .formulary-context-card,
    .scenario-support-card {
        border-radius: 7px;
        padding: 13px;
    }

    .exec-story-card,
    .personal-hero {
        gap: 14px;
        padding: 16px 14px;
    }

    .story-metrics strong {
        font-size: 1rem;
    }

    .demo-creds,
    .signin-topbar,
    .brand-block {
        align-items: flex-start;
        flex-direction: column;
        height: auto;
    }

    .brand-block {
        gap: 8px;
        padding: 14px;
    }

    .brand-version {
        margin-left: 0;
    }

    .main-nav {
        height: calc(100vh - 108px);
        padding: 8px 10px 22px;
    }

    .nav-item {
        grid-template-columns: 30px minmax(0, 1fr);
    }

    .nav-pill {
        display: none;
    }

    .opportunity-table .mud-table-root,
    .scenario-library-table .mud-table-root,
    .scenario-product-table .mud-table-root,
    .workbench-table .mud-table-root {
        min-width: 640px;
    }

    .compact-input,
    .scenario-cell-input,
    .scenario-cell-input-wide {
        min-width: 72px;
        max-width: 100%;
    }
}

@media (min-width: 1800px) {
    .main-content {
        padding: 96px 40px 44px !important;
    }

    .dashboard-page {
        max-width: 1760px;
    }

    .dashboard-page.executive-page,
    .formulary-page,
    .scenario-management-page,
    .scenario-editor-page {
        max-width: 1920px;
    }

    .dashboard-card {
        padding: 26px;
    }

    .kpi-card {
        min-height: 148px;
        padding: 26px;
    }

    .dashboard-middle-grid {
        grid-template-columns: minmax(0, 2.45fr) minmax(360px, .85fr);
    }
}

@media (min-width: 2400px) {
    .dashboard-page,
    .dashboard-page.executive-page,
    .formulary-page,
    .scenario-management-page,
    .scenario-editor-page {
        max-width: 2160px;
    }

    .main-content {
        padding-left: 56px !important;
        padding-right: 56px !important;
    }
}

.data-platform-page {
    display: grid;
    gap: 14px;
}

.dp-story-strip {
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, .75fr);
}

.dp-overview-strip {
    align-items: center;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    padding: 12px 16px;
}

.dp-overview-strip .mud-typography-body2 { margin: 2px 0 0; }
.dp-overview-strip-meta { align-items: center; display: flex; gap: 10px; white-space: nowrap; }
.dp-overview-strip-meta span { color: var(--pl-muted); font-size: .72rem; }
.dp-overview-strip-meta strong { color: #172033; font-size: .95rem; }
.dp-dashboard-grid-concise { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dp-priority-run.compact { align-items: center; display: flex; gap: 12px; justify-content: space-between; margin-top: 14px; padding-top: 12px; }
.dp-priority-run.compact .mud-typography-body1 { font-weight: 800; margin-top: 6px; }
.dp-recovery-inline { display: grid; gap: 8px; }
.dp-recovery-inline span { align-items: center; border-bottom: 1px solid var(--pl-border); display: flex; justify-content: space-between; padding: 8px 0; }
.dp-recovery-inline span:last-child { border-bottom: 0; }
.dp-recovery-inline b { color: #172033; font-size: .76rem; }
.dp-recovery-inline small { color: var(--pl-muted); font-size: .7rem; }

.dp-story-card,
.dp-impact-card,
.dp-summary-card,
.dp-list-card,
.dp-run-list-card,
.dp-run-detail-card,
.dp-confirm-card,
.dp-inline-evidence {
    height: auto;
}

.dp-story-card {
    align-items: center;
    background: linear-gradient(135deg, #142033, #25324a);
    border-color: rgba(255, 255, 255, .06);
    color: #fff;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) minmax(0, .95fr);
}

.dp-story-card .eyebrow,
.dp-story-card .text-muted {
    color: rgba(255, 255, 255, .74) !important;
}

.dp-story-card .mud-typography-h6 {
    color: white;
    margin-bottom: 6px;
}

.dp-story-flow {
    align-items: center;
    display: grid;
    gap: 9px;
    grid-template-columns: repeat(9, auto);
    justify-content: flex-end;
}

.dp-story-flow span {
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 999px;
    color: rgba(255, 255, 255, .84);
    font-size: .7rem;
    font-weight: 800;
    padding: 8px 11px;
    white-space: nowrap;
}

.dp-story-flow i {
    border-top: 1px dashed rgba(255, 255, 255, .26);
    display: block;
    width: 16px;
}

.dp-impact-card .mud-typography-h5 {
    color: #111827;
    margin: 2px 0 6px;
}

.dp-impact-breakdown {
    border-top: 1px solid var(--pl-border);
    display: grid;
    gap: 8px;
    margin-top: 14px;
    padding-top: 12px;
}

.dp-impact-breakdown span {
    color: var(--pl-muted);
    font-size: .72rem;
}

.dp-impact-breakdown strong {
    color: #172033;
}

.dp-kpi-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dp-kpi-grid-compact {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dp-kpi-card {
    align-items: stretch;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    gap: 12px;
    min-height: 116px;
    padding: 14px;
    text-align: left;
    width: 100%;
}

.dp-kpi-card.static {
    cursor: default;
}

.dp-kpi-card.neutral {
    background: linear-gradient(180deg, #fff, #fbfcff);
}

.dp-kpi-card.success {
    background: linear-gradient(180deg, #fff, #f5fcf7);
}

.dp-kpi-card.info {
    background: linear-gradient(180deg, #fff, #f5f9ff);
}

.dp-kpi-card.warning {
    background: linear-gradient(180deg, #fff, #fff9ef);
}

.dp-kpi-card.danger {
    background: linear-gradient(180deg, #fff, #fff6f7);
}

.dp-kpi-card:hover {
    border-color: #ccd6e5;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .05);
}

.dp-kpi-icon {
    align-items: center;
    background: #eef2ff;
    border-radius: 8px;
    color: #5559da;
    display: inline-flex;
    height: 40px;
    justify-content: center;
    min-width: 40px;
}

.dp-kpi-card.success .dp-kpi-icon {
    background: #eafaf0;
    color: #168843;
}

.dp-kpi-card.info .dp-kpi-icon {
    background: #ecf7ff;
    color: #0d7ca7;
}

.dp-kpi-card.warning .dp-kpi-icon {
    background: #fff4dd;
    color: #b66c00;
}

.dp-kpi-card.danger .dp-kpi-icon {
    background: #fff0f3;
    color: #cf264f;
}

.dp-kpi-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.dp-kpi-copy small,
.dp-kpi-copy span {
    color: var(--pl-muted);
    font-size: .68rem;
}

.dp-kpi-copy strong {
    color: #111827;
    font-size: 1.18rem;
    line-height: 1.1;
}

.dp-dashboard-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.dp-summary-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 4px;
}

.dp-summary-grid > div,
.dp-priority-meta > div,
.dp-publish-summary > div,
.dp-contract-metrics span,
.dp-trend-list > div {
    background: #f8fafc;
    border: 1px solid #e7ecf3;
    border-radius: 8px;
    padding: 11px 12px;
}

.dp-summary-grid span,
.dp-priority-meta span,
.dp-publish-summary span,
.dp-detail-grid span,
.dp-contract-metrics span,
.dp-trend-list span {
    color: var(--pl-muted);
    display: block;
    font-size: .64rem;
}

.dp-summary-grid strong,
.dp-priority-meta strong,
.dp-publish-summary strong,
.dp-detail-grid strong,
.dp-contract-metrics strong,
.dp-trend-list strong {
    color: #172033;
    display: block;
    font-size: .78rem;
    margin-top: 4px;
}

.dp-summary-grid small,
.dp-trend-list small {
    color: #667085;
    display: block;
    font-size: .64rem;
    line-height: 1.35;
    margin-top: 5px;
}

.dp-priority-run {
    border-top: 1px solid var(--pl-border);
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr) minmax(280px, .85fr);
    margin-top: 14px;
    padding-top: 14px;
}

.dp-priority-meta {
    display: grid;
    gap: 8px;
}

.dp-coverage-head {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: space-between;
}

.dp-coverage-head strong {
    color: #111827;
    font-size: .96rem;
}

.dp-coverage-bar {
    background: #edf1f6;
    border-radius: 999px;
    height: 10px;
    margin: 12px 0 10px;
    overflow: hidden;
}

.dp-coverage-bar.slim {
    height: 7px;
    margin: 8px 0 6px;
}

.dp-coverage-bar i {
    background: linear-gradient(90deg, #12a3a0, #22c55e);
    display: block;
    height: 100%;
}

.dp-coverage-copy span,
.dp-coverage-copy small {
    display: block;
}

.dp-coverage-copy span {
    color: #172033;
    font-size: .74rem;
    font-weight: 700;
}

.dp-coverage-copy small {
    color: var(--pl-muted);
    font-size: .66rem;
    margin-top: 4px;
}

.dp-publish-summary {
    border-top: 1px solid var(--pl-border);
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 12px;
    padding-top: 12px;
}

.dp-list-stack,
.dp-run-list,
.dp-source-list,
.dp-contract-list,
.dp-model-list,
.dp-stream-list,
.dp-trend-list {
    display: grid;
    gap: 10px;
}

.dp-list-row,
.dp-source-row,
.dp-run-row,
.dp-stream-row.buttonlike {
    align-items: start;
    background: #f8fafc;
    border: 1px solid #e7ecf3;
    border-radius: 8px;
    color: inherit;
    cursor: pointer;
    display: grid;
    gap: 10px;
    text-align: left;
    width: 100%;
}

.dp-list-row,
.dp-stream-row.buttonlike {
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 12px;
}

.dp-list-row.compact,
.dp-list-row.noninteractive {
    cursor: default;
}

.dp-list-row.noninteractive {
    background: #fff;
}

.dp-list-row:hover,
.dp-source-row:hover,
.dp-run-row:hover,
.dp-stream-row.buttonlike:hover,
.dp-list-row.selected,
.dp-source-row.selected,
.dp-run-row.selected {
    border-color: #cfd8e6;
}

.dp-list-row p,
.dp-source-row p {
    color: #58657a;
    font-size: .68rem;
    line-height: 1.35;
    margin: 6px 0 0;
}

.dp-list-row strong,
.dp-source-row strong {
    color: #172033;
    display: block;
    font-size: .76rem;
}

.dp-list-row small,
.dp-source-row small {
    color: var(--pl-muted);
    display: block;
    font-size: .63rem;
    margin-top: 3px;
}

.dp-list-pill {
    border-radius: 999px;
    font-size: .62rem;
    font-weight: 800;
    line-height: 1;
    padding: 6px 8px;
    white-space: nowrap;
}

.dp-list-pill.success {
    background: #eafaf0;
    color: #168843;
}

.dp-list-pill.info {
    background: #ebf7ff;
    color: #087cae;
}

.dp-list-pill.warning {
    background: #fff4dd;
    color: #a86400;
}

.dp-list-pill.danger {
    background: #fff0f3;
    color: #cf264f;
}

.dp-confirm-card,
.dp-inline-evidence {
    display: grid;
    gap: 12px;
}

.dp-confirm-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.dp-filter-bar {
    align-items: center;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    padding: 10px 12px;
}

.dp-tab-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.dp-tab-strip button {
    background: #fff;
    border: 1px solid #d8e0ec;
    border-radius: 999px;
    color: #344054;
    cursor: pointer;
    font-size: .72rem;
    font-weight: 800;
    padding: 8px 12px;
}

.dp-tab-strip button.active,
.dp-tab-strip button:hover {
    background: #eef2ff;
    border-color: #6266f1;
    color: #4f46e5;
}

.dp-filter-copy {
    font-size: .68rem;
}

.dp-control-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(0, 1.3fr) minmax(360px, .9fr);
}

.dp-run-list-card,
.dp-run-detail-card {
    min-width: 0;
}

.dp-run-list {
    gap: 8px;
}

.dp-run-row {
    grid-template-columns:
        minmax(110px, 1.1fr)
        minmax(120px, 1.1fr)
        minmax(104px, .9fr)
        minmax(120px, 1fr)
        minmax(110px, .9fr)
        minmax(96px, .75fr)
        minmax(96px, .8fr)
        minmax(116px, 1fr);
    padding: 12px;
}

.dp-run-row.selected {
    background: #f7f8ff;
    box-shadow: inset 3px 0 0 #6266f1;
}

.dp-run-cell {
    min-width: 0;
}

.dp-run-cell strong,
.dp-run-cell small {
    display: block;
}

.dp-run-cell strong {
    color: #172033;
    font-size: .73rem;
}

.dp-run-cell small {
    color: var(--pl-muted);
    font-size: .61rem;
    line-height: 1.32;
    margin-top: 3px;
}

.dp-run-cell.stage .ops-progress {
    margin-top: 8px;
}

.dp-run-cell.action {
    justify-self: stretch;
}

.dp-next-action {
    color: #4f46e5;
    display: block;
    font-size: .67rem;
    font-weight: 800;
}

.dp-stale-text {
    color: #b66c00 !important;
}

.dp-detail-header {
    align-items: flex-start;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.dp-detail-grid,
.dp-field-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 14px;
}

.dp-field-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dp-detail-grid > div {
    background: #f8fafc;
    border: 1px solid #e7ecf3;
    border-radius: 8px;
    min-width: 0;
    padding: 11px 12px;
}

.dp-detail-grid strong {
    overflow-wrap: anywhere;
}

.dp-command-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.dp-step-list {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.dp-step-row {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #e7ecf3;
    border-left: 4px solid #d6deea;
    border-radius: 8px;
    display: grid;
    gap: 10px;
    grid-template-columns: 92px minmax(0, 1fr);
    padding: 10px 12px;
}

.dp-step-row.success {
    border-left-color: #22c55e;
}

.dp-step-row.info {
    border-left-color: #6266f1;
}

.dp-step-row.danger {
    border-left-color: #ef476f;
}

.dp-step-row span {
    color: var(--pl-muted);
    font-size: .67rem;
    font-weight: 800;
    text-transform: uppercase;
}

.dp-step-row strong {
    color: #172033;
    font-size: .71rem;
    line-height: 1.35;
}

.dp-reconcile-card {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 14px;
}

.dp-reconcile-card.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dp-reconcile-card > div {
    background: #f8fafc;
    border: 1px solid #e7ecf3;
    border-radius: 8px;
    padding: 11px 12px;
}

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

.dp-reconcile-card span {
    color: var(--pl-muted);
    font-size: .63rem;
}

.dp-reconcile-card strong {
    color: #172033;
    font-size: .77rem;
    margin-top: 4px;
}

.dp-reconcile-card small {
    color: #667085;
    font-size: .62rem;
    line-height: 1.3;
    margin-top: 4px;
}

.dp-detail-panels {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 14px;
}

.dp-stream-row {
    align-items: start;
    display: grid;
    gap: 10px;
    grid-template-columns: 76px minmax(0, 1fr);
}

.dp-stream-time {
    color: #667085;
    font-size: .62rem;
    font-weight: 800;
    line-height: 1.3;
}

.dp-stream-row strong,
.dp-stream-row small {
    display: block;
}

.dp-stream-row strong {
    color: #172033;
    font-size: .72rem;
}

.dp-stream-row small {
    color: var(--pl-muted);
    font-size: .63rem;
    line-height: 1.35;
    margin-top: 3px;
}

.dp-evidence-note {
    background: #f8fafc;
    border: 1px solid #e7ecf3;
    border-radius: 8px;
    display: grid;
    gap: 4px;
    margin-top: 14px;
    padding: 12px;
}

.dp-evidence-note strong,
.dp-evidence-note span {
    display: block;
}

.dp-evidence-note strong {
    color: #172033;
    font-size: .72rem;
}

.dp-evidence-note span {
    color: #58657a;
    font-size: .67rem;
    line-height: 1.4;
}

.dp-source-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 12px;
}

.dp-source-row.selected {
    background: #f7f8ff;
    box-shadow: inset 3px 0 0 #6266f1;
}

.dp-source-main,
.dp-source-side {
    min-width: 0;
}

.dp-source-side {
    text-align: right;
}

.dp-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.dp-chip-toggle {
    background: #fff;
    border: 1px solid #d8e0ec;
    border-radius: 999px;
    color: #344054;
    cursor: pointer;
    font-size: .68rem;
    font-weight: 800;
    padding: 7px 10px;
}

.dp-chip-toggle.selected,
.dp-chip-toggle:hover {
    background: #eef2ff;
    border-color: #6266f1;
    color: #4f46e5;
}

.dp-contract-row,
.dp-model-card {
    background: #f8fafc;
    border: 1px solid #e7ecf3;
    border-radius: 8px;
    display: grid;
    gap: 9px;
    padding: 12px;
}

.dp-contract-row strong,
.dp-model-card strong {
    color: #172033;
}

.dp-contract-row small,
.dp-model-card small {
    color: var(--pl-muted);
    font-size: .63rem;
}

.dp-contract-metrics {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dp-window-grid {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.dp-window-day {
    background: #f8fafc;
    border: 1px solid #e7ecf3;
    border-top: 3px solid #d8e0ec;
    border-radius: 8px;
    display: grid;
    gap: 4px;
    padding: 11px;
}

.dp-window-day.warning {
    border-top-color: #f59e0b;
}

.dp-window-day.success {
    border-top-color: #22c55e;
}

.dp-window-day strong {
    color: #172033;
    font-size: .72rem;
}

.dp-window-day small,
.dp-window-day span,
.dp-window-day p {
    color: var(--pl-muted);
    font-size: .61rem;
    line-height: 1.34;
    margin: 0;
}

.dp-model-top {
    align-items: start;
    display: flex;
    gap: 10px;
    justify-content: space-between;
}

.dp-model-card p {
    color: #58657a;
    font-size: .68rem;
    line-height: 1.4;
    margin: 0;
}

.dp-inline-evidence {
    margin-top: 14px;
    padding: 16px;
}

.dp-evidence-code {
    background: #101827;
    border-radius: 8px;
    color: #dce6f5;
    font-size: .68rem;
    overflow-x: auto;
    padding: 12px;
}

.dp-evidence-code pre {
    margin: 0;
    white-space: pre-wrap;
}

.dp-trend-list {
    margin-top: 2px;
}

@media (max-width: 1500px) {
    .dp-kpi-grid,
    .dp-kpi-grid-compact {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .dp-run-row {
        grid-template-columns:
            repeat(4, minmax(0, 1fr))
            repeat(4, minmax(0, .9fr));
    }
}

@media (max-width: 1180px) {
    .dp-story-strip,
    .dp-control-grid,
    .dp-detail-panels,
    .dp-priority-run,
    .dp-reconcile-card.four,
    .dp-summary-grid,
    .dp-publish-summary,
    .dp-contract-metrics,
    .dp-detail-grid,
    .dp-field-grid {
        grid-template-columns: 1fr;
    }

    .dp-run-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dp-story-flow {
        grid-template-columns: 1fr;
        justify-content: stretch;
    }

    .dp-story-flow i {
        display: none;
    }
}

@media (max-width: 900px) {
    .dp-overview-strip { align-items: flex-start; flex-direction: column; }
    .dp-overview-strip-meta { justify-content: space-between; width: 100%; }
    .dp-dashboard-grid-concise { grid-template-columns: 1fr; }
    .dp-kpi-grid,
    .dp-kpi-grid-compact,
    .dp-window-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dp-filter-bar,
    .dp-detail-header,
    .dp-model-top {
        align-items: stretch;
        flex-direction: column;
    }

    .dp-tab-strip {
        overflow-x: auto;
        width: 100%;
    }

    .dp-tab-strip button {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .dp-command-row,
    .dp-confirm-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 700px) {
    .dp-kpi-grid,
    .dp-kpi-grid-compact,
    .dp-run-row,
    .dp-window-grid {
        grid-template-columns: 1fr;
    }

    .dp-kpi-card {
        min-height: 0;
    }

    .dp-list-row,
    .dp-source-row,
    .dp-stream-row.buttonlike {
        grid-template-columns: 1fr;
    }

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

    .dp-source-side {
        text-align: left;
    }

    .dp-story-card {
        grid-template-columns: 1fr;
    }
}