.rc-heatmap-card{background:var(--ds-bg-surface,var(--surface,#fff));border:1px solid var(--ds-border-default,var(--border,#0000001a));border-radius:12px;gap:20px;margin-top:12px;padding:20px;display:flex}.rc-heatmap-panel-title{letter-spacing:.05em;color:var(--ds-text-tertiary,var(--text-3,#888));text-transform:uppercase;margin-bottom:8px;font-size:11px;font-weight:600}.rc-heatmap-card-left{flex-direction:column;flex:0 0 380px;gap:10px;display:flex}.rc-heatmap-canvas-wrap{border:.5px solid var(--ds-border-default,var(--border,#0000001a));background:#fff;border-radius:8px;width:380px;max-width:100%;position:relative;overflow:hidden}.rc-heatmap-base-canvas{z-index:0;width:100%;height:auto;display:block;position:relative}.rc-heatmap-base-loading{z-index:4;color:var(--ds-text-secondary,var(--text-2,#555));background:#ffffffb3;flex-direction:column;justify-content:center;align-items:center;gap:8px;font-size:12px;display:flex;position:absolute;inset:0}.rc-heatmap-blocks{z-index:1;pointer-events:none;position:absolute;inset:0}.rc-heatmap-block{box-sizing:border-box;background:#f0f0f54d;border:1px solid #64647826;border-radius:3px;align-items:flex-start;padding:2px 4px;display:flex;position:absolute}.rc-heatmap-block-label{color:#666;white-space:nowrap;text-overflow:ellipsis;opacity:.8;font-size:9px;overflow:hidden}.rc-heatmap-canvas{z-index:2;pointer-events:none;opacity:.88;width:100%;height:100%;position:absolute;inset:0}.rc-heatmap-legend{flex-wrap:wrap;gap:12px;display:flex}.rc-heatmap-legend-item{color:var(--ds-text-secondary,var(--text-2,#555));align-items:center;gap:5px;font-size:11px;display:flex}.rc-heatmap-legend-swatch{border-radius:2px;width:24px;height:7px}.rc-swatch-hot{background:linear-gradient(90deg,#ff3c00b3,#ffb40080)}.rc-swatch-mid{background:linear-gradient(90deg,#ffb40080,#1ec8784d)}.rc-swatch-low{background:linear-gradient(90deg,#1ec8784d,#1e64ff26)}.rc-heatmap-obs{color:var(--ds-text-secondary,var(--text-2,#555));margin:0;font-size:12px;line-height:1.5}.rc-heatmap-card-right{flex-direction:column;flex:1;gap:12px;min-width:0;display:flex}.rc-heatmap-score-box{background:var(--ds-bg-surface-raised,var(--surface,#fafafa));border:.5px solid var(--ds-border-default,var(--border,#0000001a));border-radius:10px;align-items:center;gap:12px;padding:14px;display:flex}.rc-heatmap-score-ring{border:3px solid;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:52px;height:52px;display:flex}.rc-heatmap-score-num{font-size:20px;font-weight:700;line-height:1}.rc-heatmap-score-meta{flex:1;min-width:0}.rc-heatmap-verdict{font-size:15px;font-weight:600}.rc-heatmap-verdict-sub{color:var(--ds-text-secondary,var(--text-2,#555));margin-top:2px;font-size:12px}.rc-heatmap-layout-info{color:var(--ds-text-tertiary,var(--text-3,#888));margin-top:4px;font-size:11px}.rc-heatmap-insights{flex-direction:column;gap:8px;width:100%;max-height:360px;display:flex;overflow-y:auto}.rc-heatmap-insight{background:var(--ds-bg-surface-raised,var(--surface,#fafafa));border:.5px solid var(--ds-border-default,var(--border,#0000001a));border-radius:9px;align-items:flex-start;gap:8px;padding:9px 11px;display:flex}.rc-heatmap-insight-dot{border-radius:50%;flex:0 0 7px;width:7px;height:7px;margin-top:4px}.rc-heatmap-insight-content{flex:1;min-width:0}.rc-heatmap-insight-title{color:var(--ds-text-primary,var(--text-1,#111));font-size:12px;font-weight:600;line-height:1.4}.rc-heatmap-insight-body{color:var(--ds-text-secondary,var(--text-2,#555));margin-top:3px;font-size:11px;line-height:1.6}.rc-heatmap-footer{color:var(--ds-text-tertiary,var(--text-3,#888));border-top:.5px solid var(--ds-border-default,var(--border,#0000001a));margin-top:auto;padding-top:8px;font-size:10px;line-height:1.5}.rc-heatmap-card .rc-thinking-pulse,.rc-heatmap-base-loading .rc-thinking-pulse{background:var(--ds-info,var(--accent,#3b82f6));border-radius:50%;width:6px;height:6px;animation:1.4s ease-in-out infinite rc-heatmap-pulse}@keyframes rc-heatmap-pulse{0%,to{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.18)}}@media (width<=780px){.rc-heatmap-card{flex-direction:column}.rc-heatmap-card-left{flex:none;width:100%}.rc-heatmap-canvas-wrap{width:100%;max-width:480px}}
