.portfolio-output {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  overflow-y: auto;
  display: flex; flex-direction: column;
}
.output-title {
  font-size: 13px; font-weight: 600; color: var(--text-secondary);
  text-transform: uppercase; letter-spacing: 0.1em;
  padding-bottom: var(--sp-3); border-bottom: 1px solid var(--border);
  margin-bottom: var(--sp-4);
}

.trio-tabs { display: flex; gap: 4px; margin-bottom: var(--sp-4); background: var(--bg-elevated); padding: 3px; border-radius: var(--r-md); }
.trio-tab {
  flex: 1; padding: 8px 12px; border-radius: var(--r-sm);
  font-size: 12px; font-weight: 600; color: var(--text-secondary);
  transition: all var(--dur-fast) var(--ease);
}
.trio-tab.active { background: var(--accent-green); color: var(--text-inverse); box-shadow: 0 2px 8px rgba(0, 212, 170, 0.4); }

.portfolio-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: var(--sp-4);
  margin-bottom: var(--sp-3);
  animation: fadeUp var(--dur-med) var(--ease);
}
.portfolio-card .portfolio-name {
  font-weight: 700; font-size: 16px; margin-bottom: var(--sp-3);
  display: flex; align-items: center; justify-content: space-between;
}
.portfolio-card .portfolio-amount {
  font-family: var(--font-mono); color: var(--accent-green);
}
.strategy-row {
  display: grid; grid-template-columns: 1fr 60px 50px;
  gap: var(--sp-2); align-items: center;
  padding: var(--sp-2) 0; border-top: 1px solid var(--border);
  font-size: 12px;
}
.strategy-row:first-of-type { border-top: none; }
.strategy-name { color: var(--text-primary); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.strategy-weight-bar {
  height: 4px; background: var(--border); border-radius: var(--r-pill); overflow: hidden; position: relative;
}
.strategy-weight-bar::after {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0;
  width: var(--w, 0%); background: linear-gradient(90deg, var(--accent-blue), var(--accent-green));
  border-radius: var(--r-pill);
}
.strategy-weight { font-family: var(--font-mono); text-align: right; color: var(--accent-green); font-weight: 600; }

.metrics-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-3); margin-top: var(--sp-4);
  padding-top: var(--sp-4); border-top: 1px solid var(--border);
}
.metrics-grid .metric-value { font-size: 16px; }