.responsive-plot{padding:10px 12px 0;min-height:0;height:calc(var(--plot-height) + 10px)}
.responsive-plot .lineplot{height:var(--plot-height);width:100%;overflow:visible}
.responsive-plot .lineplot text{font-size:11px;font-weight:400;fill:#8b909a}
.responsive-plot .lineplot .bar-total{font-size:11px;fill:#535d6c;font-weight:500}
.plot-hit{transition:fill .16s ease;outline:none}
.plot-hit:hover,.plot-hit:focus{fill:#7798c70b;stroke:#a6b9d3;stroke-width:1;stroke-dasharray:3 4}
.responsive-plot .chart-tooltip{z-index:3;font-size:11px;max-width:calc(100% - 50px);width:max-content;bottom:38px;background:#fffffffa}
.channel-donut{display:flex;align-items:center;gap:10px;padding:26px 16px;min-height:220px}
.donut-visual{position:relative;flex:0 1 140px;min-width:106px;max-width:180px;aspect-ratio:1}
.donut-visual svg{display:block;width:100%;height:100%;overflow:visible}
.donut-center{position:absolute;inset:32% 18%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;pointer-events:none;text-align:center}
.donut-center strong{font-size:22px;line-height:1.1;letter-spacing:-.6px;font-weight:600;color:#303641;font-variant-numeric:tabular-nums}
.donut-center span{font-size:10px;line-height:1.4;color:#838a95}
.donut-segment{transform-origin:100px 100px;transition:transform .2s ease,opacity .2s ease;cursor:pointer;outline:none}
.donut-segment.is-active{transform:scale(1.055)}
.has-active .donut-segment:not(.is-active){opacity:.36}
.donut-segment:focus-visible{stroke:#253a56;stroke-width:2.5}
.donut-legend{flex:1;min-width:0;display:grid;gap:5px}
.donut-legend-row{display:grid;grid-template-columns:6px minmax(0,1fr) auto;gap:5px 8px;align-items:center;width:100%;border:0;border-radius:6px;background:transparent;padding:7px 6px;cursor:pointer;text-align:left;transition:background .18s ease;color:#555e6b;font:inherit}
.donut-legend-row:hover,.donut-legend-row.is-active{background:#f3f6fa}
.donut-legend-row:focus-visible{outline:2px solid #91b4df;outline-offset:1px}
.donut-legend-row>i{width:6px;height:6px;border-radius:50%}
.donut-legend-row .channel-label{font-size:11px;gap:5px;white-space:nowrap}
.donut-legend-row .ui-icon{width:13px;height:13px}
.donut-legend-row strong{font-size:11px;font-weight:550;color:#333b48;font-variant-numeric:tabular-nums}
.donut-legend-row small{grid-column:3;text-align:right;font-size:10px;color:#959ca7;margin-top:-3px;font-variant-numeric:tabular-nums}
@media(max-width:600px){.responsive-plot{padding:10px 12px 0}.channel-donut{padding:20px 12px;gap:10px}.donut-visual{flex-basis:144px}.donut-legend-row{gap:5px}.donut-center strong{font-size:21px}}
@media(prefers-reduced-motion:reduce){.donut-segment,.donut-legend-row,.plot-hit{transition:none}}

/* Keep the activity card at its content height beside the longer ranking table. */
.overview-activity-grid > .analytics-panel:first-child{align-self:start}

.overview-activity-grid .rank-table td{padding-top:5px;padding-bottom:5px}

/* Size the source card to its contents rather than the neighboring detection chart. */
.overview-detection-grid > .analytics-panel:last-child{align-self:start}