body {
    overflow-x: hidden;
    background: #f4f7f6;
    color: #10223f;
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 13px;
}

#sidebar-wrapper {
    width: 236px;
    min-height: 100vh;
    margin-left: -15rem;
    transition: margin .25s ease-out;
    background: #fafcfb !important;
    border-right: 1px solid #dfe8e4 !important;
}

#sidebar-wrapper .sidebar-heading {
    padding: 1rem 1.1rem 0.8rem;
    color: #10223f !important;
    font-size: 1.05rem;
    font-weight: 800;
}

#sidebar-wrapper .list-group {
    width: 100%;
}

.sidebar-service-group {
    padding: 0.35rem 0.65rem 0.55rem;
    border-bottom: 1px solid #edf3f0;
}

.sidebar-service-group--foundation {
    background: #f4f7f6;
}

.sidebar-service-heading {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.45rem 0.45rem 0.6rem;
}

.sidebar-service-heading > span {
    display: grid;
    flex: 0 0 1.7rem;
    width: 1.7rem;
    height: 1.7rem;
    place-items: center;
    border: 1px solid #c9d9d1;
    border-radius: 0.5rem;
    color: #14845f;
    font-size: 0.68rem;
    font-weight: 800;
}

.sidebar-service-heading strong,
.sidebar-service-heading small {
    display: block;
}

.sidebar-service-heading strong {
    color: #263c55;
    font-size: 0.78rem;
    line-height: 1.1;
}

.sidebar-service-heading small {
    margin-top: 0.2rem;
    color: #67788d;
    font-size: 0.62rem;
    line-height: 1.2;
}

#sidebar-wrapper .sidebar-service-group .list-group-item {
    margin: 0.12rem 0;
    padding: 0.52rem 0.65rem;
    border: 0;
    border-radius: 0.55rem;
    color: #34465c !important;
    font-size: 0.75rem;
}

#sidebar-wrapper .sidebar-service-group .list-group-item i {
    width: 1.25rem;
    color: #7c9a8b;
}

#sidebar-wrapper .sidebar-service-group .list-group-item:hover {
    background: #eff5f2 !important;
    color: #0b694b !important;
}

#sidebar-wrapper .sidebar-service-group .list-group-item.active {
    background: #e5f3ed !important;
    color: #0b694b !important;
    box-shadow: inset 3px 0 #14845f;
}

#sidebar-wrapper .sidebar-service-group--foundation .list-group-item {
    color: rgba(255, 255, 255, 0.58) !important;
    font-size: 0.74rem;
}

.sidebar-section-label {
    padding: 1rem 1.2rem 0.35rem;
    color: #67788d;
    font-size: 0.67rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

#page-content-wrapper {
    min-width: 100vw;
}

#page-content-wrapper > .navbar {
    min-height: 58px;
    background: #fff !important;
    border-color: #dfe8e4 !important;
}

#page-content-wrapper > .navbar .btn-primary {
    border-color: #dfe8e4;
    background: #fff;
    color: #34465c;
}

#page-content-wrapper > .navbar .nav-link {
    color: #34465c;
    font-size: 0.78rem;
}

#wrapper.toggled #sidebar-wrapper {
    margin-left: 0;
}

#wrapper.toggled #page-content-wrapper {
    min-width: calc(100vw - 236px);
    width: calc(100vw - 236px);
}


@media (min-width: 768px) {
    #sidebar-wrapper {
        margin-left: 0;
    }

    #page-content-wrapper {
        min-width: 0;
        width: 100%;
    }

    #wrapper.toggled #sidebar-wrapper {
        margin-left: -15rem;
    }
}

.card-icon {
    font-size: 2.5rem;
    opacity: 0.3;
}

