.taf06-analytics-page .taf06-panel,
.taf06-analytics-page .taf06-hero__main,
.taf06-analytics-page .taf06-hero__side,
.taf06-public-page .taf06-panel,
.taf06-public-page .taf06-hero__main,
.taf06-public-page .taf06-hero__side {
  border-color:#cce4df;
}
.taf06-analytics-page .taf06-metric-card--info,
.taf06-public-page .taf06-metric-card--info { background:#eef9f7; }
.taf06-analytics-page .taf06-metric-card--warning,
.taf06-public-page .taf06-metric-card--warning { background:#fff5dd; }
.taf06-analytics-page .taf06-metric-card--success,
.taf06-public-page .taf06-metric-card--success { background:#eefaf3; }
.taf06-analytics-page .taf06-metric-card--danger,
.taf06-public-page .taf06-metric-card--danger { background:#fff0f3; }
.taf06-analytics-page .taf06-table--analytics td small { color:#627b77; }

.taf06-chart-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:16px;
}
.taf06-chart-card {
  display:flex;
  flex-direction:column;
  gap:16px;
}
.taf06-chart-card__header h3 {
  margin:0 0 6px;
  font-size:1rem;
}
.taf06-chart-card__header p,
.taf06-panel__lead {
  margin:0;
  color:#5f7470;
  font-size:.92rem;
  line-height:1.5;
}
.taf06-bar-chart {
  display:flex;
  flex-direction:column;
  gap:12px;
}
.taf06-bar-row__top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-size:.9rem;
}
.taf06-bar-row__track,
.taf06-stack-chart__bar {
  width:100%;
  height:10px;
  border-radius:999px;
  background:#edf3f1;
  overflow:hidden;
}
.taf06-bar-row__fill,
.taf06-stack-chart__segment {
  display:block;
  height:100%;
  border-radius:999px;
}
.taf06-bar-row__fill--info,
.taf06-stack-chart__segment--info,
.taf06-stack-chart__swatch--info { background:#39a38d; }
.taf06-bar-row__fill--warning,
.taf06-stack-chart__segment--warning,
.taf06-stack-chart__swatch--warning { background:#d6a126; }
.taf06-bar-row__fill--success,
.taf06-stack-chart__segment--success,
.taf06-stack-chart__swatch--success { background:#2f855a; }
.taf06-bar-row__fill--danger,
.taf06-stack-chart__segment--danger,
.taf06-stack-chart__swatch--danger { background:#d6456b; }
.taf06-stack-chart {
  display:flex;
  flex-direction:column;
  gap:14px;
}
.taf06-stack-chart__bar {
  display:flex;
}
.taf06-stack-chart__legend {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}
.taf06-stack-chart__legend-item {
  display:flex;
  align-items:center;
  gap:10px;
}
.taf06-stack-chart__swatch {
  width:12px;
  height:12px;
  border-radius:999px;
  flex:0 0 auto;
}
.taf06-stack-chart__legend-item small {
  display:block;
  color:#5f7470;
}
.taf06-snapshot-chart {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}
.taf06-snapshot-chart__item {
  padding:14px;
  border:1px solid #d9e9e5;
  border-radius:14px;
  background:#f8fcfb;
}
.taf06-snapshot-chart__item small {
  display:block;
  color:#5f7470;
  margin-bottom:6px;
}
.taf06-snapshot-chart__item strong {
  display:block;
  font-size:1.1rem;
}
.taf06-snapshot-chart__spark {
  margin-top:12px;
  height:28px;
  border-radius:10px;
  background:linear-gradient(180deg, rgba(57,163,141,.22) 0%, rgba(57,163,141,.06) 100%);
  position:relative;
}
.taf06-snapshot-chart__spark::after {
  content:"";
  position:absolute;
  left:8px;
  right:8px;
  top:14px;
  height:2px;
  background:linear-gradient(90deg, #39a38d 0%, #2f855a 100%);
  transform:skewX(-28deg);
}
.taf06-breakdown-list {
  display:flex;
  flex-direction:column;
  gap:10px;
}
.taf06-breakdown-item {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid #d9e9e5;
  background:#f8fcfb;
}
.taf06-breakdown-item small {
  display:block;
  color:#5f7470;
  margin-top:4px;
}
.taf06-breakdown-item span {
  font-weight:700;
  color:#103b35;
}
.taf06-breakdown-item--warning { background:#fffaf0; border-color:#f1ddb1; }
.taf06-breakdown-item--success { background:#f3fcf6; border-color:#cfe7d9; }
.taf06-breakdown-item--danger { background:#fff4f6; border-color:#f0c6d0; }
.taf06-journey-panel {
  display:flex;
  flex-direction:column;
  gap:14px;
}
.taf06-journey-line {
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:12px;
}
.taf06-journey-step {
  display:block;
  text-decoration:none;
  padding:14px;
  border-radius:14px;
  border:1px solid #d7e7e2;
  background:#f8fcfb;
  color:#103b35;
}
.taf06-journey-step small {
  display:block;
  margin-top:4px;
  color:#5f7470;
}
.taf06-journey-step--done {
  box-shadow:inset 0 0 0 1px rgba(57,163,141,.12);
}

@media (max-width: 1100px) {
  .taf06-chart-grid,
  .taf06-journey-line {
    grid-template-columns:1fr;
  }
}

@media (max-width: 900px) {
  .taf06-stack-chart__legend,
  .taf06-snapshot-chart {
    grid-template-columns:1fr;
  }
}