/*
 * DGxOne Mission Control Workspace
 * Live runtime console
 */

.dgx-mission-workspace {
    position: relative;
    display: block !important;
    box-sizing: border-box;
    width: 100%;
    min-height: 0;
    margin: 0 !important;
    padding: 24px;
    color: var(--dgx-text-primary);
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.018),
            rgba(255, 255, 255, 0)
        );
    overflow: visible;
}

.dgx-mission-command-header,
.dgx-mission-surface {
    min-width: 0;
    border: 1px solid var(--dgx-border-soft);
    border-radius: var(--dgx-radius-lg);
    background:
        linear-gradient(
            150deg,
            rgba(255, 255, 255, 0.035),
            rgba(255, 255, 255, 0.006) 64%
        ),
        var(--dgx-glass-soft);
    box-shadow: var(--dgx-shadow-1);
    backdrop-filter: blur(22px) saturate(118%);
    -webkit-backdrop-filter: blur(22px) saturate(118%);
}

.dgx-mission-command-header {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
    gap: 18px;
    margin-bottom: 18px;
    padding: 22px;
    overflow: visible;
}

.dgx-mission-command-copy {
    min-width: 0;
}

.dgx-mission-command-copy h2 {
    margin: 5px 0 8px;
    font-size: clamp(1.85rem, 2.4vw, 3rem);
    letter-spacing: 0;
    line-height: 1.05;
}

.dgx-mission-command-copy p {
    max-width: 760px;
    margin: 0;
    color: var(--dgx-text-secondary);
    line-height: 1.55;
}

.dgx-mission-command-status {
    display: grid;
    align-content: start;
    gap: 12px;
    min-width: 0;
}

.dgx-mission-live-indicator {
    display: inline-flex;
    align-items: center;
    justify-self: start;
    gap: 10px;
    min-width: 0;
    color: var(--dgx-text-secondary);
}

.dgx-mission-runtime-pulse {
    width: 10px;
    height: 10px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--dgx-text-muted);
    box-shadow: none;
}

.dgx-mission-workspace[data-mission-status="running"] .dgx-mission-runtime-pulse {
    background: var(--dgx-success);
    box-shadow:
        0 0 0 5px rgba(88, 214, 163, 0.08),
        0 0 18px rgba(88, 214, 163, 0.45);
    animation: dgx-mission-runtime-breathe 2.4s ease-in-out infinite;
}

.dgx-mission-workspace[data-mission-status="failed"] .dgx-mission-runtime-pulse,
.dgx-mission-workspace[data-mission-status="warning"] .dgx-mission-runtime-pulse {
    background: var(--dgx-warning);
    box-shadow: 0 0 18px rgba(255, 196, 87, 0.28);
}

.dgx-mission-header-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 118px), 1fr));
    gap: 8px;
}

.dgx-mission-header-metrics > div {
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--dgx-border-soft);
    border-radius: var(--dgx-radius-md);
    background: rgba(255, 255, 255, 0.025);
}

.dgx-mission-header-metrics small,
.dgx-mission-header-metrics strong {
    display: block;
    min-width: 0;
}

.dgx-mission-header-metrics small {
    margin-bottom: 4px;
    color: var(--dgx-text-muted);
    font-size: var(--dgx-text-xs);
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.dgx-mission-header-metrics strong {
    overflow: hidden;
    color: var(--dgx-text-primary);
    font-size: var(--dgx-text-sm);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dgx-mission-progress-track {
    height: 7px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}

.dgx-mission-progress-track > div {
    width: 0%;
    height: 100%;
    border-radius: inherit;
    background:
        linear-gradient(
            90deg,
            var(--dgx-frost-300),
            var(--dgx-success)
        );
    transition: width 220ms var(--dgx-ease-premium);
}

.dgx-mission-workspace-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(290px, 340px);
    align-items: start;
    gap: 18px;
    min-height: 0;
    overflow: visible;
}

.dgx-mission-primary,
.dgx-mission-secondary {
    min-width: 0;
}

.dgx-mission-primary,
.dgx-mission-secondary {
    display: grid;
    align-content: start;
    gap: 18px;
}

.dgx-mission-secondary {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}

.dgx-mission-surface {
    height: auto;
    min-height: 0;
    max-height: none;
    padding: 18px;
    overflow: visible;
}

.dgx-mission-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    min-width: 0;
    margin-bottom: 14px;
}

.dgx-mission-section-head h3,
.dgx-mission-surface h3 {
    margin: 5px 0 0;
    font-size: var(--dgx-text-lg);
    letter-spacing: 0;
}

.dgx-mission-section-head small {
    flex: 0 0 auto;
    max-width: 45%;
    color: var(--dgx-text-muted);
    text-align: right;
}

.dgx-mission-surface p {
    margin: 0;
    color: var(--dgx-text-secondary);
    line-height: 1.5;
}

.dgx-mission-pipeline {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 138px), 1fr));
    gap: 10px;
    min-width: 0;
    overflow: visible;
}

.dgx-mission-stage {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
    min-height: 132px;
    padding: 12px;
    border: 1px solid var(--dgx-border-soft);
    border-radius: var(--dgx-radius-md);
    background: rgba(255, 255, 255, 0.022);
    overflow: visible;
}

.dgx-mission-stage[data-state="queued"] {
    border-color: rgba(143, 200, 248, 0.28);
}

.dgx-mission-stage[data-state="running"] {
    border-color: rgba(88, 214, 163, 0.46);
    background: rgba(88, 214, 163, 0.045);
    box-shadow: 0 0 20px rgba(88, 214, 163, 0.08);
}

