.context-dynamics-shell { color:#0f172a; }
.context-dynamics-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.context-dynamics-title { font-size:12px; font-weight:900; color:#0f766e; text-transform:uppercase; letter-spacing:.035em; }
.context-dynamics-note { font-size:11px; color:#64748b; margin-top:4px; }
.context-dynamics-badge { display:inline-flex; align-items:center; gap:6px; border:1px solid #99f6e4; border-radius:9999px; background:#f0fdfa; color:#115e59; padding:4px 9px; font-size:11px; font-weight:900; white-space:nowrap; }
.context-dynamics-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; margin-bottom:14px; }
.context-dynamics-stat { border-left:3px solid #0f766e; background:#f8fafc; padding:9px 11px; min-width:0; }
.context-dynamics-stat:nth-child(2) { border-left-color:#d97706; }
.context-dynamics-stat:nth-child(3) { border-left-color:#7c3aed; }
.context-dynamics-stat:nth-child(4) { border-left-color:#db2777; }
.context-dynamics-stat strong { display:block; font-size:1.18rem; line-height:1.15; font-variant-numeric:tabular-nums; }
.context-dynamics-stat span { display:block; margin-top:4px; color:#64748b; font-size:10px; font-weight:800; text-transform:uppercase; overflow-wrap:anywhere; }
.context-dynamics-grid { display:grid; grid-template-columns:minmax(220px,.9fr) minmax(0,1.1fr); gap:14px; align-items:stretch; }
.context-dynamics-graph { min-height:235px; border:1px solid #e2e8f0; background:#f8fafc; border-radius:8px; padding:8px; }
.context-dynamics-graph svg { display:block; width:100%; height:220px; }
.context-dynamics-graph line { stroke:#cbd5e1; stroke-width:1; }
.context-dynamics-graph polygon { fill:#14b8a6; fill-opacity:.18; stroke:#0f766e; stroke-width:2; }
.context-dynamics-graph circle { fill:#fff; stroke:#0f766e; stroke-width:2; }
.context-dynamics-graph text { fill:#475569; font-size:11px; font-weight:800; text-anchor:middle; }
.context-dynamics-bars { display:grid; gap:10px; align-content:start; }
.context-dynamics-axis-head { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; font-weight:900; }
.context-dynamics-axis-meta { color:#64748b; font-size:11px; font-weight:700; text-align:right; }
.context-dynamics-track { height:9px; margin-top:5px; border-radius:9999px; background:#e2e8f0; overflow:hidden; }
.context-dynamics-fill { height:100%; border-radius:9999px; background:#0f766e; transition:width .35s ease; }
.context-dynamics-axis:nth-child(2) .context-dynamics-fill { background:#d97706; }
.context-dynamics-axis:nth-child(3) .context-dynamics-fill { background:#7c3aed; }
.context-dynamics-axis-note { color:#64748b; font-size:11px; line-height:1.4; margin-top:4px; }
.context-dynamics-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:14px; }
.context-dynamics-detail { border-top:1px solid #e2e8f0; padding-top:10px; }
.context-dynamics-detail h5 { color:#475569; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.03em; margin:0 0 7px; }
.context-dynamics-row { display:grid; grid-template-columns:minmax(90px,1fr) 1.5fr auto; gap:8px; align-items:center; font-size:11px; }
.context-dynamics-row + .context-dynamics-row { margin-top:6px; }
.context-dynamics-row-label { overflow-wrap:anywhere; color:#334155; }
.context-dynamics-row-track { height:6px; border-radius:9999px; background:#f1f5f9; overflow:hidden; }
.context-dynamics-row-fill { height:100%; border-radius:9999px; background:#14b8a6; }
.context-dynamics-detail:nth-child(2) .context-dynamics-row-fill { background:#f59e0b; }
.context-dynamics-foot { border-top:1px solid #e2e8f0; margin-top:12px; padding-top:9px; color:#64748b; font-size:11px; line-height:1.45; }
.context-dynamics-empty { border:1px dashed #cbd5e1; border-radius:8px; padding:12px; color:#64748b; background:#f8fafc; font-size:13px; }
@media (max-width:640px) {
  .context-dynamics-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .context-dynamics-grid, .context-dynamics-details { grid-template-columns:1fr; }
  .context-dynamics-graph { min-height:220px; }
}