.context-dynamics-shell { color:#172033; }
.context-dynamics-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:18px; }
.context-dynamics-title { margin:0; font-size:16px; line-height:1.35; font-weight:900; color:#0f766e; text-transform:uppercase; letter-spacing:0; }
.context-dynamics-note { margin:5px 0 0; font-size:14px; line-height:1.5; color:#64748b; }
.context-dynamics-badge { display:inline-flex; align-items:center; min-height:32px; gap:6px; border:1px solid #5eead4; border-radius:9999px; background:#f0fdfa; color:#115e59; padding:6px 11px; font-size:13px; font-weight:900; white-space:nowrap; }
.context-dynamics-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); gap:10px; margin-bottom:20px; }
.context-dynamics-stat { border-left:4px solid #0f766e; background:#f8fafc; padding:12px 13px; min-width:0; }
.context-dynamics-stat:nth-child(2) { border-left-color:#c2410c; }
.context-dynamics-stat:nth-child(3) { border-left-color:#7c3aed; }
.context-dynamics-stat:nth-child(4) { border-left-color:#0369a1; }
.context-dynamics-stat:nth-child(5) { border-left-color:#be185d; }
.context-dynamics-stat:nth-child(6) { border-left-color:#4d7c0f; }
.context-dynamics-stat strong { display:block; font-size:1.3rem; line-height:1.15; font-variant-numeric:tabular-nums; }
.context-dynamics-stat span { display:block; margin-top:5px; color:#5b667a; font-size:12px; line-height:1.35; font-weight:800; text-transform:uppercase; overflow-wrap:anywhere; }
.context-dynamics-grid { display:grid; grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr); gap:22px; align-items:stretch; }
.context-dynamics-graph { min-height:300px; border:1px solid #d8e0ea; background:#f8fafc; border-radius:6px; padding:10px; }
.context-dynamics-graph svg { display:block; width:100%; height:278px; }
.context-dynamics-graph line { stroke:#cbd5e1; stroke-width:1; }
.context-dynamics-graph .context-dynamics-radar-grid { fill:none; stroke:#d7dee8; stroke-width:1; }
.context-dynamics-graph .context-dynamics-radar-value { fill:#14b8a6; fill-opacity:.2; stroke:#0f766e; stroke-width:2.4; }
.context-dynamics-graph circle { fill:#fff; stroke:#0f766e; stroke-width:2.4; }
.context-dynamics-graph text { fill:#3f4b5f; font-size:13px; font-weight:800; }
.context-dynamics-bars { display:grid; gap:14px; align-content:start; }
.context-dynamics-axis-head { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:14px; line-height:1.4; font-weight:900; }
.context-dynamics-axis-meta { color:#5b667a; font-size:13px; font-weight:700; text-align:right; }
.context-dynamics-track { height:11px; margin-top:6px; 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:#c2410c; }
.context-dynamics-axis:nth-child(3) .context-dynamics-fill { background:#7c3aed; }
.context-dynamics-axis:nth-child(4) .context-dynamics-fill { background:#0369a1; }
.context-dynamics-axis-note { color:#5b667a; font-size:13px; line-height:1.5; margin-top:5px; }
.context-dynamics-extension { border-top:2px solid #dfe6ee; margin-top:24px; padding-top:20px; }
.context-dynamics-section-head { display:flex; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; gap:12px; }
.context-dynamics-section-head h4 { margin:2px 0 0; color:#172033; font-size:19px; line-height:1.35; font-weight:900; }
.context-dynamics-section-head > span { color:#0f766e; background:#eefbf8; padding:6px 9px; font-size:13px; font-weight:900; }
.context-dynamics-kicker { margin:0; color:#a13e0b; font-size:12px; line-height:1.3; font-weight:900; text-transform:uppercase; }
.context-dynamics-section-copy { max-width:900px; margin:10px 0 0; color:#465266; font-size:15px; line-height:1.65; }
.context-dynamics-flex-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr); gap:24px; align-items:start; margin-top:16px; }
.context-dynamics-syntax { display:grid; gap:16px; }
.context-dynamics-coordinate { min-width:0; }
.context-dynamics-coordinate h5 { margin:0 0 9px; color:#3f4b5f; font-size:14px; font-weight:900; text-transform:uppercase; }
.context-dynamics-coordinate svg { display:block; width:100%; height:auto; min-height:250px; background:#f8fafc; border:1px solid #d8e0ea; border-radius:6px; }
.context-dynamics-coordinate text { fill:#536176; font-size:12px; font-weight:700; }
.context-dynamics-coordinate .context-dynamics-coordinate-label { fill:#334155; font-size:13px; font-weight:900; }
.context-dynamics-coordinate .context-dynamics-coordinate-term { fill:#0f766e; font-size:13px; font-weight:900; }
.context-dynamics-coordinate-area { fill:#fff; stroke:#cbd5e1; }
.context-dynamics-coordinate-mid { stroke:#cbd5e1; stroke-dasharray:5 5; }
.context-dynamics-coordinate-axis { stroke:#64748b; stroke-width:1.5; }
.context-dynamics-coordinate-point { fill:#be185d; stroke:#fff; stroke-width:3; }
.context-dynamics-coordinate > p { margin:8px 0 0; color:#5b667a; font-size:13px; line-height:1.55; }
.context-dynamics-scope-note { margin:14px 0 0; border-left:3px solid #c2410c; padding:7px 0 7px 12px; color:#5b667a; font-size:13px; line-height:1.55; }
.context-dynamics-insights { display:grid; gap:10px; margin:14px 0 0; padding:0; list-style:none; }
.context-dynamics-insights li { position:relative; padding-left:19px; color:#334155; font-size:15px; line-height:1.65; }
.context-dynamics-insights li::before { content:""; position:absolute; left:0; top:.7em; width:8px; height:8px; background:#0f766e; }
.context-dynamics-method-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(155px,1fr)); gap:1px; margin-top:17px; background:#d8e0ea; border:1px solid #d8e0ea; }
.context-dynamics-method-item { display:flex; gap:9px; align-items:flex-start; background:#fff; padding:11px; min-width:0; }
.context-dynamics-method-item strong { display:grid; place-items:center; flex:0 0 27px; width:27px; height:27px; background:#172033; color:#fff; font-size:13px; }
.context-dynamics-method-item span { color:#526075; font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
.context-dynamics-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:24px; }
.context-dynamics-detail { border-top:1px solid #d8e0ea; padding-top:13px; }
.context-dynamics-detail h5 { color:#3f4b5f; font-size:13px; font-weight:900; text-transform:uppercase; margin:0 0 10px; }
.context-dynamics-row { display:grid; grid-template-columns:minmax(110px,1fr) 1.5fr auto; gap:10px; align-items:center; font-size:13px; line-height:1.4; }
.context-dynamics-row + .context-dynamics-row { margin-top:8px; }
.context-dynamics-row-label { overflow-wrap:anywhere; color:#334155; }
.context-dynamics-row-count { color:#475569; font-variant-numeric:tabular-nums; }
.context-dynamics-row-track { height:8px; border-radius:9999px; background:#edf1f5; overflow:hidden; }
.context-dynamics-row-fill { height:100%; border-radius:9999px; background:#0f766e; }
.context-dynamics-detail:nth-child(2) .context-dynamics-row-fill { background:#c2410c; }
.context-dynamics-foot { border-top:1px solid #d8e0ea; margin-top:18px; padding-top:13px; color:#526075; font-size:13px; line-height:1.6; }
.context-dynamics-empty { border:1px dashed #b8c4d2; border-radius:6px; padding:14px; color:#5b667a; background:#f8fafc; font-size:14px; line-height:1.55; }
.context-dynamics-fingerprint { margin:4px 0 24px; border:1px solid #cbd5e1; border-top:4px solid #0f766e; background:#fff; padding:18px; }
.context-dynamics-fingerprint-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px; margin-top:15px; background:#d8e0ea; border:1px solid #d8e0ea; }
.context-dynamics-fingerprint-item { display:grid; grid-template-columns:34px minmax(0,1fr); gap:10px; align-items:start; min-width:0; background:#fff; padding:12px; }
.context-dynamics-fingerprint-item > strong { display:grid; place-items:center; width:32px; height:32px; color:#fff; background:#0f766e; font-size:15px; }
.context-dynamics-fingerprint-item:nth-child(2) > strong { background:#c2410c; }
.context-dynamics-fingerprint-item:nth-child(3) > strong { background:#7c3aed; }
.context-dynamics-fingerprint-item:nth-child(4) > strong { background:#0369a1; }
.context-dynamics-fingerprint-item:nth-child(5) > strong { background:#be185d; }
.context-dynamics-fingerprint-item span { display:block; min-height:35px; color:#334155; font-size:12px; line-height:1.4; font-weight:900; }
.context-dynamics-fingerprint-item small { display:block; margin-top:5px; color:#64748b; font-size:11px; line-height:1.35; }
.context-dynamics-fingerprint-item.is-missing { opacity:.55; }
.context-dynamics-mini-track { height:7px; margin-top:7px; overflow:hidden; border-radius:9999px; background:#e2e8f0; }
.context-dynamics-mini-track i { display:block; height:100%; border-radius:inherit; background:#0f766e; }
.context-dynamics-cockpit { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:16px; }
.context-dynamics-cockpit > article { display:flex; flex-direction:column; min-width:0; min-height:230px; border:1px solid #d8e0ea; border-top:4px solid #0f766e; background:#fff; padding:15px; }
.context-dynamics-cockpit > article:nth-child(2) { border-top-color:#c2410c; }
.context-dynamics-cockpit > article:nth-child(3) { border-top-color:#7c3aed; }
.context-dynamics-cockpit > article:nth-child(4) { border-top-color:#0369a1; }
.context-dynamics-cockpit h5 { margin:0; color:#172033; font-size:15px; font-weight:900; text-transform:uppercase; }
.context-dynamics-cockpit p { margin:10px 0 14px; color:#526075; font-size:12px; line-height:1.55; }
.context-dynamics-cockpit button, .context-dynamics-compare-form button, .context-dynamics-panel-head button { margin-top:auto; border:0; border-radius:4px; padding:9px 11px; color:#fff; background:#0f766e; font-size:13px; font-weight:900; cursor:pointer; }
.context-dynamics-cockpit button:hover, .context-dynamics-compare-form button:hover { background:#115e59; }
.context-dynamics-big { display:block; margin-top:18px; color:#0f766e; font-size:19px; line-height:1.25; overflow-wrap:anywhere; }
.context-dynamics-mini-timeline { display:flex; align-items:end; gap:5px; min-height:94px; margin-top:12px; overflow:hidden; }
.context-dynamics-mini-timeline > div { display:grid; flex:1; min-width:0; justify-items:center; align-items:end; }
.context-dynamics-mini-timeline i { display:block; width:70%; min-width:5px; max-width:24px; background:#0f766e; }
.context-dynamics-mini-timeline span { margin-top:4px; color:#64748b; font-size:9px; line-height:1.15; text-align:center; }
.context-dynamics-mini-timeline b { color:#334155; font-size:10px; font-variant-numeric:tabular-nums; }
.context-dynamics-lazy-panel { margin-top:18px; border:1px solid #cbd5e1; background:#f8fafc; padding:18px; scroll-margin-top:20px; }
.context-dynamics-panel-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:15px; }
.context-dynamics-panel-head h5 { margin:2px 0 0; color:#172033; font-size:20px; line-height:1.35; font-weight:900; }
.context-dynamics-panel-head button { flex:0 0 auto; margin:0; color:#334155; background:#fff; border:1px solid #94a3b8; }
.context-dynamics-transform-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:16px; }
.context-dynamics-transform-gallery article { display:flex; flex-direction:column; min-width:0; border:1px solid #d8e0ea; background:#f8fafc; padding:14px; }
.context-dynamics-transform-gallery span { color:#526075; font-size:12px; font-weight:900; text-transform:uppercase; }
.context-dynamics-transform-gallery strong { color:#0f766e; font-size:25px; line-height:1.2; margin-top:4px; }
.context-dynamics-transform-gallery small { color:#64748b; font-size:12px; }
.context-dynamics-transform-gallery code { display:block; margin-top:8px; padding:6px 8px; color:#334155; background:#fff; border-left:3px solid #c2410c; font-family:inherit; font-size:12px; line-height:1.4; overflow-wrap:anywhere; }
.context-dynamics-trajectory-svg { display:block; width:100%; height:auto; min-width:560px; overflow:visible; }
.context-dynamics-trajectory-svg line { stroke:#94a3b8; stroke-width:1.2; }
.context-dynamics-trajectory-svg path { fill:none; stroke:#0f766e; stroke-width:3; }
.context-dynamics-trajectory-svg circle { fill:#fff; stroke:#be185d; stroke-width:3; }
.context-dynamics-trajectory-svg text { fill:#475569; font-size:10px; font-weight:800; }
.context-dynamics-lazy-panel:has(.context-dynamics-trajectory-svg) { overflow-x:auto; }
.context-dynamics-period-grid, .context-dynamics-stress-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-top:14px; }
.context-dynamics-period-grid article, .context-dynamics-stress-grid article { min-width:0; border:1px solid #d8e0ea; border-left:4px solid #0f766e; background:#fff; padding:12px; }
.context-dynamics-period-grid article.is-insufficient, .context-dynamics-stress-grid article.is-insufficient { opacity:.62; border-left-color:#94a3b8; }
.context-dynamics-period-grid h6, .context-dynamics-stress-grid h6 { margin:0; color:#475569; font-size:12px; font-weight:900; }
.context-dynamics-period-grid strong, .context-dynamics-stress-grid strong { display:block; margin-top:5px; color:#172033; font-size:20px; }
.context-dynamics-period-grid span, .context-dynamics-stress-grid span, .context-dynamics-period-grid small { display:block; color:#64748b; font-size:11px; line-height:1.4; }
.context-dynamics-period-grid p { color:#9a3412; font-size:11px; line-height:1.45; }
.context-dynamics-breakpoint-list, .context-dynamics-divergence-list { display:grid; gap:8px; }
.context-dynamics-breakpoint-list article { display:grid; grid-template-columns:minmax(130px,1fr) auto auto minmax(180px,1.3fr); gap:12px; align-items:center; border-left:4px solid #94a3b8; background:#fff; padding:11px; }
.context-dynamics-breakpoint-list article.is-breakpoint { border-left-color:#be185d; background:#fff1f2; }
.context-dynamics-breakpoint-list strong { color:#172033; font-variant-numeric:tabular-nums; }
.context-dynamics-breakpoint-list span, .context-dynamics-breakpoint-list p { margin:0; color:#64748b; font-size:12px; line-height:1.45; }
.context-dynamics-divergence-list { grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.context-dynamics-divergence-list article { border:1px solid #d8e0ea; background:#fff; padding:13px; }
.context-dynamics-divergence-list article > div { display:flex; align-items:center; gap:7px; color:#334155; font-size:13px; }
.context-dynamics-divergence-list strong { display:block; margin-top:8px; color:#be185d; font-size:24px; }
.context-dynamics-divergence-list p, .context-dynamics-divergence-list small { color:#526075; font-size:12px; line-height:1.55; }
.context-dynamics-compare-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:end; margin:15px 0; }
.context-dynamics-compare-form label span { display:block; margin-bottom:5px; color:#334155; font-size:13px; font-weight:900; }
.context-dynamics-compare-form input { width:100%; min-height:43px; border:2px solid #99f6e4; border-radius:4px; padding:8px 11px; color:#172033; background:#fff; font-size:15px; }
.context-dynamics-compare-form button { min-height:43px; }
.context-dynamics-compare-table-wrap { width:100%; overflow-x:auto; border:1px solid #d8e0ea; }
.context-dynamics-compare-table { width:100%; min-width:720px; border-collapse:collapse; background:#fff; font-size:13px; }
.context-dynamics-compare-table th, .context-dynamics-compare-table td { padding:10px; border-bottom:1px solid #e2e8f0; text-align:right; white-space:nowrap; }
.context-dynamics-compare-table thead th { color:#fff; background:#172033; font-size:11px; text-transform:uppercase; }
.context-dynamics-compare-table th:first-child { text-align:left; }
.context-dynamics-compare-table tbody th { color:#0f766e; }
.context-dynamics-compare-contexts { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; margin-top:12px; }
.context-dynamics-compare-contexts > div { border-left:3px solid #c2410c; background:#fff7ed; padding:10px 12px; }
.context-dynamics-compare-contexts b { color:#7c2d12; font-size:12px; }
.context-dynamics-compare-contexts p { margin:5px 0 0; color:#526075; font-size:12px; line-height:1.55; overflow-wrap:anywhere; }
.context-dynamics-caveats { margin-top:22px; border:1px solid #fed7aa; border-left:5px solid #c2410c; background:#fff7ed; padding:14px 16px; }
.context-dynamics-caveats h5 { margin:0; color:#7c2d12; font-size:14px; font-weight:900; text-transform:uppercase; }
.context-dynamics-caveats ul { margin:8px 0 0; padding-left:18px; color:#7c2d12; font-size:13px; line-height:1.55; }

@media (max-width:820px) {
  .context-dynamics-grid, .context-dynamics-flex-grid { grid-template-columns:1fr; }
  .context-dynamics-method-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .context-dynamics-graph { min-height:285px; }
  .context-dynamics-fingerprint-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .context-dynamics-cockpit { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .context-dynamics-transform-gallery { grid-template-columns:1fr; }
}
@media (max-width:640px) {
  .context-dynamics-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .context-dynamics-details, .context-dynamics-method-grid { grid-template-columns:1fr; }
  .context-dynamics-title { font-size:15px; }
  .context-dynamics-badge { white-space:normal; }
  .context-dynamics-row { grid-template-columns:minmax(105px,1.2fr) minmax(70px,1fr) auto; }
  .context-dynamics-coordinate svg { min-height:220px; }
  .context-dynamics-fingerprint-grid, .context-dynamics-cockpit { grid-template-columns:1fr; }
  .context-dynamics-cockpit > article { min-height:0; }
  .context-dynamics-compare-form { grid-template-columns:1fr; }
  .context-dynamics-breakpoint-list article { grid-template-columns:1fr auto; }
  .context-dynamics-breakpoint-list article p { grid-column:1 / -1; }
  .context-dynamics-lazy-panel { padding:12px; }
}