.dgx-mission-stage[data-state="completed"] {
    border-color: rgba(88, 214, 163, 0.3);
}

.dgx-mission-stage[data-state="warning"],
.dgx-mission-stage[data-state="failed"] {
    border-color: rgba(255, 196, 87, 0.44);
    background: rgba(255, 196, 87, 0.045);
}

.dgx-mission-stage-index {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 1px solid var(--dgx-border-soft);
    border-radius: 50%;
    color: var(--dgx-text-muted);
    font-size: var(--dgx-text-xs);
}

.dgx-mission-stage strong,
.dgx-mission-stage small,
.dgx-mission-stage p {
    display: block;
    min-width: 0;
}

.dgx-mission-stage strong {
    margin-bottom: 5px;
    font-size: var(--dgx-text-sm);
}

.dgx-mission-stage small {
    margin-bottom: 8px;
    color: var(--dgx-frost-100);
    font-size: var(--dgx-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.dgx-mission-stage p {
    color: var(--dgx-text-muted);
    font-size: var(--dgx-text-xs);
    line-height: 1.4;
}

.dgx-mission-agent-grid,
.dgx-mission-compact-list,
.dgx-mission-list,
.dgx-mission-timeline {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.dgx-mission-agent-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
}

.dgx-mission-agent-card,
.dgx-mission-list-item,
.dgx-mission-timeline-item,
.dgx-mission-empty-state {
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--dgx-border-soft);
    border-radius: var(--dgx-radius-md);
    background: rgba(255, 255, 255, 0.022);
}

.dgx-mission-agent-card {
    display: grid;
    gap: 9px;
}

.dgx-mission-agent-card[data-state="running"] {
    border-color: rgba(88, 214, 163, 0.42);
}

.dgx-mission-agent-card[data-state="failed"] {
    border-color: rgba(255, 196, 87, 0.44);
}

.dgx-mission-agent-card strong,
.dgx-mission-list-item strong,
.dgx-mission-timeline-item strong {
    display: block;
    margin-bottom: 4px;
    font-size: var(--dgx-text-sm);
}

.dgx-mission-agent-card span,
.dgx-mission-list-item span,
.dgx-mission-timeline-item span,
.dgx-mission-empty-state {
    color: var(--dgx-text-muted);
    font-size: var(--dgx-text-sm);
    line-height: 1.45;
}

.dgx-mission-agent-meter {
    height: 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}

.dgx-mission-agent-meter > div {
    width: 0%;
    height: 100%;
    border-radius: inherit;
    background: var(--dgx-frost-200);
}

.dgx-mission-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    align-items: start;
    gap: 18px;
    min-height: 0;
    overflow: visible;
}

.dgx-mission-timeline {
    max-height: min(420px, 48vh);
    overflow: auto;
    padding-right: 2px;
}

.dgx-mission-timeline-item {
    display: grid;
    gap: 4px;
}

.dgx-mission-timeline-meta {
    color: var(--dgx-text-muted);
    font-size: var(--dgx-text-xs);
}

.dgx-mission-metric {
    display: block;
    margin: 8px 0;
    color: var(--dgx-frost-100);
    font-size: 2.2rem;
    letter-spacing: 0;
    line-height: 1;
}

.dgx-mission-next-action-card {
    display: grid;
    gap: 10px;
}

.dgx-mission-report-surface {
    margin-top: 18px;
}

.dgx-mission-report-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.dgx-mission-report-button {
    min-width: 0;
    padding: 10px 13px;
    border: 1px solid var(--dgx-border-active);
    border-radius: var(--dgx-radius-sm);
    color: var(--dgx-text-primary);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    background:
        linear-gradient(
            135deg,
            rgba(143, 200, 248, 0.18),
            rgba(61, 145, 206, 0.08)
        );
    box-shadow: var(--dgx-shadow-frost);
}

.dgx-mission-report-button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
    box-shadow: none;
}

.dgx-mission-report-preview {
    min-height: 132px;
    padding: 14px;
    border: 1px dashed var(--dgx-border-medium);
    border-radius: var(--dgx-radius-md);
    color: var(--dgx-text-secondary);
    line-height: 1.55;
    background: rgba(5, 8, 13, 0.18);
    overflow: visible;
    white-space: pre-wrap;
}

.dgx-nav-glyph-mission {
    color: var(--dgx-frost-200);
    text-shadow: 0 0 10px rgba(143, 200, 248, 0.45);
}

@keyframes dgx-mission-runtime-breathe {
    0%,
    100% {
        opacity: 0.72;
        transform: scale(0.92);
    }

    50% {
        opacity: 1;
        transform: scale(1.06);
    }
}

@media (max-width: 1320px) {
    .dgx-mission-pipeline {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 138px), 1fr));
    }

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

@media (max-width: 1120px) {
    .dgx-mission-command-header,
    .dgx-mission-workspace-grid,
    .dgx-mission-detail-grid {
        grid-template-columns: 1fr;
    }

    .dgx-mission-secondary {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    }
}

@media (max-width: 760px) {
    .dgx-mission-workspace {
        padding: 16px;
    }

    .dgx-mission-header-metrics,
    .dgx-mission-pipeline,
    .dgx-mission-agent-grid,
    .dgx-mission-secondary {
        grid-template-columns: 1fr;
    }

    .dgx-mission-section-head {
        flex-direction: column;
    }

    .dgx-mission-section-head small {
        max-width: none;
        text-align: left;
    }
}
