/* ENGINE TABS: High-Layer Hierarchy (z-index: 300) */
.engine-tabs { display: flex; gap: 10px; flex-wrap: nowrap; margin-bottom: 0.8rem; position: sticky; top: -0.5rem; z-index: 300; background: #0b1121; padding: 0.8rem 0; justify-content: center; width: 100%; }
.tab-btn { position: relative; padding: 6px 15px; border-radius: 8px; cursor: pointer; transition: all 0.2s; min-width: 100px; text-align: center; border: 1px solid rgba(255, 255, 255, 0.1); background: rgba(30, 41, 59, 0.4); }
.tab-btn.active { transform: scale(1.03); border-color: #fff; z-index: 10; background: rgba(255,255,255,0.05); }
.tab-lbl { font-size: 0.75rem; font-weight: 1000; letter-spacing: 0.05em; }

/* OPAQUE TAB HINT CARDS */
.tab-tooltip { display: none; position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%); background: #1e293b; border: 2px solid #7c3aed; padding: 0.8rem; border-radius: 10px; z-index: 2000; min-width: 180px; box-shadow: 0 20px 40px rgba(0,0,0,1); text-align: left; opacity: 1 !important; visibility: visible !important; }
.tab-btn:hover .tab-tooltip { display: block; }
.tool-li { font-size: 0.7rem; color: #fff; margin-bottom: 3px; display: flex; align-items: flex-start; gap: 6px; line-height:1.4; font-weight: 600; }
.tool-li::before { content: "\2022"; color: #7c3aed; font-weight:900; }

/* CINEMATIC JOURNEY OVERLAY */
.journey-overlay { position: fixed; inset: 0; z-index: 5000; background: #050810; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; }
.journey-card { width: 85%; max-width: 800px; padding: 3rem; background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.1); border-radius: 2.5rem; backdrop-filter: blur(40px); box-shadow: 0 30px 80px rgba(0,0,0,1); position: relative; }
.journey-timer { position: absolute; bottom: 0; left: 0; height: 5px; background: #f59e0b; transition: width linear; }
.floating-controls { position: fixed; bottom: 40px; left: 50%; transform: translateX(-50%); display: flex; gap: 0.8rem; background: rgba(255,255,255,0.05); backdrop-filter: blur(20px); padding: 1rem 2rem; border-radius: 2rem; border: 1px solid rgba(255,255,255,0.1); z-index: 1100; box-shadow: 0 10px 30px rgba(0,0,0,0.5); }
.ctrl-btn { padding: 8px 18px; border-radius: 0.6rem; background: rgba(255,255,255,0.1); color: white; border: 1px solid rgba(255,255,255,0.1); font-weight: 800; text-transform: uppercase; transition: all 0.2s; cursor: pointer; font-size: 0.75rem; }
.ctrl-btn:hover { background: rgba(255,255,255,0.2); transform: scale(1.05); }
.ctrl-btn.active { background: #f59e0b; color: black; border-color: #f59e0b; }
.lowercase-brand { text-transform: lowercase !important; font-variant: normal !important; }

/* OUTCOME ROW: v1.1 Signature Component */
.outcome-row-link { text-decoration: none; display: block; width: 100%; cursor: pointer; }

/* MASTER HEADERS */
.matrix-header { display: flex; align-items: center; background: rgba(255,255,255,0.02); border-bottom: 2px solid rgba(255,255,255,0.1); padding: 8px 0; margin-bottom: 10px; border-radius: 4px; position: sticky; top: 0; z-index: 100; backdrop-filter: blur(8px); }
.header-col { font-size: 0.55rem; font-weight: 1000; color: #6366f1; text-transform: uppercase; letter-spacing: 0.25em; padding: 0 1rem; opacity: 0.9; }

.outcome-row { 
    display: flex; align-items: stretch; gap: 0; padding: 0; 
    background: rgba(15, 23, 42, 0.6); border: 1px solid rgba(255, 255, 255, 0.05); 
    border-radius: 8px; margin-bottom: 0.5rem; transition: all 0.3s;
    overflow: hidden; min-height: 38px;
}
.outcome-row:hover { border-color: rgba(255, 255, 255, 0.3); background: rgba(30, 41, 59, 1.0); transform: scale(1.01); box-shadow: 0 10px 30px rgba(0,0,0,0.5); }
.outcome-seg { padding: 0.5rem 1rem; display: flex; flex-direction: column; justify-content: center; position: relative; }
.outcome-problem { flex: 1; background: rgba(239, 68, 68, 0.02); border-right: 1px solid rgba(255, 255, 255, 0.05); }
.outcome-problem .outcome-text { color: #fca5a5; font-size: 0.55rem; font-weight: 600; font-style: italic; line-height: 1.2; }
.outcome-solution { flex: 1.2; background: rgba(16, 185, 129, 0.02); border-right: 1px solid rgba(255, 255, 255, 0.05); }
.outcome-solution .outcome-text { color: #34d399; font-size: 0.6rem; font-weight: 950; line-height: 1.2; }
.outcome-result-text { flex: 1.1; background: rgba(124, 58, 237, 0.02); border-right: 1px solid rgba(255, 255, 255, 0.05); }
.outcome-result-text .outcome-text { color: #a5b4fc; font-size: 0.6rem; font-weight: 800; line-height: 1.2; }

.outcome-results { 
    width: 140px; background: rgba(245, 158, 11, 0.08); text-align: right; 
    display: flex; flex-direction: column; justify-content: center; padding: 0 1rem; gap: 0;
}
.outcome-res-val { color: #fbbf24; font-size: 0.95rem; font-weight: 1000; line-height: 1; }
.outcome-unit { font-size: 0.35rem; color: #f59e0b; font-weight: 1000; text-transform: uppercase; opacity: 1; margin-top: 1px; }

.outcome-meta { width: 110px; background: rgba(255, 255, 255, 0.03); display: flex; flex-direction: column; justify-content: center; padding: 0 1rem; border-right: 1px solid rgba(255, 255, 255, 0.1); }
.outcome-title { font-size: 0.65rem; font-weight: 1000; color: #fff; line-height: 1.1; }
