/* STEP 06J: compact optimization layout and visible SignalR proof */
.thermoai-live-grid.signalr-compact-layout {
    display: grid;
    grid-template-columns: minmax(330px, 1.02fr) minmax(560px, 1.48fr) minmax(330px, .82fr);
    gap: 10px;
    align-items: start;
}

.signalr-compact-layout .optimizer-panel-stack {
    min-width: 0;
    display: grid;
    gap: 10px;
    align-content: start;
}

.signalr-compact-layout .optimizer-panel-stack > .panel {
    min-width: 0;
    width: 100%;
    margin: 0;
}

.signalr-compact-layout .thermoai-instruments,
.signalr-compact-layout .thermoai-plant-sheet,
.signalr-compact-layout .thermoai-agent-console {
    min-height: 0;
}

.signalr-compact-layout .thermoai-cycle-control,
.signalr-compact-layout .thermoai-timeline-panel {
    grid-column: auto;
}

.signalr-compact-layout .thermoai-timeline-panel {
    min-height: 260px;
}

.signalr-compact-layout .thermoai-timeline {
    height: 205px;
    max-height: 205px;
}

.signalr-compact-layout > .thermoai-pipeline-panel,
.signalr-compact-layout > .thermoai-sheet-section {
    grid-column: 1 / -1;
}

.signalr-compact-layout .live-context-strip.three-context-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin: 9px 0;
}

.signalr-compact-layout .live-context-strip.three-context-cards > div {
    min-height: 48px;
    padding: 7px 9px;
}

.signalr-compact-layout .thermoai-flow-map {
    margin-top: 0;
}

.optimizer-approach-heading {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 9px;
    align-items: center !important;
}

.optimizer-approach-heading #optimizerApproachLiveState {
    min-width: 0;
    max-width: 260px;
    padding: 6px 9px;
    color: #eafff7;
    font-size: 10.5px !important;
    line-height: 1.25;
    text-align: center;
    white-space: normal;
}

.optimizer-signalr-proof {
    grid-column: 1 / -1;
    display: block;
    margin-top: 5px;
    color: #b9d6dd;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
}

.thermoai-nav .nav-item {
    min-height: 42px;
    line-height: 1.25;
}

.thermoai-nav .nav-item span {
    flex: 0 0 24px;
}

@media (max-width: 1450px) {
    .thermoai-live-grid.signalr-compact-layout {
        grid-template-columns: minmax(300px, .92fr) minmax(520px, 1.45fr);
    }

    .signalr-compact-layout .optimizer-right-stack {
        grid-column: 1 / -1;
        grid-template-columns: minmax(300px, .8fr) minmax(500px, 1.2fr);
    }
}

@media (max-width: 980px) {
    .thermoai-live-grid.signalr-compact-layout,
    .signalr-compact-layout .optimizer-right-stack {
        grid-template-columns: 1fr;
    }

    .signalr-compact-layout .optimizer-right-stack {
        grid-column: auto;
    }

    .signalr-compact-layout .live-context-strip.three-context-cards {
        grid-template-columns: 1fr;
    }
}