.cs-sparkline-card{padding:16px}.cs-sparkline-card canvas{border-radius:var(--xp-radius-sm);width:100%;display:block}.cs-timeline-strip{gap:6px;margin-bottom:16px;padding-bottom:10px;display:flex;overflow-x:auto}.cs-chunk-block{background:var(--xp-surface);border:1px solid var(--xp-border);border-radius:var(--xp-radius-sm);cursor:pointer;flex-direction:column;flex-shrink:0;align-items:center;gap:4px;min-width:72px;padding:10px 12px;transition:all .2s;display:flex;position:relative}.cs-chunk-block:hover{border-color:var(--xp-accent);background:var(--xp-accent-glow)}.cs-chunk-block.selected{border-color:var(--xp-accent);background:var(--xp-accent-glow);box-shadow:0 0 16px #60a5fa26}.cs-chunk-block .chunk-num{color:var(--xp-accent);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:700}.cs-chunk-block .chunk-time{color:var(--xp-text-dim);font-size:9px;font-family:var(--xp-mono);white-space:nowrap}.cs-chunk-block .chunk-range-bar{background:linear-gradient(to top, var(--xp-accent), var(--xp-success));border-radius:3px;width:6px;min-height:20px;max-height:48px;transition:all .2s}.cs-chunk-block .chunk-count{font-size:10px;font-family:var(--xp-mono);color:var(--xp-text-muted);background:var(--xp-surface-raised);border-radius:99px;padding:1px 6px}.cs-detail-panel{animation:.3s both xp-fade-in}.cs-detail-panel[hidden]{display:none}.cs-detail-header{margin-bottom:12px}.cs-detail-header h3{color:#fff;margin:0 0 2px;font-size:16px;font-weight:600}.cs-detail-header .time-range{color:var(--xp-text-dim);font-size:12px;font-family:var(--xp-mono)}.cs-detail-panel canvas{border-radius:var(--xp-radius-sm);width:100%;margin-top:12px;display:block}.cs-query-controls{flex-wrap:wrap;gap:16px}.cs-control-group{flex-direction:column;gap:4px;display:flex}.cs-exec-grid{flex-direction:column;gap:12px;margin-bottom:20px;display:flex}.cs-bucket-row{background:var(--xp-surface);border:1px solid var(--xp-border);border-radius:var(--xp-radius-sm);opacity:.3;align-items:center;gap:10px;padding:10px 14px;transition:all .3s;display:flex}.cs-bucket-row.active{opacity:1;border-color:var(--xp-accent);background:var(--xp-accent-glow)}.cs-bucket-row.done{opacity:1}.cs-bucket-label{color:var(--xp-text-muted);flex-shrink:0;min-width:70px;font-size:12px;font-weight:600}.cs-bucket-chunks{flex-wrap:wrap;flex:1;gap:6px;display:flex}.cs-exec-chip{border-radius:var(--xp-radius-xs);font-family:var(--xp-mono);border:1px solid var(--xp-border);background:var(--xp-surface-raised);color:var(--xp-text-dim);align-items:center;gap:4px;padding:4px 10px;font-size:12px;font-weight:500;transition:all .3s;display:flex}.cs-exec-chip.stats-only{background:var(--xp-success-glow);color:var(--xp-success);border-color:#34d39966}.cs-exec-chip.must-decode{background:var(--xp-error-glow);color:var(--xp-error);border-color:#f8717166}.cs-exec-chip.skipped{background:var(--xp-surface);border-color:var(--xp-border);color:var(--xp-text-dim);opacity:.5}.cs-exec-chip .chip-icon{font-size:12px}.cs-bucket-result{font-family:var(--xp-mono);color:#fff;text-align:right;opacity:0;flex-shrink:0;min-width:60px;font-size:13px;font-weight:600;transition:opacity .3s}.cs-bucket-result.visible{opacity:1}.cs-exec-progress{color:var(--xp-text-muted);min-height:20px;font-size:13px}.cs-speedup-card{text-align:center;margin-bottom:20px;padding:24px}.cs-speedup-value{font-family:var(--xp-mono);color:var(--xp-success);margin-bottom:6px;font-size:36px;font-weight:700;line-height:1}.cs-speedup-label{color:var(--xp-text-muted);font-size:14px}.cs-speedup-detail{color:var(--xp-text-dim);margin-top:8px;font-size:13px}.cs-bucket-results{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;display:grid}.cs-result-cell{background:var(--xp-surface);border:1px solid var(--xp-border);border-radius:var(--xp-radius-sm);flex-direction:column;gap:2px;padding:10px 12px;animation:.3s both xp-fade-in;display:flex}.cs-result-cell .cell-label{text-transform:uppercase;letter-spacing:.06em;color:var(--xp-text-dim);font-size:10px}.cs-result-cell .cell-value{font-family:var(--xp-mono);color:#fff;font-size:16px;font-weight:600}.cs-result-cell .cell-method{margin-top:2px;font-size:10px;font-weight:500}.cs-result-cell .cell-method.stats-only{color:var(--xp-success)}.cs-result-cell .cell-method.decoded{color:var(--xp-error)}.cs-explain-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;display:grid}.cs-explain-card{text-align:center;padding:20px 16px;transition:all .2s}.cs-explain-card.highlight{border-color:var(--xp-accent);background:var(--xp-accent-glow);box-shadow:0 0 24px #60a5fa1a}.cs-explain-icon{margin-bottom:8px;font-size:28px}.cs-explain-card h3{font-family:var(--xp-mono);color:var(--xp-accent);margin:0 0 6px;font-size:16px;font-weight:600}.cs-explain-card p{color:var(--xp-text-muted);max-width:none;margin:0;font-size:13px;line-height:1.5}@keyframes cs-flash-green{0%{box-shadow:0 0 #34d39980}50%{box-shadow:0 0 20px 4px #34d3994d}to{box-shadow:0 0 #34d39900}}@keyframes cs-flash-red{0%{box-shadow:0 0 #f8717180}50%{box-shadow:0 0 20px 4px #f871714d}to{box-shadow:0 0 #f8717100}}.cs-exec-chip.flash-green{animation:.5s cs-flash-green}.cs-exec-chip.flash-red{animation:.5s cs-flash-red}@media (width<=640px){.cs-query-controls{flex-direction:column;gap:12px}.cs-bucket-row{flex-wrap:wrap;gap:6px;padding:8px 10px}.cs-bucket-label{min-width:unset;flex-basis:100%}.cs-bucket-result{text-align:left;flex-basis:100%}.cs-explain-grid{grid-template-columns:1fr}.cs-bucket-results{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}.cs-speedup-value{font-size:28px}}