.eco { max-width:1000px; margin:0 auto; }
.eco-date { text-align:center; color:var(--text-3); font-size:11px; margin-bottom:12px; }

.eco-section { margin-bottom:20px; }
.eco-section h2 { font-size:13px; font-weight:700; color:var(--accent); margin-bottom:8px; padding-bottom:4px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:6px; }

.eco-hero { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:10px; margin-bottom:16px; }
.eco-card { background:var(--bg-1); border:1px solid var(--border); border-radius:10px; padding:14px 16px; display:flex; flex-direction:column; gap:4px; }
.eco-card-label { font-size:10px; text-transform:uppercase; letter-spacing:.5px; color:var(--text-3); font-weight:600; }
.eco-card-row { display:flex; align-items:baseline; gap:6px; }
.eco-card-val { font-size:24px; font-weight:700; font-variant-numeric:tabular-nums; }
.eco-card-arrow { font-size:14px; font-weight:700; }
.eco-card-sub { font-size:10px; color:var(--text-3); line-height:1.3; }
.eco-card-src { font-size:9px; color:var(--text-3); margin-top:auto; padding-top:4px; }
.eco-card-src a { color:var(--text-3); text-decoration:underline dotted; }
.eco-card-src a:hover { color:var(--accent); }

.c-accent { color:var(--accent); }
.c-up-good { color:var(--green); }

.eco-detail { background:var(--bg-1); border:1px solid var(--border); border-radius:8px; padding:12px 14px; font-size:12px; }
.eco-detail-title { font-weight:600; color:var(--text-1); margin-bottom:8px; }

/* Bar chart */
.bar-chart { display:flex; align-items:flex-end; gap:8px; height:120px; padding:0 4px; }
.bar-col { display:flex; flex-direction:column; align-items:center; flex:1; min-width:40px; }
.bar { background:var(--accent); border-radius:3px 3px 0 0; width:100%; min-height:4px; transition:height .3s; }
.bar-val { font-size:9px; font-weight:700; color:var(--text-1); white-space:nowrap; margin-bottom:2px; }
.bar-pct { font-size:8px; color:var(--text-3); margin-bottom:2px; }
.bar-label { font-size:9px; color:var(--text-3); margin-top:4px; font-weight:600; }
.bar-src { font-size:7px; color:var(--text-3); margin-top:1px; }
.bar-src a { color:var(--accent); text-decoration:none; }

/* KPI cards */
.eco-kpi { background:var(--bg-1); border:1px solid var(--border); border-radius:10px; padding:14px 16px; text-align:center; }
.eco-kpi-val { font-size:28px; font-weight:800; color:var(--text-0); line-height:1.1; font-variant-numeric:tabular-nums; }
.eco-kpi-label { font-size:11px; font-weight:600; color:var(--text-2); margin-top:4px; }
.eco-kpi-sub { font-size:9px; color:var(--text-3); margin-top:2px; }

/* Signals list */
.eco-signals { list-style:none; padding:0; margin:0; }
.eco-sig { padding:10px 0; border-bottom:1px solid var(--border-subtle); display:flex; gap:10px; align-items:flex-start; }
.eco-sig:last-child { border-bottom:none; }
.eco-sig-date { font-size:10px; color:var(--text-3); min-width:70px; padding-top:2px; font-variant-numeric:tabular-nums; }
.eco-sig-body { flex:1; min-width:0; }
.eco-sig-title { font-size:13px; font-weight:600; color:var(--text-0); }
.eco-sig-title a { color:var(--text-0); text-decoration:none; }
.eco-sig-title a:hover { color:var(--accent); }
.eco-sig-src { font-size:9px; color:var(--text-3); }

/* Guide box */
.guide-box { display:flex; gap:12px; padding:12px 16px; background:color-mix(in srgb, var(--accent) 6%, var(--bg-1)); border:1px solid var(--border); border-radius:8px; margin-bottom:16px; font-size:12px; line-height:1.5; color:var(--text-2); }
.guide-box strong { color:var(--text-1); }

/* Timeline */
.timeline { position:relative; padding-left:20px; }
.timeline::before { content:''; position:absolute; left:6px; top:0; bottom:0; width:2px; background:var(--border); }
.tl-item { position:relative; margin-bottom:12px; padding-left:14px; }
.tl-item::before { content:''; position:absolute; left:-17px; top:5px; width:8px; height:8px; border-radius:50%; border:2px solid var(--bg-1); }
.tl-item.cat-trade::before { background:#e67e22; }
.tl-item.cat-sanctions::before { background:#e74c3c; }
.tl-item.cat-infrastructure::before { background:#3498db; }
.tl-item.cat-energy::before { background:#2ecc71; }
.tl-item.cat-defense::before { background:#9b59b6; }
.tl-date { font-size:10px; font-weight:600; color:var(--text-3); }
.tl-text { font-size:12px; color:var(--text-1); margin-top:1px; }
.tl-src { font-size:9px; margin-top:2px; }
.tl-src a { color:var(--accent); text-decoration:none; }

@media (max-width:600px) {
  .eco-hero { grid-template-columns:1fr 1fr; }
  .bar-chart { height:80px; }
}
