/* Graphic-first dashboard. Scoped to widgets; the rest of the application is unchanged. */
.widget-canvas{gap:22px;--viz-muted:#617286;--viz-ink:#1b2a40;--viz-line:#dce5ed;--viz-track:#e8edf5;--viz-panel:#f6f8fc;--viz-purple:#7661d6}
html[data-theme=dark] .widget-canvas{--viz-muted:#a6b7cd;--viz-ink:#edf1fb;--viz-line:#344359;--viz-track:#29354b;--viz-panel:#19253b;--viz-purple:#a394ff}
.widget-canvas .dashboard-widget.card{border-radius:18px;border:1px solid #d5dfeb;background:linear-gradient(135deg,#fff,#f8faff);box-shadow:0 6px 22px #23385809;padding:22px;container-type:inline-size;isolation:isolate}
html[data-theme=dark] .widget-canvas .dashboard-widget.card{background:radial-gradient(ellipse at 100% 0%,#413c6838,transparent 65%),linear-gradient(130deg,#202d43,#172238 70%);border-color:#3a496055;box-shadow:0 12px 30px #0002,inset 0 1px #ffffff06}
.widget-canvas .dashboard-widget .widget-handle{margin:-22px -22px 0;padding:17px 20px 12px;border:0;gap:10px;color:var(--viz-ink);font-size:.9rem;letter-spacing:-.015em;align-items:center}
.widget-handle>span{min-width:0}.widget-handle>div{opacity:.4;transition:opacity .15s}.dashboard-widget:hover .widget-handle>div,.dashboard-widget:focus-within .widget-handle>div{opacity:1}
.widget-canvas .widget-size{font-size:.65rem!important;padding:3px 7px!important;min-height:26px;border-radius:7px!important;box-shadow:none}
.widget-canvas :is(.widget-remove,.widget-duplicate){font-size:1rem;padding:3px}
.widget-filter-panel{font-size:.73rem;color:var(--viz-muted);margin:0 0 4px}.widget-filter-panel>summary{cursor:pointer;list-style:none;width:fit-content;display:flex;align-items:center;gap:7px;border:1px solid var(--viz-line);border-radius:7px;padding:4px 9px}.widget-filter-panel>summary::before{content:'☷';font-size:1rem;line-height:1}.widget-filter-panel>summary::-webkit-details-marker{display:none}.widget-filter-panel[open]{padding-bottom:12px}.widget-filter-panel[open]>summary{color:var(--viz-purple)}
.widget-canvas .widget-filters{padding-top:12px;gap:10px}.widget-canvas .widget-filters label{font-size:.7rem;min-width:110px}.widget-canvas .widget-filters select,.widget-canvas .widget-filters input{padding:7px;font-size:.75rem}
.widget-canvas .widget-status{font-size:.67rem;letter-spacing:.015em;color:var(--viz-muted);margin:8px 0 14px;min-height:1em}.widget-canvas .widget-chart{max-height:560px;padding:0;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--viz-line) transparent}.widget-canvas .widget-definition{margin-top:14px;padding-top:10px;border-top:1px solid var(--viz-line);font-size:.68rem;color:var(--viz-muted)}.widget-definition summary,.widget-records>summary{cursor:pointer;width:fit-content}.widget-canvas .widget-note{font-size:.72rem;line-height:1.6;margin:10px 0 0}
.widget-records{margin-top:16px;font-size:.72rem;color:var(--viz-muted)}.widget-records[open]>summary{margin-bottom:18px}.widget-records .widget-data-row{padding:12px;border:1px solid var(--viz-line);border-radius:10px;color:var(--viz-ink);background:var(--viz-panel);margin-bottom:8px}.widget-records .widget-data-bar{display:none}
.premium-svg{display:block;width:100%;height:auto;overflow:visible;min-height:150px}.premium-svg .viz-grid{stroke:var(--viz-line);stroke-width:1;stroke-dasharray:3 6;fill:none}.premium-svg .viz-axis{font:11px Inter,system-ui,sans-serif;fill:var(--viz-muted)}.viz-point{cursor:pointer;transition:opacity .15s}.viz-point:hover,.viz-point:focus-visible{opacity:.75;outline:none;stroke:var(--viz-ink);stroke-width:2}.viz-series-heading{display:flex;align-items:center;gap:8px;margin:12px 0 6px;color:var(--viz-ink);font-size:.75rem;font-weight:600}.viz-series-heading i{width:7px;height:7px;border-radius:50%;background:var(--series)}
.viz-ring-layout{display:grid;grid-template-columns:minmax(140px,1fr) minmax(130px,1fr);align-items:center;gap:18px;padding:8px 0}.viz-ring-track{stroke:var(--viz-track)}.premium-svg .viz-ring-total{font:600 43px Inter,system-ui,sans-serif;letter-spacing:-2px;fill:var(--viz-ink)}.viz-ring-legend{display:grid;gap:6px}.viz-ring-legend button{display:grid;grid-template-columns:8px 1fr auto;align-items:center;gap:9px;padding:9px 0;background:none;border:0;border-bottom:1px solid var(--viz-line);text-align:left;color:var(--viz-muted);font:inherit;font-size:.75rem;cursor:pointer}.viz-ring-legend i{height:7px;width:7px;border-radius:50%}.viz-ring-legend strong{font-variant-numeric:tabular-nums;color:var(--viz-ink)}
.viz-ranking{display:grid;gap:18px;padding:12px 0}.viz-rank{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:8px 12px;width:100%;padding:0 0 3px;border:0;background:transparent;font:inherit;text-align:left;cursor:pointer;color:var(--viz-ink)}.viz-rank-index{font-size:.7rem;font-variant-numeric:tabular-nums;color:var(--viz-muted);align-self:center}.viz-rank-name{font-size:.8rem;overflow-wrap:anywhere}.viz-rank-value{font-size:1rem;font-weight:650;letter-spacing:-.025em;font-variant-numeric:tabular-nums}.viz-rank-track{grid-column:2/-1;background:var(--viz-track);height:6px;border-radius:9px;overflow:hidden}.viz-rank-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,color-mix(in srgb,var(--series) 60%,transparent),var(--series))}.viz-rank:hover .viz-rank-name{color:var(--viz-purple)}
.viz-funnel{display:grid;gap:15px;padding:20px 0}.viz-funnel-step{position:relative;min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 20px;border:0;border-radius:9px;background:var(--viz-panel);font:inherit;color:var(--viz-ink);overflow:hidden;isolation:isolate;cursor:pointer}.viz-funnel-step>span:not(.viz-funnel-shape){font-size:.78rem}.viz-funnel-shape{position:absolute;inset:0 auto 0 0;z-index:-1;border-right:3px solid var(--series);background:color-mix(in srgb,var(--series) 22%,transparent)}.viz-funnel-step strong{font-size:1.15rem;font-variant-numeric:tabular-nums}
.viz-heatmap-scroll{overflow:auto;padding:20px 0 8px}.viz-heatmap{display:grid;grid-template-columns:30px repeat(24,minmax(10px,1fr));gap:4px;min-width:420px}.viz-heatmap .viz-heat-cell{width:100%;aspect-ratio:1;min-height:16px;padding:0;border:1px solid #ffffff0c;border-radius:3px;cursor:pointer;background:var(--viz-track)}.viz-heat-cell:disabled{opacity:.35;cursor:default}.viz-heat-cell:hover:not(:disabled){outline:2px solid var(--viz-ink);outline-offset:1px}.viz-day,.viz-hour{align-self:center;font-size:.58rem;color:var(--viz-muted)}.viz-scale{display:flex;justify-content:flex-end;align-items:center;gap:8px;font-size:.65rem;color:var(--viz-muted);margin:10px 0}.viz-scale i{height:5px;width:100px;border-radius:5px;background:linear-gradient(90deg,hsl(265 65% 30%),hsl(155 65% 60%))}
.viz-empty{display:grid;place-items:center;min-height:180px;border:1px dashed var(--viz-line);border-radius:12px;color:var(--viz-muted);font-size:.85rem;background:repeating-linear-gradient(0deg,transparent,transparent 39px,var(--viz-line) 40px)}.widget-canvas .comparison-legend{gap:6px;margin:12px 0 0}.widget-canvas .comparison-legend button{font-size:.7rem;border:0!important;background:var(--viz-panel);padding:5px 9px;border-radius:6px;color:var(--viz-ink)}.widget-canvas .viz-selection{font-size:.7rem;color:var(--viz-muted)}.viz-selection:empty{display:none}
.dashboard-widget[aria-busy=true] .widget-chart:empty{display:block;min-height:220px;border-radius:10px;background:linear-gradient(110deg,transparent 25%,var(--viz-panel) 45%,transparent 65%),repeating-linear-gradient(0deg,transparent,transparent 39px,var(--viz-line) 40px);background-size:200% 100%,100% 100%;animation:viz-loading 1.5s linear infinite}
@keyframes viz-loading{to{background-position:-200% 0,0 0}}
@container(max-width:360px){.viz-ring-layout{grid-template-columns:1fr}.viz-ring-layout>.premium-svg{max-width:220px;margin:auto}.viz-rank{gap:8px}.viz-rank-value{font-size:.85rem}}
@media(hover:none){.widget-handle>div{opacity:1}}@media(prefers-reduced-motion:reduce){.dashboard-widget[aria-busy=true] .widget-chart:empty{animation:none}.viz-point,.widget-handle>div{transition:none}}
.viz-headline{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:8px 0 18px}.viz-headline strong{font-size:2.25rem;letter-spacing:-.055em;font-weight:600;font-variant-numeric:tabular-nums;color:var(--viz-ink)}.viz-headline .viz-unit{font-size:.8rem;color:var(--viz-muted)}.viz-headline small{flex-basis:100%;font-size:.65rem;color:var(--viz-muted)}.widget-canvas .comparison-legend button::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--series);margin-right:6px}