#phase7b-returns-host { display: block; margin: 18px 0; }
.analytics-workspace > #phase7b-returns-host { grid-column: 1 / -1; width: 100%; }
.phase7b-returns { color: #172c42; container-name: phase7b-returns; container-type: inline-size; }
.phase7b-heading { margin-bottom: 13px; }
.phase7b-heading h2 { margin: 0; color: #16263d; font-size: 1.42rem; letter-spacing: -.02em; }
.phase7b-heading p { margin: 5px 0 0; color: #73808b; font-size: .84rem; }
.phase7b-hero-kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.phase7b-hero-card { min-height: 130px; box-sizing: border-box; border: 1px solid #e1ddd4; border-radius: 13px; padding: 14px; background: #fff; box-shadow: 0 7px 19px rgba(22, 38, 61, .045); }
.phase7b-hero-card.partial { border-color: #e4d6af; }.phase7b-hero-card.unavailable { border-color: #ead0ca; background: #fffdfc; }
.phase7b-card-top { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 8px; color: #273c53; font-size: .78rem; font-weight: 800; }
.phase7b-card-top > span:first-child { flex: 1 1 126px; min-width: 0; }
.phase7b-card-value { display: flex; gap: 12px; align-items: center; margin-top: 17px; }
.phase7b-card-value i { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 50%; background: #edf7f3; color: #08745f; }
.phase7b-card-value svg { width: 21px; height: 21px; }
.phase7b-card-value strong { color: #132944; font-size: clamp(1.23rem, 1.8vw, 1.72rem); font-variant-numeric: tabular-nums; letter-spacing: -.025em; white-space: nowrap; }
.phase7b-status { display: inline-flex; align-items: center; gap: 3px; padding: 4px 7px; border: 1px solid #cfe5dc; border-radius: 999px; background: #f1f9f6; color: #08745f; font-size: .62rem; font-weight: 800; letter-spacing: .02em; line-height: 1; white-space: nowrap; }
.phase7b-status b { min-width: 7px; }.phase7b-status.partial { border-color: #ead8a9; background: #fff9e9; color: #956919; }.phase7b-status.unavailable { border-color: #e7c9c3; background: #fff7f5; color: #a05349; }
.phase7b-chart-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.phase7b-chart-card.chart-frame { min-width: 0; min-height: 0; padding: 17px; border: 1px solid #e2ded5; border-radius: 13px; background: #fff; box-shadow: 0 7px 20px rgba(22, 38, 61, .04); container-type: inline-size; }
.phase7b-chart-card.chart-frame > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.phase7b-chart-card.chart-frame > header > div:first-child { min-width: 0; }
.phase7b-chart-card h3 { margin: 0; color: #152b43; font-size: 1rem; letter-spacing: -.01em; }
.phase7b-chart-card header p { max-width: 275px; margin: 5px 0 0; color: #74818b; font-size: .76rem; line-height: 1.35; }
.phase7b-chart-card .chart-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; flex-wrap: wrap; }
.phase7b-chart-card .text-control { border: 1px solid #0b7965; border-radius: 8px; padding: 5px 9px; background: #fff; color: #08745f; font: inherit; font-size: .72rem; font-weight: 800; cursor: pointer; }
.phase7b-chart-visual.chart-area { position: relative; height: auto; margin-top: 13px; }
.phase7b-chart-visual svg { display: block; width: 100%; height: auto; overflow: visible; }
.phase7b-cash-flow-visual { display: grid; gap: 15px; }
.phase7b-cash-band + .phase7b-cash-band { padding-top: 14px; border-top: 1px solid #e9e5dd; }
.phase7b-band-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; margin: 0 0 6px 58px; }
.phase7b-band-heading h4 { margin: 0; color: #30455a; font-size: .78rem; letter-spacing: .01em; }
.phase7b-band-heading p { margin: 0; color: #7a858d; font-size: .69rem; line-height: 1.35; }
.phase7b-grid-line { stroke: #d9e1de; stroke-width: 1; stroke-dasharray: 2 4; }
.phase7b-zero-line { stroke: #61717e; stroke-width: 1.25; }
.phase7b-svg-value { fill: #72808a; font-size: 9px; }.phase7b-svg-label { fill: #5b6c78; font-size: 9px; font-weight: 700; }
.phase7b-bar.positive { fill: #0b8068; }.phase7b-bar.negative { fill: #263b54; }.phase7b-bar.zero { fill: #98aaa4; }.phase7b-bar.initial { fill: #213a55; }.phase7b-bar.operating.negative { fill: #71818d; }.phase7b-bar.operating.positive { fill: #4b9383; }.phase7b-bar.exit { fill: #08745f; }.phase7b-hit { fill: transparent; cursor: crosshair; }
.phase7b-area { fill: rgba(11, 128, 104, .10); }.phase7b-line { fill: none; stroke: #08745f; stroke-width: 2.6; }.phase7b-line-point { fill: #fff; stroke: #08745f; stroke-width: 2; }.phase7b-line-hit { fill: transparent; cursor: crosshair; }
.phase7b-tooltip { position: absolute; z-index: 8; min-width: 190px; max-width: 245px; padding: 10px 11px; border: 1px solid #e0e3df; border-radius: 9px; background: rgba(255, 255, 255, .98); box-shadow: 0 9px 22px rgba(20, 35, 50, .14); color: #334856; font-size: .73rem; pointer-events: none; }
.phase7b-tooltip[hidden] { display: none; }.phase7b-tooltip > strong { display: block; margin-bottom: 7px; color: #172c42; font-size: .78rem; }.phase7b-tooltip-rows { display: grid; gap: 4px; }.phase7b-tooltip-rows > div { display: flex; justify-content: space-between; gap: 16px; }.phase7b-tooltip-rows span { color: #6b7982; }.phase7b-tooltip-rows b { color: #1e344b; font-variant-numeric: tabular-nums; white-space: nowrap; }.phase7b-tooltip-rows hr { width: 100%; margin: 2px 0; border: 0; border-top: 1px solid #e8ece8; }
.phase7b-chart-data { display: none; margin-top: 13px; border-top: 1px solid #ece8df; }.phase7b-show-data .phase7b-chart-visual { display: none; }.phase7b-show-data .phase7b-chart-data { display: block; }
.phase7b-data-scroll { max-height: 292px; overflow: auto; padding-top: 3px; }.phase7b-chart-data table { width: 100%; border-collapse: collapse; font-size: .73rem; }.phase7b-chart-data th, .phase7b-chart-data td { padding: 8px 9px 8px 0; border-bottom: 1px solid #eee9e1; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }.phase7b-chart-data th { position: sticky; top: 0; background: #fff; color: #62717c; font-weight: 800; }.phase7b-chart-data th:first-child, .phase7b-chart-data td:first-child { text-align: left; }.phase7b-chart-data td { color: #243a50; }.phase7b-chart-data td strong { color: #102e4b; }.phase7b-data-unavailable { margin: 14px 0; color: #985248; font-size: .78rem; }
.phase7b-unavailable { display: flex; min-height: 180px; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; border: 1px dashed #d7d4cb; border-radius: 10px; background: #fbfaf7; color: #78828a; text-align: center; }.phase7b-unavailable strong { color: #9a564c; font-size: 1.05rem; }.phase7b-unavailable span { max-width: 235px; margin-top: 5px; font-size: .76rem; line-height: 1.4; }
@container phase7b-returns (min-width: 1120px) { .phase7b-hero-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }.phase7b-chart-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container phase7b-returns (max-width: 520px) { .phase7b-hero-kpis { grid-template-columns: 1fr; } }
@container (max-width: 580px) { .phase7b-chart-card.chart-frame > header { flex-direction: column; }.phase7b-chart-card .chart-actions { width: 100%; }.phase7b-band-heading { margin-left: 0; align-items: flex-start; flex-direction: column; } }
@media (max-width: 620px) { #phase7b-returns-host { margin: 14px 0; }.phase7b-heading h2 { font-size: 1.22rem; }.phase7b-chart-card.chart-frame { padding: 14px; }.phase7b-card-value strong { font-size: 1.48rem; }.phase7b-svg-value { font-size: 8px; }.phase7b-svg-label { font-size: 8px; }.phase7b-chart-data table { font-size: .7rem; } }
