.scatterplot-app-shell{--scatterplot-bg-top:#f8efe4;--scatterplot-bg-bottom:#d8eadf;--scatterplot-panel:rgba(255,251,246,.92);--scatterplot-panel-border:rgba(84,70,48,.18);--scatterplot-ink:#1f2b28;--scatterplot-muted:#566866;--scatterplot-accent:#0b6e62;--scatterplot-accent-strong:#d46c2f;--scatterplot-shadow:0 22px 60px rgba(57,43,21,.18);display:grid;grid-template-columns:320px minmax(0,1fr);gap:20px;padding:20px;font-family:Avenir Next,Trebuchet MS,Gill Sans,sans-serif;color:var(--scatterplot-ink);background:radial-gradient(circle at top left,hsla(0,0%,100%,.7),transparent 32%),linear-gradient(145deg,var(--scatterplot-bg-top),var(--scatterplot-bg-bottom));border-radius:24px;margin:16px}.scatterplot-canvas-frame,.scatterplot-side-panel{border:1px solid var(--scatterplot-panel-border);border-radius:24px;background:var(--scatterplot-panel);backdrop-filter:blur(16px);box-shadow:var(--scatterplot-shadow)}.scatterplot-side-panel{display:flex;flex-direction:column;gap:18px;padding:22px}.scatterplot-panel-block h2{margin:0 0 10px;font-family:Georgia,Times New Roman,serif;font-size:1.05rem;letter-spacing:.01em}.scatterplot-panel-title h1{margin:4px 0 10px;font-family:Georgia,Times New Roman,serif;font-size:2rem;line-height:1.05}.scatterplot-control-list,.scatterplot-query-hint,.scatterplot-status-copy{margin:0;color:var(--scatterplot-muted);line-height:1.5}.scatterplot-error-copy{margin-top:8px;color:#a64a18;font-size:.85rem}.scatterplot-panel-actions{display:flex;gap:10px;flex-wrap:wrap}.scatterplot-action-button{border:none;border-radius:999px;padding:11px 16px;font:inherit;background:var(--scatterplot-ink);color:#fff;cursor:pointer;transition:transform .14s ease,opacity .14s ease,background .14s ease}.scatterplot-action-button:hover:not(:disabled){transform:translateY(-1px)}.scatterplot-action-button:disabled{opacity:.45;cursor:default}.scatterplot-action-button-secondary{background:var(--scatterplot-accent-strong)}.scatterplot-control-list{padding-left:20px;display:grid;gap:8px}.scatterplot-speed-control{display:flex;align-items:center;gap:10px;color:var(--scatterplot-muted)}.scatterplot-speed-control input[type=range]{flex:1;accent-color:var(--scatterplot-accent)}.scatterplot-speed-value{min-width:3.5ch;text-align:right;font-variant-numeric:tabular-nums}.scatterplot-app-shell kbd{font-family:Courier New,monospace;font-size:.85em;padding:1px 6px;border-radius:999px;border:1px solid rgba(33,39,38,.18);background:hsla(0,0%,100%,.72)}.scatterplot-canvas-panel{min-width:0}.scatterplot-canvas-frame{position:relative;height:calc(100vh - 160px);min-height:520px;overflow:hidden;padding:14px}.scatterplot-canvas-frame #viz-canvas{width:100%;height:100%;display:block;border-radius:16px;outline:none;background:linear-gradient(180deg,hsla(36,62%,97%,.95),rgba(245,250,247,.95))}.scatterplot-canvas-frame #viz-canvas:focus-visible{box-shadow:0 0 0 2px rgba(11,110,98,.55)}@media (max-width:1040px){.scatterplot-app-shell{grid-template-columns:1fr}.scatterplot-canvas-frame{height:72vh}}