.prototype-banner {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    align-items: flex-start;
    padding: 1.25rem 1.5rem;
    border-radius: 1rem;
    background: linear-gradient(135deg, #123524 0%, #1f5138 55%, #e9d8a6 180%);
    color: #fff;
    box-shadow: 0 18px 50px rgba(18, 53, 36, 0.18);
}

.prototype-banner__eyebrow {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    opacity: 0.75;
    margin-bottom: 0.4rem;
}

.prototype-banner__title {
    font-size: 1.35rem;
    font-weight: 700;
}

.prototype-banner__copy {
    max-width: 44rem;
    color: rgba(255, 255, 255, 0.88);
}

.prototype-banner__meta {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.contract-tile,
.ui-shell-card {
    height: 100%;
    padding: 1rem;
    border-radius: 0.9rem;
    background: #fcfbf7;
    border: 1px solid rgba(26, 71, 52, 0.12);
}

.contract-tile--warning {
    background: #fff8e8;
    border-color: rgba(179, 111, 1, 0.18);
}

.contract-tile__label,
.ui-shell-card__label,
.integration-note__title {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #5f6f65;
    margin-bottom: 0.4rem;
}

.contract-tile__value {
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
    color: #123524;
    margin-bottom: 0.45rem;
}

.ui-shell-card__copy {
    color: #33433a;
}

.prototype-checklist {
    display: grid;
    gap: 0.65rem;
    color: #2c4136;
}

.prototype-checklist i {
    color: #2d7a54;
    margin-right: 0.45rem;
}

.integration-note {
    padding-bottom: 0.9rem;
    margin-bottom: 0.9rem;
    border-bottom: 1px solid rgba(26, 71, 52, 0.08);
}

.detail-erd-card {
    overflow: hidden;
    border: 1px solid rgba(26, 71, 52, 0.13);
}

.detail-erd-card .card-header {
    border-bottom: 1px solid rgba(26, 71, 52, 0.1);
}

.detail-erd-canvas {
    overflow: auto;
    background:
        linear-gradient(rgba(26, 71, 52, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(26, 71, 52, 0.04) 1px, transparent 1px),
        #fcfbf7;
    background-size: 24px 24px;
    min-height: 24rem;
    padding: 1.25rem;
}

.detail-erd-canvas .mermaid {
    min-width: 58rem;
    margin: 0;
}

.readiness-kpi {
    height: 100%;
    padding: 1.15rem;
    border: 1px solid rgba(26, 71, 52, 0.14);
    border-radius: 1rem;
    background: #fffdf8;
    box-shadow: 0 8px 24px rgba(18, 53, 36, 0.06);
}

.readiness-kpi--success { border-top: 4px solid #2d7a54; }
.readiness-kpi--danger { border-top: 4px solid #b44b42; }

.readiness-kpi__label,
.readiness-heading__eyebrow {
    color: #63776b;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.readiness-kpi__value {
    color: #123524;
    font-size: 2.2rem;
    font-weight: 750;
    line-height: 1.2;
}

.readiness-tabs { gap: 0.5rem; }
.readiness-tabs .nav-link { color: #315543; border: 1px solid rgba(26, 71, 52, 0.16); }
.readiness-tabs .nav-link.active { background: #1f5138; border-color: #1f5138; }

.readiness-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.readiness-heading h3 { color: #173e2c; margin: 0.2rem 0 0; }
.readiness-definition dt { color: #315543; }

.state-flow {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.45rem;
    color: #405c4c;
    font-size: 0.85rem;
}

.state-flow span {
    padding: 0.35rem 0.55rem;
    border: 1px solid rgba(26, 71, 52, 0.2);
    border-radius: 999px;
    background: #f8faf7;
}

.state-flow .state-flow__approved { background: #e5f4ea; border-color: #75b98d; }
.state-flow .state-flow__locked { background: #183d2b; border-color: #183d2b; color: #fff; }

.readiness-code {
    padding: 1rem;
    overflow-x: auto;
    border-radius: 0.75rem;
    background: #173e2c;
    color: #d9f2e2;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: 0.83rem;
    line-height: 1.75;
}

.readiness-signoff {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    align-items: center;
    padding: 1.25rem;
    border: 1px solid rgba(26, 71, 52, 0.18);
    border-radius: 1rem;
    background: linear-gradient(120deg, #edf7ef, #fffdf5);
}

.work-hero {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    align-items: center;
    padding: 2rem;
    border-radius: 1.25rem;
    background: radial-gradient(circle at 88% 18%, rgba(238, 212, 135, 0.7), transparent 28%), linear-gradient(130deg, #173e2c, #2d7353);
    box-shadow: 0 20px 45px rgba(18, 53, 36, 0.17);
    color: #fff;
}

.work-hero__eyebrow,
.work-help-card__eyebrow,
.capture-result__eyebrow,
.report-readiness-card__owner {
    display: block;
    margin-bottom: 0.4rem;
    color: inherit;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    opacity: 0.78;
    text-transform: uppercase;
}

.work-hero h1 { margin-bottom: 0.5rem; font-size: clamp(1.8rem, 4vw, 2.7rem); }
.work-hero p { max-width: 42rem; margin: 0; color: rgba(255, 255, 255, 0.85); font-size: 1.05rem; }
.work-hero__button { align-self: center; white-space: nowrap; }

.work-stat {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    height: 100%;
    padding: 1rem;
    border: 1px solid rgba(26, 71, 52, 0.13);
    border-radius: 0.9rem;
    background: #fffdf9;
}

.work-stat i { color: #28714f; font-size: 1.5rem; }
.work-stat strong, .work-stat span { display: block; }
.work-stat strong { color: #183d2b; }
.work-stat span { color: #68756d; font-size: 0.85rem; }

.task-card, .inbox-card {
    display: flex;
    gap: 1rem;
    padding: 1.15rem;
    border: 1px solid rgba(26, 71, 52, 0.13);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 7px 20px rgba(18, 53, 36, 0.05);
}

.task-card--urgent { border-left: 5px solid #d39a20; }
.task-card__icon, .inbox-card__icon {
    display: grid;
    flex: 0 0 2.7rem;
    width: 2.7rem;
    height: 2.7rem;
    place-items: center;
    border-radius: 0.85rem;
    background: #eaf5ed;
    color: #28714f;
    font-size: 1.25rem;
}

.task-card__body, .inbox-card__body { min-width: 0; flex: 1; }
.task-card h4, .inbox-card h3 { margin: 0; color: #183d2b; font-size: 1.05rem; }
.task-card p, .inbox-card p { margin: 0.35rem 0 0.75rem; color: #58675f; }
.task-card__due { align-self: start; padding: 0.2rem 0.5rem; border-radius: 999px; background: #fff5d8; color: #7a5510; font-size: 0.76rem; font-weight: 700; }

.work-help-card {
    height: 100%;
    padding: 1.35rem;
    border-radius: 1rem;
    background: #eff7f0;
    border: 1px solid rgba(26, 71, 52, 0.13);
}

.work-help-card__eyebrow { color: #376d50; opacity: 1; }
.work-help-card h4 { color: #183d2b; font-size: 1.2rem; }
.work-help-step { display: flex; gap: 0.7rem; align-items: flex-start; margin-top: 1rem; }
.work-help-step span { display: grid; flex: 0 0 1.5rem; height: 1.5rem; place-items: center; border-radius: 50%; background: #28714f; color: #fff; font-size: 0.76rem; font-weight: 700; }
.work-help-step p { margin: 0.1rem 0 0; color: #465e50; font-size: 0.9rem; }

.capture-choices { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.85rem; }
.capture-choice { min-height: 11rem; padding: 1.1rem; text-align: left; border: 1px solid rgba(26, 71, 52, 0.15); border-radius: 1rem; background: #fffdf9; color: #294837; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.capture-choice:hover, .capture-choice--active { transform: translateY(-2px); border-color: #3d8b64; box-shadow: 0 12px 24px rgba(18, 53, 36, 0.1); }
.capture-choice--active { background: #edf7ef; }
.capture-choice i, .capture-choice strong, .capture-choice span { display: block; }
.capture-choice i { margin-bottom: 1rem; color: #28714f; font-size: 1.65rem; }
.capture-choice strong { margin-bottom: 0.45rem; }
.capture-choice span { color: #65736a; font-size: 0.84rem; }

.upload-panel, .capture-result { padding: clamp(1.25rem, 4vw, 2.25rem); border: 1px solid rgba(26, 71, 52, 0.15); border-radius: 1.25rem; background: #fff; box-shadow: 0 12px 32px rgba(18, 53, 36, 0.06); }
.upload-dropzone { display: flex; width: 100%; min-height: 13rem; flex-direction: column; align-items: center; justify-content: center; gap: 0.55rem; border: 2px dashed #8fbaa1; border-radius: 1rem; background: #f2f9f3; color: #28543b; }
.upload-dropzone i { font-size: 2.2rem; }
.upload-dropzone span { color: #66776d; font-size: 0.88rem; }
.capture-result__eyebrow { color: #43795c; opacity: 1; }
.capture-result h3 { color: #183d2b; }
.capture-result > p { color: #5b6b61; }
.capture-result__top { display: flex; justify-content: space-between; gap: 1rem; }
.confidence-pill { align-self: start; padding: 0.4rem 0.65rem; border-radius: 999px; background: #e2f4e8; color: #216540; font-size: 0.8rem; font-weight: 700; white-space: nowrap; }
.capture-field { height: 100%; padding: 0.9rem; border-radius: 0.75rem; background: #f5f8f5; }
.capture-field span, .capture-field strong { display: block; }
.capture-field span { color: #6b786f; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; }
.capture-field strong { margin-top: 0.3rem; color: #1d4431; }
.column-match { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; padding: 0.85rem; border-radius: 0.75rem; background: #f5f8f5; font-size: 0.85rem; }
.column-match span { padding: 0.3rem 0.45rem; border-radius: 0.35rem; background: #fff; border: 1px solid #d9e6dc; }
.column-match strong { color: #216540; }

.inbox-card__icon--document { background: #fff3d6; color: #987013; }
.inbox-card__icon--supplier { background: #edf0fb; color: #3d5ca8; }
.inbox-card small { color: #65736a; }

.report-readiness-card { height: 100%; padding: 1.35rem; border: 1px solid rgba(26, 71, 52, 0.14); border-radius: 1rem; background: #fff; box-shadow: 0 8px 22px rgba(18, 53, 36, 0.06); }
.report-readiness-card__owner { color: #527a63; opacity: 1; }
.report-readiness-card h3 { color: #183d2b; font-size: 1.12rem; }
.report-readiness-card__percent { color: #1d5d40; font-size: 1.7rem; }
.report-gap-list { margin-top: 1.2rem; padding: 0.85rem 0; border-top: 1px solid #edf0ed; border-bottom: 1px solid #edf0ed; color: #526158; font-size: 0.88rem; }
.report-gap-list > span { display: block; margin-bottom: 0.4rem; color: #6b786f; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.report-gap-list i { color: #28714f; }
.assurance-callout { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.25rem; border-radius: 1rem; background: #e8eeeb; color: #31453a; }
.assurance-callout > i { font-size: 1.45rem; }
.assurance-callout div { flex: 1; }
.assurance-callout strong, .assurance-callout span { display: block; }
.assurance-callout span { color: #607067; font-size: 0.85rem; }

.studio-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 2rem;
    border-radius: 1.25rem;
    background: radial-gradient(circle at 84% 22%, rgba(236, 203, 126, 0.72), transparent 30%), linear-gradient(135deg, #1d4232, #376e51);
    color: #fff;
}

.studio-hero__eyebrow { display: block; margin-bottom: 0.35rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; opacity: 0.75; text-transform: uppercase; }
.studio-hero h1 { margin: 0; font-size: clamp(1.9rem, 4vw, 2.8rem); }
.studio-hero p { margin: 0.45rem 0 0; color: rgba(255, 255, 255, 0.84); }

.studio-progress { display: flex; align-items: center; gap: 0.55rem; overflow-x: auto; color: #708076; font-size: 0.82rem; white-space: nowrap; }
.studio-progress span { display: inline-flex; align-items: center; gap: 0.35rem; }
.studio-progress b { display: grid; width: 1.5rem; height: 1.5rem; place-items: center; border: 1px solid #b7c7ba; border-radius: 50%; font-size: 0.7rem; }
.studio-progress .active { color: #255b3f; font-weight: 700; }
.studio-progress .active b { background: #28714f; border-color: #28714f; color: #fff; }

.studio-library-head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: 1rem; }
.palette-purpose-label { display: block; margin-bottom: 0.3rem; color: #28714f; font-size: 0.62rem; font-weight: 800; letter-spacing: 0.12em; }
.palette-purpose-label--side { margin-bottom: 0.55rem; }
.palette-purpose-label--dock { margin-bottom: 0.45rem; }
.palette-zone-label { display: flex; align-items: center; margin: 0.8rem 0 0.45rem; color: #31553f; }
.palette-zone-label span { font-size: 0.72rem; font-weight: 750; }
.palette-zone-label span i { margin-right: 0.3rem; color: #28714f; }
.palette-zone-label small { color: #78857b; font-size: 0.63rem; text-align: right; }
.palette-zone-label--results { margin-top: 1.15rem; }
.palette-help-icon { padding: 0; border: 0; background: transparent; color: #28714f; line-height: 1; }
.palette-help-icon:hover { color: #173e2c; }
.material-palette-row > .palette-main-column { flex: 0 0 100%; max-width: 100%; width: 100%; }
.material-palette-row { display: block; }
.material-palette-row > .palette-main-column { padding-right: 0; padding-left: 0; }
.material-palette-row > .palette-main-column .material-palette-table-wrap { width: 100%; }
.material-product-grid--table { display: block; }
.material-palette-table-wrap { overflow-x: auto; border: 1px solid #dbe6dc; border-radius: 0.75rem; background: #fff; }
.material-palette-table { min-width: 62rem; font-size: 0.73rem; }
.material-palette-table th, .material-palette-table td { padding: 0.7rem 0.75rem; border-color: #e8eee9; }
.material-palette-table thead th { color: #708077; background: #f8faf7; font-size: 0.62rem; text-transform: uppercase; white-space: nowrap; }
.material-palette-table tbody tr.is-selected { background: #eef7ef; }
.material-palette-table tbody tr:hover { background: #f5f9f4; }
.material-palette-table td strong, .material-palette-table td small { display: block; }
.material-palette-table td small { margin-top: 0.15rem; color: #87938a; font-size: 0.62rem; }
.palette-number { color: #214b34; font-variant-numeric: tabular-nums; white-space: nowrap; }
.palette-table-actions { display: flex; gap: 0.35rem; align-items: center; }
.material-palette-table tbody tr[data-material-id] { cursor: pointer; }
.material-palette-group { cursor: pointer; }
.material-palette-group th { padding: 0.55rem 0.75rem; background: #f1f7f1; color: #31553f; }
.material-palette-group th > span { display: flex; gap: 0.45rem; align-items: center; }
.material-palette-group strong, .material-palette-group small { display: block; }
.material-palette-group strong { font-size: 0.72rem; }
.material-palette-group small { margin-left: 0.2rem; color: #7e8b82; font-size: 0.62rem; font-weight: 400; }
.material-palette-group.is-collapsed th { background: #fbfcf9; }
.candidate-wizard { display: grid; gap: 1rem; }
.candidate-wizard__hero { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; padding: 0.2rem 0 0.85rem; border-bottom: 1px solid #e2eae3; }
.candidate-wizard__hero h3 { margin: 0.25rem 0; color: #173e2c; }
.candidate-wizard__hero p { margin: 0; color: #718077; font-size: 0.78rem; }
.candidate-wizard__facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.55rem; }
.candidate-wizard__facts span { padding: 0.65rem 0.7rem; border: 1px solid #dce7dd; border-radius: 0.6rem; background: #f8fbf7; color: #31553f; font-size: 0.72rem; }
.candidate-wizard__facts b { display: block; margin-bottom: 0.15rem; color: #7a887e; font-size: 0.6rem; text-transform: uppercase; }
.candidate-wizard__section-head { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.candidate-wizard__section-head strong, .candidate-wizard__section-head small { display: block; }
.candidate-wizard__section-head strong { color: #31553f; font-size: 0.85rem; }
.candidate-wizard__section-head small { margin-top: 0.15rem; color: #7a887e; font-size: 0.68rem; }
.candidate-supplier-table { min-width: 48rem; font-size: 0.74rem; }
.candidate-supplier-table th, .candidate-supplier-table td { padding: 0.72rem 0.75rem; border-color: #e6eee7; }
.candidate-supplier-table td strong, .candidate-supplier-table td small { display: block; }
.candidate-supplier-table td small { margin-top: 0.14rem; color: #87938a; font-size: 0.62rem; }
.studio-library-head h2 { margin: 0.25rem 0; color: #173e2c; font-size: 1.5rem; }
.studio-library-head p { max-width: 42rem; margin: 0; color: #65736a; }
.studio-library-head .palette-help-icon { margin-left: 0.35rem; vertical-align: middle; }
.concept-workspace-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.55rem; padding: 0.35rem; border: 1px solid #d9e5da; border-radius: 0.85rem; background: #f4f8f3; }
.concept-workspace-tab { display: flex; gap: 0.65rem; align-items: center; padding: 0.75rem 0.85rem; border: 1px solid transparent; border-radius: 0.65rem; background: transparent; color: #557060; text-align: left; }
.concept-workspace-tab:hover { background: #fff; color: #31553f; }
.concept-workspace-tab.is-active { border-color: #c9dfcd; background: #fff; color: #1f5138; box-shadow: 0 4px 12px rgba(18, 53, 36, 0.06); }
.concept-workspace-tab__number { display: grid; width: 1.9rem; height: 1.9rem; flex: 0 0 1.9rem; place-items: center; border-radius: 50%; background: #e4eee4; color: #52715b; font-size: 0.67rem; font-weight: 800; }
.concept-workspace-tab.is-active .concept-workspace-tab__number { background: #28714f; color: #fff; }
.concept-workspace-tab strong, .concept-workspace-tab small { display: block; }
.concept-workspace-tab strong { font-size: 0.8rem; }
.concept-workspace-tab small { margin-top: 0.14rem; color: #7a887e; font-size: 0.65rem; line-height: 1.3; }
.concept-workspace-tab.is-active small { color: #5f7566; }
.studio-filter-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.4rem; }
.studio-filter-row--library { justify-content: flex-start; align-items: center; }

.material-search {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.45rem 0.45rem 0.45rem 1rem;
    border: 1px solid #d8e5da;
    border-radius: 0.85rem;
    background: #fff;
    box-shadow: 0 5px 15px rgba(18, 53, 36, 0.04);
}

.material-search > i { color: #477760; }
.material-search .form-control { border: 0; box-shadow: none; }
.material-result-count { margin-left: auto; color: #718077; font-size: 0.8rem; }
.material-advanced-filters { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.65rem; padding: 0.8rem; border: 1px solid #e0e8e1; border-radius: 0.85rem; background: #f8faf7; }
.material-advanced-filters label { color: #5c6f63; font-size: 0.67rem; font-weight: 750; letter-spacing: 0.04em; text-transform: uppercase; }
.material-advanced-filters select { margin-top: 0.3rem; color: #284b38; text-transform: none; }

.material-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.material-card--grid { display: flex; min-width: 0; flex-direction: column; padding: 0; overflow: hidden; }
.material-card--grid .material-card__main { padding: 1rem 1rem 0; }
.material-card--grid .material-card__category { max-width: 13rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.material-card--grid .material-card__summary { min-height: 2.7rem; padding: 0 1rem; }
.material-card--grid .material-metrics { margin: 0.8rem 1rem; }
.material-card--grid .material-metrics div { padding: 0.58rem; }
.material-card--grid .material-metrics strong { font-size: 0.87rem; }
.material-card--grid .material-card__footer { margin-top: auto; padding: 0.75rem 1rem; border-top: 1px solid #edf1ed; }

.material-swatch {
    position: relative;
    display: flex;
    width: 100%;
    height: 8.5rem;
    align-items: flex-end;
    justify-content: space-between;
    padding: 0.9rem 1rem;
    border: 0;
    background: linear-gradient(145deg, #d6ddd5, #677a6e);
    color: #fff;
    overflow: hidden;
}

.material-swatch::after { position: absolute; width: 12rem; height: 12rem; right: -3rem; top: -5rem; border: 1px solid rgba(255, 255, 255, 0.33); border-radius: 50%; content: ""; }
.material-swatch span { position: relative; z-index: 1; padding: 0.25rem 0.45rem; border-radius: 0.35rem; background: rgba(15, 41, 29, 0.32); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.material-swatch i { position: relative; z-index: 1; font-size: 2rem; opacity: 0.9; }
.material-swatch--structure { background: linear-gradient(145deg, #6b746e, #283f35); }
.material-swatch--interiors { background: linear-gradient(145deg, #b89265, #6f503c); }
.material-swatch:hover { filter: brightness(1.06); }

.material-empty { grid-column: 1 / -1; padding: 3rem 1rem; border: 1px dashed #b7cdbb; border-radius: 1rem; color: #63776b; text-align: center; }
.material-empty i { display: block; margin-bottom: 0.5rem; color: #4d8a63; font-size: 2rem; }
.material-empty h3 { color: #254b37; font-size: 1.15rem; }

.material-card { padding: 1.2rem; border: 1px solid rgba(26, 71, 52, 0.15); border-radius: 1rem; background: #fff; box-shadow: 0 7px 20px rgba(18, 53, 36, 0.04); }
.material-card--selected { border-color: #4a9a70; box-shadow: 0 8px 24px rgba(40, 113, 79, 0.12); }
.material-card__main { display: flex; justify-content: space-between; gap: 1rem; }
.material-card__category { color: #508063; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; }
.material-card h3 { margin: 0.25rem 0 0; color: #173e2c; font-size: 1.1rem; }
.material-card p { margin: 0.35rem 0 0; color: #66746c; font-size: 0.88rem; }
.epd-badge { align-self: flex-start; padding: 0.35rem 0.55rem; border-radius: 0.45rem; font-size: 0.72rem; font-weight: 700; white-space: nowrap; }
.epd-badge--verified { background: #e1f3e7; color: #226744; }
.epd-badge--benchmark { background: #f1f0eb; color: #62645d; }
.material-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; margin: 1rem 0; }
.material-metrics div { padding: 0.65rem 0.75rem; border-radius: 0.65rem; background: #f5f8f5; }
.material-metrics span, .material-metrics strong { display: block; }
.material-metrics span { color: #6d7d72; font-size: 0.69rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; }
.material-metrics strong { margin-top: 0.22rem; color: #1a4933; font-size: 0.96rem; }
.material-metrics small { color: #64736a; font-size: 0.72rem; font-weight: 400; }
.material-card__footer { display: flex; justify-content: space-between; align-items: center; gap: 1rem; color: #65736a; font-size: 0.78rem; }

.design-side-card, .scenario-side-card { padding: 1.2rem; border: 1px solid rgba(26, 71, 52, 0.15); border-radius: 1rem; background: #fbfcf9; }
.project-info-popup { display: grid; gap: 1rem; }
.project-info-popup__intro { display: flex; gap: 0.7rem; align-items: flex-start; padding: 0.8rem 0.9rem; border: 1px solid #cfe4d3; border-radius: 0.7rem; background: #eef8ef; color: #53665a; font-size: 0.78rem; }
.project-info-popup__intro > i { color: #28714f; font-size: 1.15rem; }
.project-info-popup__intro strong { display: block; color: #1f633f; font-size: 0.86rem; }
.project-info-popup__section { padding: 0.9rem; border: 1px solid #e1e9e2; border-radius: 0.75rem; background: #fff; }
.project-info-popup__section-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.7rem; color: #31553f; font-size: 0.76rem; font-weight: 800; }
.project-info-popup__section .palette-purpose-label { margin-bottom: 0.7rem; }
.project-info-popup__section .design-side-card, .project-info-popup__section .scenario-side-card { padding: 0; border: 0; background: transparent; }
.project-info-popup__section .palette-purpose-label--side { display: none; }
.header-create-project { white-space: nowrap; }
.design-side-card h3, .scenario-side-card h3 { color: #173e2c; font-size: 1.1rem; }
.design-side-card dl { margin: 1rem 0; }
.design-side-card dt { margin-top: 0.7rem; color: #6d7d72; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; }
.design-side-card dd { margin: 0.15rem 0; color: #34493d; }
.scenario-side-card > div > i { color: #28714f; font-size: 1.4rem; }
.scenario-line { display: flex; justify-content: space-between; gap: 1rem; padding: 0.8rem 0; border-bottom: 1px solid #e7ece8; }
.scenario-line strong, .scenario-line span, .scenario-line b, .scenario-line small { display: block; }
.scenario-line span, .scenario-line small { color: #708076; font-size: 0.73rem; }
.scenario-line b { color: #20553a; text-align: right; }

.comparison-dock { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; padding: 1.25rem 1.4rem; border-radius: 1rem; background: #1c4933; color: #fff; box-shadow: 0 14px 30px rgba(18, 53, 36, 0.16); }
.comparison-dock .palette-purpose-label { color: #a9dfb6; }
.comparison-dock h3 { margin: 0.3rem 0; font-size: 1.1rem; }
.comparison-dock p { margin: 0; color: rgba(255, 255, 255, 0.74); font-size: 0.86rem; }

.material-facts { padding: 1.3rem; border: 1px solid rgba(26, 71, 52, 0.14); border-radius: 1rem; background: #fffdf8; }
.material-facts h2 { color: #173e2c; }
.material-facts .row > div > div { height: 100%; padding: 0.8rem; border-radius: 0.65rem; background: #f1f6f2; }
.material-facts span, .material-facts strong { display: block; }
.material-facts span { color: #6d7d72; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; }
.material-facts strong { margin-top: 0.3rem; color: #214d37; }

.studio-setup-shell { max-width: 850px; margin: 0 auto; padding: 1.5rem 0; }
.studio-setup__top { display: flex; justify-content: space-between; align-items: center; color: #65736a; font-size: 0.85rem; }
.studio-stepper { display: flex; justify-content: space-between; gap: 0.5rem; margin: 1.5rem 0; padding-bottom: 0.6rem; border-bottom: 1px solid #dce6de; color: #849087; font-size: 0.78rem; }
.studio-stepper .active { color: #1f633f; font-weight: 700; }
.studio-setup-card { padding: clamp(1.5rem, 5vw, 3rem); border-radius: 1.25rem; background: #fff; box-shadow: 0 18px 42px rgba(18, 53, 36, 0.1); }
.studio-setup-card h1 { margin-top: 0.4rem; color: #173e2c; }
.studio-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1.5rem; }
.studio-form-grid label { color: #476252; font-size: 0.84rem; font-weight: 700; }
.studio-form-grid .col-span-full { grid-column: 1 / -1; }
.studio-form-grid input, .studio-form-grid select { margin-top: 0.35rem; }
.studio-goal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.8rem; margin-top: 1.5rem; }
.studio-goal { padding: 1.05rem; text-align: left; border: 1px solid #d9e5dc; border-radius: 0.85rem; background: #fffdf9; color: #345141; }
.studio-goal--selected { border-color: #4c9a70; background: #edf7ef; }
.studio-goal i, .studio-goal strong, .studio-goal span { display: block; }
.studio-goal i { color: #28714f; font-size: 1.35rem; margin-bottom: 0.75rem; }
.studio-goal span { margin-top: 0.35rem; color: #68776d; font-size: 0.8rem; }
.studio-finish { max-width: 34rem; margin: 1.5rem auto; text-align: center; }
.studio-finish__icon { display: grid; width: 4rem; height: 4rem; place-items: center; margin: 0 auto 1rem; border-radius: 1.25rem; background: #e2f3e7; color: #28714f; font-size: 1.8rem; }
.studio-finish__list { display: grid; gap: 0.55rem; margin-top: 1.25rem; color: #355745; text-align: left; }
.studio-finish__list i { color: #28714f; }

/* Phased delivery, role, assembly and assurance surfaces */
.delivery-kicker { color: #507361; font-size: 0.7rem; font-weight: 750; letter-spacing: 0.1em; text-transform: uppercase; }
.delivery-hero, .audit-hero { display: flex; justify-content: space-between; align-items: center; gap: 2rem; padding: 1.6rem; border: 1px solid #dbe7dd; border-radius: 1.2rem; background: radial-gradient(circle at 90% 10%, #dcebdc 0, transparent 32%), #fffdf8; }
.delivery-hero h1, .audit-hero h1 { margin: 0.35rem 0; color: #153d2a; }
.delivery-hero p, .audit-hero p { max-width: 48rem; margin: 0; color: #62746a; }
.readiness-orbit { display: grid; flex: 0 0 8rem; width: 8rem; height: 8rem; place-content: center; border: 0.7rem solid #ead9a9; border-radius: 50%; background: #fff; text-align: center; box-shadow: inset 0 0 0 1px #d9e3da; }
.readiness-orbit strong { color: #1c5538; font-size: 1.75rem; line-height: 1; }
.readiness-orbit span { margin-top: 0.35rem; color: #718077; font-size: 0.7rem; }
.readiness-orbit.is-complete { border-color: #3b8a5d; }
.phase-rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.phase-card { position: relative; padding: 1.2rem; overflow: hidden; border: 1px solid #dde5dd; border-radius: 1rem; background: #fff; }
.phase-card--active { border-top: 4px solid #2d7650; box-shadow: 0 12px 28px rgba(18, 53, 36, 0.08); }
.phase-card__number { position: absolute; right: 0.7rem; top: -0.7rem; color: #eef2ec; font-size: 4rem; font-weight: 800; line-height: 1; }
.phase-card > .badge { position: relative; }
.phase-card h3 { position: relative; margin: 1rem 0 0.45rem; color: #173e2c; font-size: 1.08rem; }
.phase-card p { min-height: 4.5rem; color: #68776e; font-size: 0.83rem; }
.phase-card__owner { min-height: 2.5rem; color: #47705a; font-size: 0.73rem; font-weight: 700; }
.phase-card ul { min-height: 7rem; padding-left: 1.1rem; color: #4f6257; font-size: 0.8rem; }
.phase-card__gate { display: flex; gap: 0.65rem; padding-top: 0.8rem; border-top: 1px solid #e6ece7; color: #58695f; font-size: 0.75rem; }
.phase-card__gate i { color: #9b721b; }
.phase-card__gate b, .phase-card__gate span { display: block; }

.role-switcher { display: flex; gap: 0.65rem; overflow-x: auto; padding-bottom: 0.3rem; }
.role-chip { display: inline-flex; align-items: center; gap: 0.55rem; padding: 0.65rem 0.85rem; border: 1px solid #d9e3da; border-radius: 99px; background: #fff; color: #476252; white-space: nowrap; }
.role-chip span { display: grid; width: 1.6rem; height: 1.6rem; place-items: center; border-radius: 50%; background: #eef3ed; font-size: 0.72rem; font-weight: 700; }
.role-chip.is-active { border-color: #286d4a; background: #1f5138; color: #fff; }
.role-chip.is-active span { background: rgba(255,255,255,0.18); }
.role-task { display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: center; padding: 1rem; border: 1px solid #e0e8e1; border-radius: 0.85rem; background: #fdfcf8; }
.role-task__index { color: #a77c24; font-size: 0.75rem; font-weight: 800; }
.role-task h4 { margin: 0; color: #234632; font-size: 1rem; }
.role-task p { margin: 0.25rem 0 0; color: #718077; font-size: 0.8rem; }
.permission-card, .lineage-panel { height: 100%; padding: 1.3rem; border-radius: 1rem; background: #173e2c; color: #fff; }
.permission-card .delivery-kicker, .lineage-panel .delivery-kicker { color: #a9c8b5; }
.permission-card h3, .lineage-panel h3 { margin: 0.5rem 0 1.2rem; }
.permission-line { display: flex; gap: 0.55rem; margin: 0.7rem 0; color: #dceade; font-size: 0.86rem; }
.permission-line i { color: #72c792; }
.permission-denied { display: flex; gap: 0.65rem; margin-top: 1.1rem; padding: 0.85rem; border-radius: 0.7rem; background: rgba(255,255,255,0.09); color: #f3d7a2; font-size: 0.82rem; }
.permission-denied b, .permission-denied span { display: block; }

.assembly-studio { overflow: hidden; border: 1px solid #cfddd1; border-radius: 1.1rem; background: #fff; box-shadow: 0 10px 26px rgba(18, 53, 36, 0.07); }
.assembly-studio__head { display: flex; justify-content: space-between; gap: 2rem; padding: 1.35rem; background: linear-gradient(120deg, #f7f4e9, #edf5ee); }
.assembly-studio__head h2 { margin: 0.35rem 0; color: #163e2b; font-size: 1.35rem; }
.assembly-studio__head p { margin: 0; color: #65766b; }
.assembly-totals { display: flex; gap: 0.6rem; align-items: stretch; }
.assembly-totals div { min-width: 8rem; padding: 0.65rem; border: 1px solid rgba(36, 88, 58, 0.12); border-radius: 0.7rem; background: rgba(255,255,255,0.75); }
.assembly-totals span, .assembly-totals strong { display: block; }
.assembly-totals span { color: #65766b; font-size: 0.64rem; font-weight: 700; text-transform: uppercase; }
.assembly-totals strong { margin-top: 0.2rem; color: #1d5437; font-size: 0.92rem; }
.assembly-contract { display: flex; gap: 0.7rem; align-items: center; padding: 0.9rem 1.2rem; border-top: 1px solid #e1e8e2; background: #fafbf8; color: #5e6e64; font-size: 0.79rem; }
.assembly-contract span { flex: 1; }
.assembly-contract b { display: block; color: #31543f; }
.assembly-option-meta { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-top: 0.85rem; }
.assembly-option-meta span { padding: 0.45rem 0.6rem; border: 1px solid #d7e5d9; border-radius: 0.55rem; background: rgba(255,255,255,0.65); color: #53665a; font-size: 0.68rem; }
.assembly-option-meta b { display: block; margin-bottom: 0.12rem; color: #31553f; font-size: 0.59rem; text-transform: uppercase; }
.assembly-option-toolbar { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 0.85rem 1.2rem; border-top: 1px solid #e1e8e2; border-bottom: 1px solid #e1e8e2; background: #fbfcf9; }
.assembly-option-toolbar strong, .assembly-option-toolbar small { display: block; }
.assembly-option-toolbar strong { color: #31553f; font-size: 0.82rem; }
.assembly-option-toolbar small { margin-top: 0.15rem; color: #7a887e; font-size: 0.68rem; }
.assembly-option-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: flex-end; }
.assembly-version-strip { display: flex; flex-wrap: wrap; gap: 0.45rem; padding: 0.75rem 1.2rem; border-bottom: 1px solid #e1e8e2; }
.assembly-version-chip { display: grid; gap: 0.1rem; padding: 0.5rem 0.7rem; border: 1px solid #d6e1d7; border-radius: 0.6rem; background: #fff; color: #42604d; text-align: left; }
.assembly-version-chip span { font-size: 0.74rem; font-weight: 750; }
.assembly-version-chip small { color: #7c8a80; font-size: 0.62rem; }
.assembly-version-chip.is-active { border-color: #28714f; background: #edf7ef; box-shadow: inset 0 0 0 1px #28714f; }
.assembly-gate-row { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; padding: 0.75rem 1.2rem; background: #fff; }
.assembly-next-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: flex-end; }
.assembly-warning-list { color: #73591a; font-size: 0.72rem; }
.assembly-warning-list summary { cursor: pointer; font-weight: 750; }
.assembly-warning-list summary i { margin-right: 0.25rem; }
.assembly-warning-list > div { display: grid; gap: 0.3rem; margin-top: 0.45rem; }
.assembly-warning-item { display: flex; gap: 0.55rem; padding: 0.35rem 0.5rem; border: 0; border-radius: 0.35rem; background: #fff6dc; color: #73591a; text-align: left; }
.assembly-warning-item span { color: #9a7622; }
.assembly-ready-note { color: #2d7650; font-size: 0.72rem; font-weight: 700; }
.assembly-table { min-width: 78rem; font-size: 0.74rem; }
.assembly-table th, .assembly-table td { padding: 0.72rem 0.8rem; border-color: #e7eee8; }
.assembly-table td small, .assembly-table th small, .assembly-supplier, .assembly-evidence { display: block; margin-top: 0.16rem; color: #819087; font-size: 0.62rem; font-weight: 400; }
.assembly-number { color: #214b34; font-variant-numeric: tabular-nums; white-space: nowrap; }
.assembly-group-row th { padding: 0; background: #f5f8f3; }
.assembly-group-row button { display: grid; grid-template-columns: auto 1fr auto; gap: 0.55rem; width: 100%; padding: 0.65rem 0.8rem; border: 0; background: transparent; color: #31553f; text-align: left; }
.assembly-group-row button > i { margin-top: 0.12rem; }
.assembly-group-row button span, .assembly-group-row button strong, .assembly-group-row button small, .assembly-group-row button em { display: block; }
.assembly-group-row button strong { font-size: 0.78rem; }
.assembly-group-row button small { margin-top: 0.12rem; color: #7c8a80; font-size: 0.62rem; font-weight: 400; }
.assembly-group-row button em { align-self: center; color: #577160; font-size: 0.68rem; font-style: normal; font-variant-numeric: tabular-nums; text-align: right; }
.assembly-row-focus { animation: assembly-row-focus 1.4s ease; }
@keyframes assembly-row-focus { 0%, 100% { background: inherit; } 25%, 70% { background: #fff1bd; } }
.assembly-contract-links { display: flex; flex-wrap: wrap; gap: 0.65rem; align-items: center; justify-content: flex-end; }
.assembly-contract-links > span { flex: 0 0 auto; color: #6c7c71; font-size: 0.68rem; }
.assembly-management-hero { display: flex; justify-content: space-between; gap: 1.5rem; align-items: flex-end; padding: 1.45rem 1.5rem; border-radius: 1rem; background: linear-gradient(120deg, #163e2b, #28714f 68%, #8b743d); color: #fff; }
.assembly-management-hero h1 { margin: 0.3rem 0; font-size: clamp(1.7rem, 3vw, 2.35rem); }
.assembly-management-hero p { max-width: 48rem; margin: 0; color: rgba(255,255,255,0.8); }
.assembly-management-hero .delivery-kicker { color: #d8e9d8; }
.assembly-management-hero__stats { display: flex; gap: 0.55rem; }
.assembly-management-hero__stats span { min-width: 6.5rem; padding: 0.7rem; border: 1px solid rgba(255,255,255,0.18); border-radius: 0.65rem; background: rgba(255,255,255,0.1); color: #dbeade; font-size: 0.68rem; }
.assembly-management-hero__stats strong { display: block; color: #fff; font-size: 1.35rem; }
.assembly-management-toolbar { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 0.85rem 1rem; border: 1px solid #d9e5da; border-radius: 0.8rem; background: #fff; }
.assembly-management-toolbar strong, .assembly-management-toolbar small { display: block; }
.assembly-management-toolbar strong { color: #31553f; font-size: 0.82rem; }
.assembly-management-toolbar small { margin-top: 0.12rem; color: #7a887e; font-size: 0.68rem; }
.assembly-management-list, .assembly-management-detail { height: 100%; border: 1px solid #d9e5da; border-radius: 0.9rem; background: #fff; overflow: hidden; }
.assembly-management-list__head { display: flex; justify-content: space-between; padding: 0.85rem 1rem; border-bottom: 1px solid #e5ece6; color: #31553f; font-size: 0.78rem; font-weight: 800; }
.assembly-management-list__head small { color: #87938a; font-size: 0.64rem; font-weight: 400; }
.assembly-management-item { display: grid; grid-template-columns: auto 1fr auto; gap: 0.55rem; width: 100%; padding: 0.85rem 1rem; border: 0; border-bottom: 1px solid #edf1ed; background: #fff; color: #557060; text-align: left; }
.assembly-management-item:hover { background: #f6faf5; }
.assembly-management-item.is-active { border-left: 3px solid #28714f; background: #eef7ef; color: #1f5138; }
.assembly-management-item span, .assembly-management-item strong, .assembly-management-item small, .assembly-management-item em { display: block; }
.assembly-management-item strong { font-size: 0.78rem; }
.assembly-management-item small { margin-top: 0.14rem; color: #859188; font-size: 0.62rem; }
.assembly-management-item em { align-self: center; color: #87938a; font-size: 0.62rem; font-style: normal; white-space: nowrap; }
.assembly-management-detail__head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; padding: 1rem 1.1rem; border-bottom: 1px solid #e5ece6; }
.assembly-management-detail__head h2 { margin: 0.25rem 0; color: #173e2c; font-size: 1.25rem; }
.assembly-management-detail__head p { margin: 0; color: #748179; font-size: 0.72rem; }
.assembly-management-guidance { display: flex; gap: 0.55rem; align-items: flex-start; margin: 0.9rem 1.1rem; padding: 0.7rem 0.8rem; border: 1px solid #d7e9d9; border-radius: 0.65rem; background: #f2f9f2; color: #5e7164; font-size: 0.7rem; }
.assembly-management-guidance > i { color: #28714f; font-size: 1rem; }
.assembly-management-guidance strong { color: #31553f; }
.assembly-component-table { min-width: 54rem; font-size: 0.72rem; }
.assembly-component-table th, .assembly-component-table td { padding: 0.7rem 0.75rem; border-color: #e8eee9; }
.assembly-component-table td strong, .assembly-component-table td small { display: block; }
.assembly-component-table td small { margin-top: 0.12rem; color: #87938a; font-size: 0.61rem; }
.table-action-group { display: flex; gap: 0.35rem; white-space: nowrap; }
.empty-state { padding: 4rem 1rem; border: 1px dashed #bfd2c2; border-radius: 1rem; background: #fbfdf9; text-align: center; }
.empty-state > i { color: #28714f; font-size: 2rem; }
.empty-state h2 { margin: 0.8rem 0 0.35rem; color: #173e2c; }
.empty-state p { color: #718077; }

/* Reference visual language: light shell, compact panels and dense data tables. */
.card, .panel, .ui-shell-card, .contract-tile, .design-side-card, .scenario-side-card, .material-facts, .comparison-dock { border-color: #dfe8e4; border-radius: 10px; box-shadow: 0 4px 18px rgba(17, 34, 58, 0.06); }
.studio-hero, .mapping-hero, .assembly-management-hero { border: 1px solid #dfe8e4; border-radius: 10px; background: #fff; color: #10223f; box-shadow: 0 4px 18px rgba(17, 34, 58, 0.06); }
.studio-hero p, .mapping-hero p, .assembly-management-hero p { color: #67788d; }
.studio-hero h1, .mapping-hero h1, .assembly-management-hero h1 { color: #10223f; }
.studio-hero__eyebrow, .mapping-hero .delivery-kicker, .assembly-management-hero .delivery-kicker { color: #14845f; }
.prototype-banner { border: 1px solid #cfe2d8; border-radius: 10px; background: #e8f5ef; color: #17334d; box-shadow: none; }
.prototype-banner__eyebrow { color: #14845f; opacity: 1; }
.prototype-banner__title { color: #17334d; }
.prototype-banner__copy { color: #67788d; }
.prototype-banner__meta .badge.text-bg-dark { background: #10223f !important; }
.table > :not(caption) > * > * { border-bottom-color: #edf3f0; }
.table thead th { background: #f7faf9; color: #34485f; font-size: 0.63rem; font-weight: 750; text-transform: uppercase; white-space: nowrap; }
.table tbody td { color: #34465c; }
.btn { border-radius: 7px; }
.btn-success { background: #14845f; border-color: #14845f; }
.btn-outline-success { border-color: #9ac7b0; color: #0b694b; }
.btn-outline-success:hover { background: #e8f5ef; color: #0b694b; }
.navbar .container-fluid { padding: 0.7rem 1.1rem; }
#main-content { padding: 18px !important; }
.form-control, .form-select { min-height: 34px; padding: 0.42rem 0.6rem; border: 1px solid #cfdad6; border-radius: 6px; background: #fff; color: #17334d; font-size: 0.76rem; }
.form-control:focus, .form-select:focus { border-color: #77b99b; box-shadow: 0 0 0 0.18rem rgba(20, 132, 95, 0.12); }
label, .form-label { color: #627388; font-size: 0.68rem; font-weight: 700; }
.nav-tabs { gap: 1.2rem; border-bottom: 1px solid #dfe8e4; }
.nav-tabs .nav-link { padding: 0.65rem 0.1rem; border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: #50647a; font-size: 0.74rem; }
.nav-tabs .nav-link:hover { border-bottom-color: #9ac7b0; color: #0b694b; }
.nav-tabs .nav-link.active { border-bottom-color: #14845f; background: transparent; color: #0b694b; font-weight: 700; }
.dropdown-menu { padding: 0.35rem; border: 1px solid #dfe8e4; border-radius: 7px; box-shadow: 0 8px 22px rgba(17, 34, 58, 0.1); }
.dropdown-item { border-radius: 5px; color: #34465c; font-size: 0.76rem; }
.dropdown-item:hover { background: #e8f5ef; color: #0b694b; }
.modal-content { overflow: hidden; border: 1px solid #dfe8e4; border-radius: 11px; box-shadow: 0 20px 60px rgba(17, 34, 58, 0.2); }
.modal-header, .modal-footer { padding: 0.85rem 1rem; border-color: #dfe8e4; background: #fff; }
.modal-title { color: #10223f; font-size: 0.95rem; font-weight: 800; }
.modal-body { padding: 1rem; background: #fff; }
.badge { border-radius: 99px; font-size: 0.62rem; font-weight: 700; }
.alert { border-radius: 7px; font-size: 0.72rem; }
.text-muted { color: #67788d !important; }
.text-success { color: #14845f !important; }

.mapping-hero { display: flex; justify-content: space-between; gap: 1.5rem; align-items: flex-end; padding: 1.4rem 1.5rem; border-radius: 1rem; background: linear-gradient(120deg, #163e2b, #28714f 65%, #9b7b37); color: #fff; }
.mapping-hero h1 { margin: 0.3rem 0; font-size: clamp(1.7rem, 3vw, 2.4rem); }
.mapping-hero p { max-width: 48rem; margin: 0; color: rgba(255,255,255,0.82); }
.mapping-hero .delivery-kicker { color: #d8e9d8; }
.mapping-hero__actions { display: flex; flex-wrap: wrap; gap: 0.55rem; }
.mapping-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; padding: 0.75rem 1rem; border: 1px solid #dce6dd; border-radius: 0.8rem; background: #fff; }
.mapping-toolbar > div { display: grid; gap: 0.1rem; }
.mapping-toolbar__label { color: #78857b; font-size: 0.63rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.mapping-toolbar strong { color: #234b35; font-size: 0.82rem; }
.mapping-toolbar .badge { margin-left: auto; }
.reference-project-strip { display: flex; flex-wrap: wrap; gap: 0.55rem 1rem; align-items: center; padding: 0.65rem 0.85rem; border: 1px solid #e1e7da; border-radius: 0.7rem; background: #f7f6ed; color: #68766d; font-size: 0.68rem; }
.reference-project-strip > span:not(.mapping-toolbar__label) { padding-left: 0.75rem; border-left: 1px solid #d9dfd2; }
.reference-project-strip strong { color: #31553f; }
.reference-project-strip small { color: #8b958d; }
.design-version-bar, .version-comparison-card { padding: 1rem; border: 1px solid #d9e4da; border-radius: 0.9rem; background: #fff; box-shadow: 0 8px 22px rgba(18,53,36,0.04); }
.design-version-bar__head, .version-comparison-card__head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; }
.design-version-bar__head h2, .version-comparison-card__head h2 { margin: 0.25rem 0; color: #173e2c; font-size: 1.08rem; }
.design-version-bar__head p, .version-comparison-card__head p { margin: 0; color: #76837a; font-size: 0.72rem; }
.design-version-list { display: grid; grid-template-columns: repeat(3, minmax(15rem, 1fr)); gap: 0.65rem; margin-top: 0.85rem; }
.design-version-card { padding: 0.7rem; border: 1px solid #e0e8e1; border-radius: 0.7rem; background: #fbfcf9; }
.design-version-card.is-active { border-color: #4a9a70; background: #eef7ef; box-shadow: inset 0 0 0 1px #a9d1b3; }
.design-version-card__select { display: flex; width: 100%; gap: 0.45rem; align-items: flex-start; padding: 0; border: 0; background: transparent; color: #234b35; text-align: left; }
.design-version-card__radio { flex: 0 0 0.85rem; width: 0.85rem; height: 0.85rem; margin-top: 0.12rem; border: 2px solid #9aada0; border-radius: 50%; }
.design-version-card.is-active .design-version-card__radio { border-color: #28714f; background: radial-gradient(circle, #28714f 45%, transparent 48%); }
.design-version-card__select span:not(.design-version-card__radio), .design-version-card__metrics span, .design-version-card__compare { display: grid; gap: 0.12rem; }
.design-version-card__select strong { font-size: 0.78rem; }
.design-version-card__select small { color: #7c897f; font-size: 0.63rem; }
.design-version-card__metrics { display: flex; gap: 1rem; margin: 0.7rem 0 0.55rem 1.3rem; color: #1f633f; font-size: 0.78rem; font-variant-numeric: tabular-nums; }
.design-version-card__metrics small { color: #87938a; font-size: 0.6rem; font-variant-numeric: normal; }
.design-version-card__compare { display: flex; gap: 0.35rem; align-items: center; margin-left: 1.3rem; color: #718077; font-size: 0.65rem; }
.design-version-card__compare input { accent-color: #28714f; }
.version-comparison-card__head { padding-bottom: 0.85rem; }
.version-comparison-table { min-width: 48rem; font-size: 0.72rem; }
.version-comparison-table th, .version-comparison-table td { padding: 0.65rem 0.7rem; border-color: #e9efea; }
.version-comparison-table thead th { color: #52705d; font-size: 0.66rem; text-transform: uppercase; }
.version-comparison-table thead th small, .version-comparison-table tbody td small, .version-comparison-table tfoot th small { display: block; margin-top: 0.2rem; color: #86938a; font-size: 0.62rem; font-weight: 400; text-transform: none; }
.version-comparison-table tbody td:not(:first-child), .version-comparison-table tfoot th:not(:first-child) { min-width: 10rem; }
.version-comparison-table tbody td strong { display: block; color: #31553f; font-size: 0.72rem; }
.compare-delta { display: block; width: max-content; margin: 0.15rem 0; padding: 0.2rem 0.35rem; border-radius: 0.3rem; background: #eef2ef; color: #6f7f74; font-size: 0.62rem; font-variant-numeric: tabular-nums; }
.compare-delta.is-positive { background: #e8f5eb; color: #28714f; }
.compare-delta.is-negative { background: #fff0ed; color: #a84936; }
.mapping-dashboard { display: grid; grid-template-columns: minmax(13rem, 0.75fr) minmax(28rem, 1.8fr) minmax(18rem, 1fr); gap: 0.85rem; align-items: stretch; }
.mapping-tree, .mapping-center, .mapping-alternatives { min-width: 0; overflow: hidden; border: 1px solid #d9e4da; border-radius: 0.9rem; background: #fff; box-shadow: 0 8px 22px rgba(18,53,36,0.05); }
.mapping-panel-head { display: flex; justify-content: space-between; gap: 0.6rem; align-items: flex-start; padding: 0.95rem 1rem; border-bottom: 1px solid #e7eee8; background: #fbfcf9; }
.mapping-panel-head h2 { margin: 0.25rem 0 0; color: #173e2c; font-size: 1.05rem; }
.mapping-panel-head p { margin: 0.35rem 0 0; color: #748178; font-size: 0.75rem; }
.mapping-panel-head > i { color: #6a9076; font-size: 1.2rem; }
.mapping-panel-actions { display: flex; flex-wrap: wrap; gap: 0.35rem; justify-content: flex-end; align-items: center; }
.mapping-panel-actions .mapping-bind-state { order: -1; }
.material-catalog { margin: 0 1rem 0.85rem; overflow: hidden; border: 1px solid #dbe6dc; border-radius: 0.7rem; background: #fff; }
.material-catalog__head { display: flex; justify-content: space-between; gap: 0.75rem; align-items: flex-start; padding: 0.8rem 0.9rem; border-bottom: 1px solid #e8eee9; background: #f8faf7; }
.material-catalog__head h3 { margin: 0.2rem 0; color: #234b35; font-size: 0.94rem; }
.material-catalog__head p { margin: 0; color: #78857b; font-size: 0.68rem; }
.material-catalog__head-actions { display: grid; gap: 0.35rem; justify-items: end; }
.catalog-help { color: #6f7f74; font-size: 0.62rem; white-space: nowrap; }
.catalog-help i { margin-right: 0.2rem; color: #28714f; }
.material-catalog__filterbar { display: flex; flex-wrap: wrap; gap: 0.5rem 0.8rem; align-items: center; padding: 0.55rem 0.75rem; border-bottom: 1px solid #e8eee9; background: #fff; color: #78857b; font-size: 0.62rem; }
.material-catalog__filterbar label { display: flex; min-width: 15rem; flex: 1; gap: 0.4rem; align-items: center; padding: 0.35rem 0.5rem; border: 1px solid #dce6de; border-radius: 0.4rem; color: #28714f; }
.material-catalog__filterbar input { width: 100%; border: 0; outline: 0; color: #31553f; font-size: 0.66rem; }
.material-catalog__filterbar > span { white-space: nowrap; }
.material-catalog__filterbar > span i { margin-right: 0.2rem; color: #28714f; }
.material-catalog-table { min-width: 58rem; font-size: 0.69rem; }
.material-catalog-table th, .material-catalog-table td { padding: 0.55rem 0.62rem; border-color: #edf1ed; }
.material-catalog-table thead th { color: #708077; font-size: 0.61rem; text-transform: uppercase; white-space: nowrap; }
.material-catalog-table tbody tr.is-selected { background: #eef7ef; }
.material-catalog-table tbody tr.supplier-child-row { background: #fcfdfb; }
.material-catalog-table tbody tr.supplier-child-row td:first-child { padding-left: 1.45rem; border-left: 3px solid #dce9de; }
.material-catalog-table tbody tr.is-detail-row { cursor: pointer; }
.material-catalog-table tbody tr.is-detail-row:hover { background: #f3f8f3; }
.material-catalog-table td strong, .material-catalog-table td small { display: block; }
.material-catalog-table td small { margin-top: 0.12rem; color: #87938a; font-size: 0.59rem; }
.catalog-number { color: #214b34; font-variant-numeric: tabular-nums; white-space: nowrap; }
.material-catalog__footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 1rem; padding: 0.55rem 0.75rem; border-top: 1px solid #e8eee9; background: #f8faf7; color: #718077; font-size: 0.62rem; }
.material-catalog__footer i { margin-right: 0.2rem; color: #28714f; }
.fit-status { display: inline-flex; gap: 0.25rem; align-items: center; color: #b06c26; font-size: 0.61rem; white-space: nowrap; }
.fit-status.is-fit { color: #28714f; }
.catalog-actions { display: grid; gap: 0.18rem; justify-items: start; }
.mapping-tree__root, .mapping-tree__group { display: flex; gap: 0.5rem; align-items: flex-start; padding: 0.8rem 0.9rem; color: #31553f; }
.mapping-tree__root { background: #f0f7f0; }
.mapping-tree__root span, .mapping-tree__item span { display: grid; min-width: 0; gap: 0.12rem; }
.mapping-tree__root small, .mapping-tree__item small { color: #7b897e; font-size: 0.65rem; }
.mapping-tree__root strong, .mapping-tree__item strong { overflow: hidden; font-size: 0.79rem; text-overflow: ellipsis; white-space: nowrap; }
.mapping-tree__branch { padding-bottom: 0.5rem; }
.mapping-tree__group { padding-bottom: 0.35rem; color: #6a786e; font-size: 0.7rem; text-transform: uppercase; }
.mapping-tree__assembly { border-top: 1px solid #edf1ed; }
.mapping-tree__assembly.is-collapsed .mapping-tree__assembly-label { background: #fbfcf9; }
.mapping-tree__assembly-label { display: flex; gap: 0.45rem; align-items: flex-start; padding: 0.65rem 0.8rem 0.35rem; color: #476653; }
.mapping-tree__assembly-label { cursor: pointer; }
.mapping-tree__assembly-label:hover { background: #f3f8f3; }
.mapping-tree__assembly-label span { display: grid; gap: 0.1rem; }
.mapping-tree__assembly-label small { color: #88958b; font-size: 0.6rem; }
.mapping-tree__assembly-label strong { font-size: 0.74rem; }
.mapping-tree__assembly-label em { margin-left: auto; color: #8a968d; font-size: 0.6rem; font-style: normal; text-align: right; }
.mapping-tree__item { display: flex; width: 100%; gap: 0.45rem; align-items: center; padding: 0.6rem 0.8rem 0.6rem 1.55rem; border: 0; border-left: 3px solid transparent; background: #fff; color: #355744; text-align: left; }
.mapping-tree__item:hover { background: #f5f8f4; }
.mapping-tree__item.is-selected { border-left-color: #28714f; background: #eaf5ed; color: #173e2c; }
.mapping-tree__item em { margin-left: auto; color: #8a968d; font-size: 0.65rem; font-style: normal; white-space: nowrap; }
.mapping-tree__item-summary { display: grid; min-width: 0; gap: 0.08rem; margin-left: auto; text-align: right; }
.mapping-tree__item-summary b { overflow: hidden; max-width: 7rem; color: #4e715a; font-size: 0.58rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.mapping-tree__item-summary small { color: #87938a; font-size: 0.55rem; white-space: nowrap; }
.mapping-tree__footer { display: flex; gap: 0.5rem; align-items: flex-start; margin: 0.7rem; padding: 0.65rem; border-radius: 0.6rem; background: #fff9e8; color: #78632d; font-size: 0.68rem; }
.mapping-bind-state { padding: 0.35rem 0.5rem; border-radius: 0.45rem; background: #e5f4e8; color: #28714f; font-size: 0.68rem; font-weight: 700; white-space: nowrap; }
.mapping-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.55rem; padding: 0.75rem 1rem; border-bottom: 1px solid #e7eee8; }
.mapping-kpis div { padding: 0.55rem; border: 1px solid #e2eae2; border-radius: 0.55rem; background: #fbfcf9; }
.mapping-kpis span, .mapping-kpis strong { display: block; }
.mapping-kpis span { color: #748178; font-size: 0.63rem; }
.mapping-kpis strong { margin-top: 0.25rem; color: #1e5839; font-size: 0.85rem; font-variant-numeric: tabular-nums; }
.mapping-table-wrap { overflow-x: auto; }
.mapping-center > .mapping-table-wrap { display: none; }
.mapping-table { min-width: 46rem; font-size: 0.72rem; }
.mapping-table thead tr:first-child th { padding-bottom: 0.2rem; border-bottom: 0; color: #587060; font-size: 0.64rem; text-transform: uppercase; }
.mapping-table thead tr:last-child th { color: #89968c; font-size: 0.62rem; font-weight: 600; }
.mapping-table td, .mapping-table th { padding: 0.55rem 0.7rem; border-color: #edf1ed; }
.mapping-table td:nth-child(n+3), .mapping-table th:nth-child(n+3) { text-align: right; }
.mapping-table td strong, .mapping-table td small { display: block; }
.mapping-table td small { margin-top: 0.14rem; color: #86938a; font-size: 0.63rem; }
.mapping-field { width: 8.5rem; color: #6e7d73; font-weight: 700; }
.number-cell { color: #214b34; font-variant-numeric: tabular-nums; font-weight: 700; white-space: nowrap; }
.mapping-contract { display: flex; gap: 0.6rem; align-items: flex-start; margin: 0.75rem 1rem 1rem; padding: 0.7rem; border-radius: 0.6rem; background: #f4f8f3; color: #617066; font-size: 0.68rem; }
.mapping-contract i { color: #28714f; font-size: 1rem; }
.mapping-contract strong { display: block; color: #31553f; }
.mapping-offers { margin: 0 1rem 1rem; padding: 0.75rem; border: 1px solid #e1e9e2; border-radius: 0.65rem; background: #fbfcf9; }
.mapping-offers__head { display: flex; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.4rem; color: #31553f; font-size: 0.72rem; }
.mapping-offers__head small { color: #88958b; font-size: 0.63rem; }
.mapping-offer-row { display: flex; justify-content: space-between; gap: 0.8rem; padding: 0.5rem 0; border-top: 1px solid #e8eee9; color: #53665a; font-size: 0.68rem; }
.mapping-offer-row.is-selected { color: #1f633f; }
.mapping-offer-row > span, .mapping-offer-row > b { display: grid; gap: 0.12rem; }
.mapping-offer-row > b { text-align: right; white-space: nowrap; }
.mapping-offer-row small { color: #859188; font-size: 0.6rem; font-weight: 400; }
.mapping-count { color: #77857b; font-size: 0.68rem; }
.version-action-group { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: flex-end; }
.mapping-alternatives { background: #fbfcf9; }
.mapping-detail-tabs { overflow: hidden; border: 1px solid #d9e4da; border-radius: 0.9rem; background: #fff; box-shadow: 0 8px 22px rgba(18,53,36,0.04); }
.mapping-detail-tabs__head { display: flex; justify-content: space-between; gap: 0.75rem; align-items: flex-start; padding: 0.85rem 1rem; border-bottom: 1px solid #e7eee8; background: #fbfcf9; }
.mapping-detail-tabs__head h2 { margin: 0.25rem 0; color: #173e2c; font-size: 0.98rem; }
.mapping-detail-tabs__head p { margin: 0; color: #748178; font-size: 0.68rem; }
.mapping-detail-tabs__nav { display: flex; gap: 0.2rem; overflow-x: auto; padding: 0.45rem 0.7rem 0; border-bottom: 1px solid #e7eee8; }
.mapping-detail-tabs__nav button { padding: 0.45rem 0.55rem; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #718077; font-size: 0.64rem; font-weight: 700; white-space: nowrap; }
.mapping-detail-tabs__nav button.is-active { border-bottom-color: #28714f; color: #28714f; }
.mapping-detail-tabs__body { padding: 0.85rem 1rem; }
.mapping-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.55rem; }
.mapping-detail-grid > div, .mapping-detail-checks > div { min-width: 0; padding: 0.55rem; border: 1px solid #e5ece6; border-radius: 0.5rem; background: #fbfcf9; }
.mapping-detail-grid span, .mapping-detail-grid strong, .mapping-detail-checks span, .mapping-detail-checks strong { display: block; }
.mapping-detail-grid span, .mapping-detail-checks span { color: #78857b; font-size: 0.6rem; }
.mapping-detail-grid strong, .mapping-detail-checks strong { margin-top: 0.2rem; overflow: hidden; color: #31553f; font-size: 0.72rem; text-overflow: ellipsis; }
.mapping-detail-checks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.55rem; }
.mapping-detail-checks .is-pass { color: #28714f; }
.mapping-detail-checks .is-warning { color: #a56d28; }
.mapping-detail-checks > div.is-pass, .mapping-detail-checks > div.is-warning { display: flex; gap: 0.35rem; align-items: center; font-size: 0.65rem; }
.mapping-detail-checks > div.is-pass i, .mapping-detail-checks > div.is-warning i { font-size: 0.85rem; }
.rfq-readiness-bar { display: flex; gap: 0.7rem; align-items: center; padding: 0.75rem 0.9rem; border: 1px solid #9bc8a8; border-radius: 0.75rem; background: #eaf7ed; color: #31553f; }
.rfq-readiness-bar > i { color: #28714f; font-size: 1.2rem; }
.rfq-readiness-bar span { flex: 1; font-size: 0.68rem; }
.rfq-readiness-bar strong { display: block; color: #1f633f; font-size: 0.75rem; }
.decision-summary-grid { display: grid; gap: 0.45rem; padding: 0.75rem; border-bottom: 1px solid #e5ece6; }
.decision-summary-chip { display: grid; grid-template-columns: 5rem 1fr auto; gap: 0.35rem; align-items: center; padding: 0.45rem 0.5rem; border-radius: 0.45rem; background: #f1f6f0; color: #31553f; }
.decision-summary-chip.is-balanced { background: #fff8e6; }
.decision-summary-chip small { color: #7d8b81; font-size: 0.57rem; }
.decision-summary-chip strong { overflow: hidden; font-size: 0.61rem; text-overflow: ellipsis; white-space: nowrap; }
.decision-summary-chip span { color: #28714f; font-size: 0.58rem; font-variant-numeric: tabular-nums; text-align: right; }
.decision-summary__legend { display: flex; gap: 0.8rem; padding: 0.55rem 0.75rem 0; color: #87938a; font-size: 0.58rem; }
.decision-summary__legend i { margin-right: 0.2rem; font-size: 0.45rem; }
.decision-summary__legend .is-carbon { color: #28714f; }
.decision-summary__legend .is-cost { color: #c17a32; }
.decision-option-card { margin-top: 0.65rem; }
.decision-option-rank { display: inline-grid; width: 1.2rem; height: 1.2rem; margin-right: 0.25rem; place-items: center; border-radius: 50%; background: #e3f1e5; color: #28714f; font-size: 0.62rem; font-weight: 800; vertical-align: middle; }
.decision-option-meta { display: flex; justify-content: space-between; gap: 0.4rem; margin-top: 0.65rem; color: #819087; font-size: 0.62rem; }
.decision-option-meta b { display: block; margin-top: 0.12rem; color: #355744; font-variant-numeric: tabular-nums; }
.decision-summary__next { display: flex; gap: 0.45rem; align-items: flex-start; margin: 0.75rem; padding: 0.6rem; border-radius: 0.55rem; background: #eef7ef; color: #617066; font-size: 0.62rem; line-height: 1.4; }
.decision-summary__next i { color: #28714f; font-size: 0.95rem; }
.decision-summary__next strong { display: block; color: #31553f; }
.material-detail-popup__hero { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: 1rem; padding-bottom: 0.8rem; border-bottom: 1px solid #e7eee8; }
.material-detail-popup__hero h3 { margin: 0.25rem 0; color: #173e2c; font-size: 1.1rem; }
.material-detail-popup__hero p { margin: 0; color: #748178; font-size: 0.75rem; }
.material-detail-popup__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.material-detail-popup__grid section { padding: 0.75rem; border: 1px solid #e2eae2; border-radius: 0.6rem; background: #fbfcf9; }
.material-detail-popup__grid h4 { margin: 0 0 0.5rem; color: #31553f; font-size: 0.75rem; }
.material-detail-popup__grid dl { display: grid; grid-template-columns: 1fr auto; gap: 0.35rem 0.7rem; margin: 0; font-size: 0.68rem; }
.material-detail-popup__grid dt { color: #78857b; }
.material-detail-popup__grid dd { margin: 0; color: #214b34; font-weight: 700; text-align: right; }
.material-detail-popup__checks { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-top: 0.85rem; padding-top: 0.75rem; border-top: 1px solid #e7eee8; }
.material-detail-popup__checks span { padding: 0.3rem 0.45rem; border-radius: 0.35rem; font-size: 0.62rem; }
.material-detail-popup__checks .is-pass { background: #e8f5eb; color: #28714f; }
.material-detail-popup__checks .is-warning { background: #fff4df; color: #a56d28; }
.comparison-wizard-note { display: flex; gap: 0.55rem; align-items: flex-start; padding: 0.7rem 0.8rem; border: 1px solid #d8e5da; border-radius: 0.55rem; background: #f4f8f3; color: #617066; font-size: 0.68rem; }
.comparison-wizard-note i { color: #28714f; font-size: 1rem; }
.comparison-wizard-note strong { display: block; color: #31553f; }
.alternative-card { margin: 0.75rem; padding: 0.8rem; border: 1px solid #dde8df; border-radius: 0.7rem; background: #fff; }
.alternative-card__top { display: flex; justify-content: space-between; gap: 0.5rem; align-items: flex-start; }
.alternative-card h3 { margin: 0.35rem 0 0; color: #234b35; font-size: 0.87rem; }
.alternative-card p { margin: 0.2rem 0 0; color: #7a877e; font-size: 0.68rem; }
.alternative-card .btn { white-space: nowrap; }
.alternative-deltas { display: grid; grid-template-columns: 1fr 1fr; gap: 0.45rem; margin-top: 0.75rem; }
.delta-chip { display: grid; grid-template-columns: auto 1fr; column-gap: 0.35rem; padding: 0.45rem; border-radius: 0.5rem; }
.delta-chip i { grid-row: span 2; align-self: center; }
.delta-chip strong, .delta-chip small { display: block; }
.delta-chip strong { font-size: 0.8rem; font-variant-numeric: tabular-nums; }
.delta-chip small { font-size: 0.6rem; }
.delta-chip.is-positive { background: #e8f5eb; color: #28714f; }
.delta-chip.is-negative { background: #fff0ed; color: #a84936; }
.alternative-summary { display: flex; justify-content: space-between; gap: 0.5rem; margin-top: 0.7rem; color: #819087; font-size: 0.65rem; }
.alternative-summary b { color: #355744; font-variant-numeric: tabular-nums; }
.alternative-explanation { display: block; margin-top: 0.65rem; color: #6b796f; font-size: 0.67rem; line-height: 1.45; }
.alternative-fit { display: grid; gap: 0.2rem; margin-top: 0.65rem; color: #a56d28; font-size: 0.62rem; }
.alternative-fit.is-fit { color: #28714f; }
.alternative-fit span { display: flex; gap: 0.3rem; align-items: center; }
.alternative-card__actions { margin-top: 0.55rem; padding-top: 0.45rem; border-top: 1px solid #edf1ed; }
.material-basket-card { padding: 1rem; border: 1px solid #d9e4da; border-radius: 0.9rem; background: #fff; box-shadow: 0 8px 22px rgba(18,53,36,0.04); }
.material-basket-table { font-size: 0.72rem; }
.material-basket-table th, .material-basket-table td { padding: 0.6rem 0.7rem; border-color: #e9efea; }
.material-basket-table td strong, .material-basket-table td small { display: block; }
.material-basket-table td small { margin-top: 0.15rem; color: #87938a; font-size: 0.61rem; }
.mapping-empty { display: grid; gap: 0.35rem; margin: 1rem; padding: 1.2rem; border: 1px dashed #cbd9ce; border-radius: 0.7rem; color: #6b796f; font-size: 0.75rem; text-align: center; }
.mapping-empty i { color: #28714f; font-size: 1.4rem; }
.calculation-lineage { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; padding: 1rem; border: 1px solid #dbe5dc; border-radius: 0.9rem; background: #f8faf7; }
.calculation-lineage div { min-width: 0; }
.calculation-lineage span, .calculation-lineage strong { display: block; }
.calculation-lineage span { color: #6b7a70; font-size: 0.66rem; font-weight: 750; letter-spacing: 0.06em; text-transform: uppercase; }
.calculation-lineage strong { margin-top: 0.25rem; overflow: hidden; color: #214b34; font-size: 0.8rem; text-overflow: ellipsis; }

.audit-lock { display: flex; gap: 0.7rem; align-items: center; padding: 0.8rem 1rem; border-radius: 0.8rem; background: #173e2c; color: #fff; }
.audit-lock i { color: #8bd0a4; font-size: 1.5rem; }
@media(max-width:900px){.mapping-detail-grid,.mapping-detail-checks{grid-template-columns:repeat(2,minmax(0,1fr))}.rfq-readiness-bar{align-items:flex-start;flex-wrap:wrap}.rfq-readiness-bar span{flex-basis:calc(100% - 2rem)}}
@media(max-width:600px){.material-detail-popup__grid{grid-template-columns:1fr}.mapping-detail-tabs__head{display:block}.mapping-detail-tabs__head .badge{display:inline-block;margin-top:0.5rem}}
.audit-lock b, .audit-lock span { display: block; }
.audit-lock span { color: #bcd0c2; font-size: 0.72rem; }
.audit-stat { height: 100%; padding: 1rem; border: 1px solid #dee6df; border-radius: 0.85rem; background: #fff; }
.audit-stat strong, .audit-stat span { display: block; }
.audit-stat strong { color: #1e5839; font-size: 1.7rem; }
.audit-stat span { color: #6a786f; font-size: 0.78rem; }
.lineage-step { display: flex; gap: 0.7rem; align-items: center; margin: 0.65rem 0; padding: 0.55rem 0; border-bottom: 1px solid rgba(255,255,255,0.1); color: #dce9df; font-size: 0.78rem; }
.lineage-step span { display: grid; flex: 0 0 1.5rem; width: 1.5rem; height: 1.5rem; place-items: center; border-radius: 50%; background: #e9d8a6; color: #173e2c; font-weight: 800; }

.report-lifecycle { padding: 1.1rem; border: 1px solid #dbe5dc; border-radius: 1rem; background: #f9faf6; }
.report-lifecycle__head { display: flex; justify-content: space-between; gap: 1rem; align-items: end; margin-bottom: 1rem; }
.report-lifecycle__head h3 { margin: 0.3rem 0 0; color: #173e2c; font-size: 1.15rem; }
.report-lifecycle__head > span { color: #708078; font-size: 0.75rem; }
.report-pack-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.75rem; }
.report-pack-grid article { padding: 0.85rem; border: 1px solid #e0e7e1; border-radius: 0.75rem; background: #fff; }
.report-pack-grid article > small { color: #748179; }

@media (max-width: 1150px) {
    .concept-workspace-nav { grid-template-columns: 1fr; }
    .assembly-management-hero, .assembly-management-toolbar { align-items: flex-start; flex-direction: column; }
    .assembly-management-hero__stats { width: 100%; }
    .assembly-management-hero__stats span { flex: 1; }
    .mapping-dashboard { grid-template-columns: minmax(12rem, 0.7fr) minmax(24rem, 1.6fr); }
    .mapping-alternatives { grid-column: 1 / -1; }
    .mapping-alternatives .alternative-card { display: inline-block; width: calc(50% - 1.1rem); vertical-align: top; }
    .design-version-list { grid-template-columns: repeat(2, minmax(14rem, 1fr)); }
}

/* Print specific styles for the Reporting Hub */
@media print {
    body * {
        visibility: hidden;
    }
    #main-content, #main-content * {
        visibility: visible;
    }
    #sidebar-wrapper, .navbar, .d-print-none {
        display: none !important;
    }
    .print-section.active {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        margin: 0;
        padding: 0;
    }
    .card {
        border: none !important;
        box-shadow: none !important;
    }
}

@media (max-width: 767px) {
    .prototype-banner {
        flex-direction: column;
    }

    .work-hero,
    .capture-result__top,
    .assurance-callout,
    .studio-hero,
    .mapping-hero,
    .comparison-dock,
    .delivery-hero,
    .audit-hero,
    .assembly-studio__head,
    .report-lifecycle__head {
        align-items: flex-start;
        flex-direction: column;
    }

    .capture-choices {
        grid-template-columns: 1fr;
    }

    .capture-choice {
        min-height: auto;
    }

    .studio-library-head,
    .material-card__main,
    .material-card__footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .material-metrics,
    .studio-form-grid,
    .studio-goal-grid {
        grid-template-columns: 1fr;
    }

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

    .material-advanced-filters,
    .calculation-lineage,
    .mapping-dashboard {
        grid-template-columns: 1fr;
    }

    .mapping-alternatives { grid-column: auto; }
    .mapping-alternatives .alternative-card { display: block; width: auto; }
    .mapping-kpis { grid-template-columns: 1fr; }
    .mapping-toolbar .badge { margin-left: 0; }
    .design-version-list { grid-template-columns: 1fr; }

    .material-search {
        flex-wrap: wrap;
    }

    .material-search .form-control {
        flex: 1 1 75%;
    }

    .material-result-count {
        width: 100%;
        margin-left: 0;
    }

    .readiness-signoff {
        align-items: flex-start;
        flex-direction: column;
    }

    .readiness-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 0.25rem;
    }

    .readiness-tabs .nav-link {
        white-space: nowrap;
    }

    .detail-erd-canvas .mermaid {
        min-width: 48rem;
    }

    .phase-rail,
    .report-pack-grid {
        grid-template-columns: 1fr;
    }

    .assembly-totals {
        width: 100%;
        flex-direction: column;
    }

    .role-task {
        grid-template-columns: auto 1fr;
    }

    .role-task button {
        grid-column: 2;
        justify-self: start;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .phase-rail, .report-pack-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
 
/* V5 design system: project shell, lifecycle stages and process tabs */
:root {
    --v5-bg: #f4f7f6;
    --v5-panel: #fff;
    --v5-line: #dfe8e4;
    --v5-line-soft: #edf3f0;
    --v5-text: #10223f;
    --v5-muted: #67788d;
    --v5-green: #14845f;
    --v5-green-soft: #e8f5ef;
    --v5-radius: 10px;
    --v5-shadow: 0 4px 18px rgba(17, 34, 58, .06);
}

body {
    background: var(--v5-bg);
    color: var(--v5-text);
}

#wrapper {
    min-height: 100vh;
}

#sidebar-wrapper {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    width: 236px;
    min-width: 236px;
    height: 100vh;
    flex-direction: column;
    margin-left: 0;
    overflow-y: auto;
    padding: 15px 11px;
    background: #fafcfb !important;
    border-right: 1px solid var(--v5-line) !important;
}

#sidebar-wrapper .sidebar-heading.brand {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 3px 8px 15px;
    color: var(--v5-text) !important;
}

.brand-logo {
    display: block;
    width: 31px;
    height: 31px;
    flex: 0 0 31px;
    border-radius: 6px;
    background: linear-gradient(135deg, #12a16c, #0c7453);
    clip-path: polygon(0 55%, 46% 0, 100% 0, 76% 55%, 31% 100%, 0 100%);
}

.sidebar-heading.brand strong {
    display: block;
    color: var(--v5-text);
    font-size: 18px;
    line-height: 1;
}

.sidebar-heading.brand small,
.project-card small,
.sidebar-user small {
    display: block;
    color: var(--v5-muted);
    font-size: 10px;
}

.project-card {
    margin-bottom: 12px;
    padding: 10px;
    border: 1px solid var(--v5-line);
    border-radius: 8px;
    background: #fff;
}

.project-card strong {
    display: block;
    color: var(--v5-text);
    font-size: 12px;
}

.project-card small {
    margin-top: 3px;
}

#sidebar-wrapper .list-group {
    flex: 0 0 auto;
}

.sidebar-service-group {
    padding: 0.35rem 0.35rem 0.55rem;
    border-bottom: 1px solid var(--v5-line-soft);
}

.sidebar-service-heading {
    gap: 0.55rem;
    padding: 0.45rem 0.2rem 0.6rem;
}

.sidebar-service-heading > span {
    width: 1.7rem;
    height: 1.7rem;
    flex-basis: 1.7rem;
    border-color: #c9d9d1;
    border-radius: 0.5rem;
    color: var(--v5-green);
}

.sidebar-service-heading strong {
    color: #263c55;
    font-size: 0.78rem;
}

.sidebar-service-heading small {
    color: var(--v5-muted);
}

#sidebar-wrapper .sidebar-service-group .list-group-item,
#sidebar-wrapper .sidebar-service-group .list-group-item.bg-dark {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 2px 0;
    padding: 8px 9px;
    border: 0;
    border-radius: 7px;
    background: transparent !important;
    color: #34465c !important;
    font-size: 12px;
}

#sidebar-wrapper .sidebar-service-group .list-group-item i {
    width: 1.25rem;
    color: #8aa097;
}

#sidebar-wrapper .sidebar-service-group .list-group-item:hover {
    background: #eff5f2 !important;
    color: #0b694b !important;
}

#sidebar-wrapper .sidebar-service-group .list-group-item.active {
    background: #e5f3ed !important;
    color: #0b694b !important;
    font-weight: 700;
    box-shadow: none;
}

#sidebar-wrapper .sidebar-service-group .list-group-item.active i {
    color: var(--v5-green);
}

#sidebar-wrapper .sidebar-service-group--foundation .list-group-item {
    background: transparent !important;
    color: #34465c !important;
}

.progress-card {
    margin-top: 18px;
    padding: 10px;
    border: 1px solid var(--v5-line);
    border-radius: 9px;
    background: #fff;
}

.progress-card > strong {
    color: var(--v5-text);
    font-size: 12px;
}

.progress-track {
    height: 7px;
    margin: 8px 0 4px;
    overflow: hidden;
    border-radius: 99px;
    background: #e7eeeb;
}

.progress-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--v5-green);
}

.progress-value {
    color: var(--v5-muted);
    font-size: 10px;
}

.progress-check {
    padding: 4px 0;
    color: #4d6074;
    font-size: 11px;
}

.progress-check.is-done {
    color: #0b7452;
}

.sidebar-user {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 15px;
    padding: 10px;
    border-top: 1px solid var(--v5-line);
}

.sidebar-user strong {
    display: block;
    color: var(--v5-text);
    font-size: 12px;
}

.avatar {
    display: grid;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    place-items: center;
    border-radius: 50%;
    background: #199469;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}

#page-content-wrapper {
    width: calc(100% - 236px);
    min-width: 0;
}

#page-content-wrapper > .navbar {
    min-height: 58px;
    background: #fff !important;
    border-color: var(--v5-line) !important;
}

#page-content-wrapper > .navbar .container-fluid {
    align-items: center;
    gap: 12px;
}

#menu-toggle {
    border-color: var(--v5-line);
    background: #fff;
    color: #607185;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.header-actions .form-select {
    width: auto;
    min-width: 136px;
    border-color: var(--v5-line);
    color: #17334d;
    font-size: 11px;
}

.header-actions .btn {
    white-space: nowrap;
}

.header-actions .btn-success,
#main-content .btn-success {
    border-color: var(--v5-green);
    background: var(--v5-green);
}

.header-actions .nav-link {
    color: #34465c;
    font-size: 11px;
}

#main-content {
    padding: 18px !important;
}

#main-content > .card,
#main-content .card {
    border-color: var(--v5-line);
    border-radius: var(--v5-radius);
    box-shadow: var(--v5-shadow);
}

#main-content .card-header {
    border-color: var(--v5-line);
    background: #fff !important;
}

.studio-hero {
    min-height: 76px;
    align-items: flex-start;
    padding: 0 0 9px;
    border-bottom: 1px solid var(--v5-line);
    border-radius: 0;
    background: transparent;
    color: var(--v5-text);
    box-shadow: none;
}

.studio-hero__eyebrow {
    margin-bottom: 7px;
    color: #718196;
    opacity: 1;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

.studio-hero h1 {
    color: var(--v5-text);
    font-size: 26px;
}

.studio-hero p {
    color: var(--v5-muted);
    font-size: 12px;
}

.studio-hero .btn-outline-light {
    border-color: var(--v5-line);
    color: #17334d;
}

.studio-hero .btn-outline-light:hover {
    background: #f7faf9;
}

.process-lifecycle {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
    color: var(--v5-muted);
    font-size: 10px;
}

.process-lifecycle__label {
    margin-right: 2px;
}

.process-lifecycle .btn {
    padding: 5px 8px;
    border-color: var(--v5-line);
    border-radius: 7px;
    background: #fff;
    color: #17334d;
    font-size: 11px;
}

.process-lifecycle .btn:hover {
    background: #f7faf9;
}

.process-stagebar {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 10px;
    overflow: hidden;
    border: 1px solid var(--v5-line);
    border-radius: 9px;
    background: #fff;
}

.process-stage {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 10px 11px;
    border: 0;
    border-right: 1px solid var(--v5-line-soft);
    background: #fff;
    color: #34465c;
    text-align: left;
}

.process-stage:last-child {
    border-right: 0;
}

.process-stage:hover {
    background: #f7faf9;
}

.process-stage.is-active {
    border-bottom: 2px solid var(--v5-green);
    background: #eaf7f2;
    color: #0b694b;
}

.process-stage__number {
    display: grid;
    width: 25px;
    height: 25px;
    flex: 0 0 25px;
    place-items: center;
    border-radius: 50%;
    background: #edf2f4;
    color: #486176;
    font-size: 11px;
    font-weight: 700;
}

.process-stage.is-active .process-stage__number {
    background: var(--v5-green);
    color: #fff;
}

.process-stage strong,
.process-stage small {
    display: block;
}

.process-stage strong {
    overflow: hidden;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.process-stage small {
    margin-top: 2px;
    color: var(--v5-muted);
    font-size: 10px;
    white-space: nowrap;
}

.studio-progress {
    display: none;
}

.nav-tabs,
.mapping-detail-tabs__nav {
    border-bottom: 1px solid var(--v5-line);
}

.nav-tabs .nav-link,
.mapping-detail-tabs__nav button {
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: #50647a;
    font-size: 12px;
    font-weight: 500;
}

.nav-tabs .nav-link {
    padding: 10px 12px;
}

.nav-tabs .nav-link:hover,
.mapping-detail-tabs__nav button:hover {
    border-bottom-color: #b8d8c8;
    color: #0a6e4f;
}

.nav-tabs .nav-link.active,
.mapping-detail-tabs__nav button.is-active {
    border-bottom-color: var(--v5-green);
    background: transparent;
    color: #0a6e4f;
    font-weight: 700;
}

.mapping-detail-tabs__nav {
    gap: 20px;
    padding: 0 12px;
}

.mapping-detail-tabs__nav button {
    padding: 10px 0;
}

.mapping-detail-tabs__body,
.tab-content {
    padding-top: 10px;
}

.table,
#main-content table {
    --bs-table-border-color: var(--v5-line-soft);
}

#main-content .table thead th {
    background: #f7faf9;
    color: #34485f;
    font-size: 10px;
    white-space: nowrap;
}

#main-content .table td,
#main-content .table th {
    padding: 9px;
    vertical-align: top;
}

.process-stagebar + .row,
.process-stagebar + .panel {
    margin-top: 0;
}

@media (max-width: 1199px) {
    .process-stagebar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    #sidebar-wrapper {
        position: fixed;
        left: 0;
        top: 0;
        transform: translateX(-100%);
        transition: transform .25s ease-out;
    }

    #wrapper.toggled #sidebar-wrapper {
        transform: translateX(0);
        margin-left: 0;
    }

    #page-content-wrapper {
        width: 100%;
    }

    .header-actions {
        gap: 4px;
    }

    .header-actions .header-create-project,
    .header-actions .nav-link {
        display: none;
    }

    .header-actions .form-select {
        min-width: 112px;
    }

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

    .process-stage:nth-child(2n) {
        border-right: 0;
    }

    .process-stage strong {
        font-size: 10px;
    }

    .process-stage small {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .mapping-detail-tabs__nav {
        flex-wrap: nowrap;
        overflow-x: auto;
    }
}
 
.material-product-grid--table {
    display: block;
}
 
.studio-hero__breadcrumb {
    margin-bottom: 7px;
    color: #718196;
    font-size: 12px;
}
 
/* EcoVisa SaaS layer: public brand language carried into the operating shell */
:root {
    --ev-ink: #1a3a2a;
    --ev-ink-soft: #375448;
    --ev-sage: #7aa897;
    --ev-sage-light: #e7f0e9;
    --ev-cream: #f5f5eb;
    --ev-border: #d8e2d8;
}

body {
    background: var(--ev-cream);
    color: var(--ev-ink);
}

#sidebar-wrapper {
    background: #fbfcf6 !important;
    border-right-color: var(--ev-border) !important;
}

#sidebar-wrapper .sidebar-heading.brand strong,
.sidebar-heading.brand small,
.project-card strong,
.sidebar-user strong {
    color: var(--ev-ink);
}

#sidebar-wrapper .brand-logo {
    width: 135px;
    height: 42px;
    flex: 0 0 135px;
    border-radius: 0;
    background: transparent;
    clip-path: none;
    object-fit: contain;
}

#page-content-wrapper > .navbar {
    background: rgba(251, 252, 246, .96) !important;
    border-color: var(--ev-border) !important;
}

.header-context {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    color: var(--ev-ink-soft);
    font-size: 11px;
}

.header-context__tenant {
    font-weight: 700;
    color: var(--ev-ink);
}

.header-context__divider {
    color: #aab9ad;
}

.header-context__status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 4px;
    padding: 4px 7px;
    border: 1px solid #cfe2d2;
    border-radius: 999px;
    background: var(--ev-sage-light);
    color: #246347;
    font-size: 10px;
}

.header-search {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border-color: var(--ev-border);
    color: var(--ev-ink-soft);
}

.header-search kbd {
    padding: 1px 4px;
    border: 1px solid #d6e0d7;
    border-radius: 4px;
    background: #fff;
    color: #789083;
    font-size: 9px;
}

.header-notifications {
    position: relative;
    width: 32px;
    padding-inline: 0;
    border-color: var(--ev-border);
    color: var(--ev-ink-soft);
}

.header-notification-count {
    position: absolute;
    top: -5px;
    right: -5px;
    display: grid;
    width: 15px;
    height: 15px;
    place-items: center;
    border-radius: 50%;
    background: #d88463;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
}

.workspace-context {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 62px;
    padding: 11px 20px;
    border-bottom: 1px solid var(--ev-border);
    background: rgba(247, 248, 239, .84);
}

.workspace-context__identity,
.workspace-context__details {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.workspace-context__identity {
    flex-wrap: wrap;
}

.workspace-context__identity strong {
    color: var(--ev-ink);
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 16px;
}

.workspace-context__identity > span:not(.workspace-context__eyebrow) {
    color: #6e8476;
    font-size: 11px;
}

.workspace-context__eyebrow {
    width: 100%;
    color: var(--ev-sage);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.workspace-context__details {
    flex-wrap: wrap;
    justify-content: flex-end;
    color: #60796b;
    font-size: 10px;
}

.workspace-context__details span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding-left: 9px;
    border-left: 1px solid var(--ev-border);
}

.workspace-context__details i {
    color: var(--ev-sage);
}

.workspace-context__details .workspace-context__ready {
    color: #39745b;
    font-weight: 700;
}

#main-content h1,
#main-content h2,
#main-content h3 {
    color: var(--ev-ink);
}

#main-content h1,
.studio-hero h1,
.work-hero h1,
.mapping-hero h1 {
    font-family: Georgia, 'Times New Roman', serif;
    letter-spacing: -.025em;
}

#main-content .btn-success,
.header-actions .btn-success {
    border-color: var(--ev-ink);
    background: var(--ev-ink);
}

#main-content .btn-success:hover,
.header-actions .btn-success:hover {
    border-color: #112b1f;
    background: #112b1f;
}

#toast-region {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 1080;
}

.ecovisa-toast {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 260px;
    padding: 12px 15px;
    border: 1px solid #c9dfd0;
    border-radius: 9px;
    background: #fbfffb;
    box-shadow: 0 12px 30px rgba(26, 58, 42, .16);
    color: var(--ev-ink);
    font-size: 12px;
}

.ecovisa-toast i {
    color: #4f9975;
}

.global-search-results {
    display: grid;
    gap: 4px;
}

.global-search-result {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 11px 12px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: #f8faf6;
    color: var(--ev-ink);
    text-align: left;
}

.global-search-result:hover {
    border-color: #c9dfd0;
    background: var(--ev-sage-light);
}

.global-search-result strong,
.global-search-result small {
    display: block;
}

.global-search-result strong {
    font-size: 12px;
}

.global-search-result small {
    margin-top: 2px;
    color: #71877b;
    font-size: 10px;
}

.global-search-result > i {
    color: var(--ev-sage);
}

.global-search-empty {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 24px 10px;
    color: #789083;
    font-size: 12px;
}

.notification-list {
    display: grid;
    gap: 10px;
}

.notification-list article {
    display: flex;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--ev-border);
    border-radius: 9px;
    background: #fafcf8;
}

.notification-list__icon {
    display: grid;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    place-items: center;
    border-radius: 8px;
    background: var(--ev-sage-light);
    color: #398163;
}

.notification-list strong,
.notification-list p,
.notification-list small {
    display: block;
}

.notification-list strong {
    color: var(--ev-ink);
    font-size: 12px;
}

.notification-list p {
    margin: 3px 0;
    color: #6c8175;
    font-size: 11px;
}

.notification-list small {
    color: #9a6d4c;
    font-size: 10px;
}

@media (max-width: 767px) {
    .header-context {
        display: none;
    }

    .header-search span,
    .header-search kbd,
    .header-actions .header-save {
        display: none;
    }

    .workspace-context {
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
        padding: 10px 14px;
    }

    .workspace-context__details {
        justify-content: flex-start;
    }

    .workspace-context__details span:nth-child(2),
    .workspace-context__details span:nth-child(3) {
        display: none;
    }

    #toast-region {
        right: 12px;
        bottom: 12px;
        left: 12px;
    }

    .ecovisa-toast {
        min-width: 0;
    }
}
 
/* Workflow surfaces: shared pattern for LCA, ESG, assessment and integration routes */
.workflow-page__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
}

.workflow-page__eyebrow,
.workflow-card__kicker {
    display: block;
    margin-bottom: 5px;
    color: var(--ev-sage);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.workflow-page__header h1 {
    margin-bottom: 4px;
    font-size: 30px;
}

.workflow-page__header p,
.workflow-card__head p {
    margin: 0;
    color: #71877b;
    font-size: 12px;
}

.workflow-page__scope {
    flex: 0 0 auto;
    padding: 7px 10px;
    border: 1px solid var(--ev-border);
    border-radius: 999px;
    background: #fbfcf6;
    color: #5e7869;
    font-size: 10px;
}

.workflow-page__scope i {
    margin-right: 4px;
    color: var(--ev-sage);
}

.workflow-stepper {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 18px;
    border: 1px solid var(--ev-border);
    border-radius: 9px;
    background: #fbfcf6;
    overflow: hidden;
}

.workflow-step {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    padding: 10px 11px;
    border-right: 1px solid var(--ev-border);
    color: #91a197;
    font-size: 10px;
}

.workflow-step:last-child {
    border-right: 0;
}

.workflow-step span {
    display: grid;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    place-items: center;
    border-radius: 50%;
    background: #e8eee7;
    font-size: 10px;
    font-weight: 700;
}

.workflow-step strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workflow-step.is-done {
    color: #4c7e62;
}

.workflow-step.is-done span,
.workflow-step.is-active span {
    background: var(--ev-sage);
    color: #fff;
}

.workflow-step.is-active {
    background: var(--ev-sage-light);
    color: var(--ev-ink);
}

.workflow-metric {
    min-height: 92px;
    padding: 13px;
    border: 1px solid var(--ev-border);
    border-radius: 9px;
    background: #fbfcf6;
}

.workflow-metric span,
.workflow-metric small {
    display: block;
    color: #789083;
    font-size: 10px;
}

.workflow-metric strong {
    display: block;
    margin: 5px 0 2px;
    color: var(--ev-ink);
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 23px;
}

.workflow-card {
    padding: 18px;
    border: 1px solid var(--ev-border);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 4px 18px rgba(26, 58, 42, .05);
}

.workflow-card--muted {
    background: #f7f8ef;
    box-shadow: none;
}

.workflow-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 17px;
}

.workflow-card__head h2,
.workflow-card__head h3 {
    margin: 0 0 4px;
    color: var(--ev-ink);
    font-family: Georgia, 'Times New Roman', serif;
}

.workflow-card__head h2 {
    font-size: 21px;
}

.workflow-card__head h3 {
    font-size: 18px;
}

.workflow-checklist {
    display: grid;
    gap: 11px;
    margin: 17px 0;
    padding: 0;
    list-style: none;
    color: #60796b;
    font-size: 11px;
}

.workflow-checklist i {
    width: 20px;
    color: var(--ev-sage);
}

.workflow-note {
    display: flex;
    gap: 8px;
    padding: 11px;
    border-left: 3px solid var(--ev-sage);
    background: #edf4ed;
    color: #5a7365;
    font-size: 10px;
}

.workflow-note i {
    color: var(--ev-sage);
}

.import-dropzone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 20px;
    border: 1px dashed #a9c4b0;
    border-radius: 9px;
    background: #f5faf4;
}

.import-dropzone > i {
    color: var(--ev-sage);
    font-size: 28px;
}

.import-dropzone > div {
    flex: 1;
}

.import-dropzone strong,
.import-dropzone span {
    display: block;
}

.import-dropzone strong {
    color: var(--ev-ink);
    font-size: 13px;
}

.import-dropzone span {
    margin-top: 4px;
    color: #789083;
    font-size: 10px;
}

.import-settings {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 18px;
    margin-top: 13px;
    color: #71877b;
    font-size: 10px;
}

.import-settings strong {
    margin-right: 4px;
    color: var(--ev-ink-soft);
}

.module-grid,
.framework-choice-grid,
.integration-grid {
    display: grid;
    gap: 10px;
}

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

.module-tile {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 11px;
    padding: 13px;
    border: 1px solid var(--ev-border);
    border-radius: 9px;
    background: #fbfcf6;
    color: var(--ev-ink);
    text-align: left;
}

.module-tile:hover,
.framework-choice:hover,
.integration-card:hover {
    border-color: #a9cdb5;
    background: #f3f9f2;
}

.module-tile__icon,
.framework-choice__icon,
.integration-card__icon {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 9px;
    background: var(--ev-sage-light);
    color: #4f9975;
}

.module-tile strong,
.module-tile small {
    display: block;
}

.module-tile strong {
    font-size: 12px;
}

.module-tile small {
    margin-top: 3px;
    color: #789083;
    font-size: 10px;
}

.module-tile em {
    color: #5d9973;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
}

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

.framework-choice {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: start;
    gap: 11px;
    padding: 14px;
    border: 1px solid var(--ev-border);
    border-radius: 9px;
    background: #fbfcf6;
}

.framework-choice strong,
.framework-choice small,
.framework-choice p {
    display: block;
}

.framework-choice strong {
    color: var(--ev-ink);
    font-size: 13px;
}

.framework-choice small {
    margin-top: 3px;
    color: #62806f;
    font-size: 10px;
}

.framework-choice p {
    margin: 8px 0 0;
    color: #789083;
    font-size: 10px;
}

.control-tile {
    padding: 12px;
    border: 1px solid var(--ev-border);
    border-radius: 8px;
    background: #fff;
}

.control-tile span,
.control-tile strong,
.control-tile small {
    display: block;
}

.control-tile span,
.control-tile small {
    color: #789083;
    font-size: 10px;
}

.control-tile strong {
    margin: 4px 0;
    color: var(--ev-ink);
    font-size: 12px;
}

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

.integration-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 11px;
    padding: 13px;
    border: 1px solid var(--ev-border);
    border-radius: 9px;
    background: #fbfcf6;
}

.integration-card strong,
.integration-card p {
    display: block;
}

.integration-card strong {
    color: var(--ev-ink);
    font-size: 12px;
}

.integration-card p {
    margin: 3px 0 6px;
    color: #789083;
    font-size: 10px;
}

.integration-card .btn-link {
    padding: 0;
    color: #4f9975;
    font-size: 10px;
}

.report-submission-gate {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(380px, 1.5fr) auto;
    align-items: center;
    gap: 18px;
    padding: 16px 18px;
    border: 1px solid #cbded0;
    border-radius: 10px;
    background: #f3f9f2;
}

.report-submission-gate h2,
.report-submission-gate p {
    margin: 0;
}

.report-submission-gate h2 {
    color: var(--ev-ink);
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 18px;
}

.report-submission-gate p {
    color: #6d8275;
    font-size: 10px;
}

.report-gate-stages {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
}

.report-gate-stages span {
    color: #9bad9f;
    font-size: 10px;
    white-space: nowrap;
}

.report-gate-stages i {
    margin-right: 4px;
}

.report-gate-stages .is-done,
.report-gate-stages .is-current {
    color: #438060;
    font-weight: 700;
}

.report-gate-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

@media (max-width: 991px) {
    .workflow-page__header,
    .report-submission-gate {
        align-items: flex-start;
        grid-template-columns: 1fr;
        flex-direction: column;
    }

    .workflow-stepper {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .report-gate-stages {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

@media (max-width: 767px) {
    .workflow-page__header h1 {
        font-size: 25px;
    }

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

    .workflow-step:nth-child(2n) {
        border-right: 0;
    }

    .module-grid,
    .framework-choice-grid,
    .integration-grid {
        grid-template-columns: 1fr;
    }

    .workflow-card {
        padding: 14px;
    }

    .workflow-card__head,
    .import-dropzone {
        align-items: flex-start;
        flex-direction: column;
    }

    .import-dropzone > i {
        font-size: 23px;
    }

    .report-gate-actions {
        width: 100%;
        justify-content: space-between;
    }
}