/* A single working grid, followed by live options and copyable source. */
/* Share Chart's neutral surfaces; reserve olive for product accents. */
body[data-product="grid"] {
  --accent:#536333;--accent-hover:#44512c;--accent-ink:#44552c;--on-accent:#fff;
}
html[data-theme="dark"] body[data-product="grid"] {
  --accent:#c1cc9e;--accent-hover:#d6dfbc;--accent-ink:#d6dfbc;--on-accent:#202718;
}
body[data-view="workspace"] .site-layout {grid-template-columns:240px minmax(0,1fr)}
body[data-view="workspace"] .page-outline {display:none}
body[data-view="workspace"] #sidebar {width:240px}
body[data-view="workspace"] main {padding:0;max-width:none;min-width:0;container-type:inline-size}
.grid-workbench {--gw-gutter:clamp(20px,3cqi,44px);--gw-top:32px;padding:var(--gw-top) var(--gw-gutter) 48px;max-width:1700px;margin:auto}
.gw-intro {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:24px;margin:calc(-1 * var(--gw-top)) calc(-1 * var(--gw-gutter)) 28px;padding:var(--gw-top) var(--gw-gutter);border-bottom:1px solid var(--line);background:radial-gradient(1000px 240px at 10% -10%,var(--accent-soft),transparent 70%)}
.gw-intro > div {min-width:0}
.gw-intro > [data-gw-prompt] {grid-column:1 / -1}
.gw-eyebrow {color:var(--accent-ink);font-size:10px;font-weight:700;letter-spacing:.14em}
.gw-intro h1 {font-size:clamp(24px,2.9cqi,38px);line-height:1.25;letter-spacing:-.045em;margin:10px 0}
.gw-intro p {font-size:14px;color:var(--muted);margin:0}
.gw-mobile-break {display:none}
.gw-start {display:inline-flex;align-items:center;gap:14px;padding:10px 14px;border:1px solid var(--accent-line);border-radius:6px;color:var(--accent-ink);font-size:13px;white-space:nowrap}
.gw-workspace {display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"canvas" "config" "result" "source";align-items:start;border:1px solid var(--line-strong);border-radius:10px;overflow:hidden;background:var(--bg)}
.gw-canvas {grid-area:canvas;min-width:0;display:flex;flex-direction:column}
.gw-workspace-heading {min-height:52px;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid var(--line);background:var(--surface)}
.gw-workspace-heading>div {display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.gw-workspace-heading strong {font-size:13px;font-weight:650}
.gw-live-dot {width:6px;height:6px;background:var(--accent);border-radius:50%}
.gw-dataset-label {font-size:11px;color:var(--faint);padding-left:6px}
.gw-row-count {font:11px var(--font-mono);color:var(--muted);white-space:nowrap}
.gw-toolbar {display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;flex-wrap:wrap}
.gw-toolbar[hidden],.gw-config[hidden] {display:none}
.gw-toolbar:not(:has(.gw-search)) {justify-content:flex-end}
.gw-search {display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:5px;height:33px;padding:0 10px;color:var(--faint);background:var(--bg);min-width:0}
.gw-search input {min-width:0;width:160px;background:transparent;border:0;color:var(--text);font-size:12px;outline:0}
.gw-search:focus-within {outline:2px solid var(--accent);outline-offset:2px}
.gw-toolbar-actions {display:flex;align-items:center;gap:3px;flex-wrap:wrap}
.grid-workbench button:not(.sy-grid button),.gw-state-actions button {font-family:inherit}
.gw-toolbar button,.gw-config-heading button,.gw-state-actions button,.gw-guide-actions button,.gw-loading button {display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:30px;padding:5px 9px;font-size:11px;color:var(--muted);border:1px solid var(--line);border-radius:5px;background:var(--bg);cursor:pointer}
.gw-toolbar button:hover,.gw-config-heading button:hover,.gw-state-actions button:hover,.gw-guide-actions button:hover {background:var(--hover);color:var(--text)}
.grid-workbench button:disabled {opacity:.4;cursor:default}
.grid-workbench :is(button,input,select,a):focus-visible {outline:2px solid var(--accent);outline-offset:3px}
.gw-toolbar-divider {height:18px;border-left:1px solid var(--line);margin:0 5px}
.gw-grid-host {min-height:510px;min-width:0;isolation:isolate;overflow:hidden}
.gw-grid-host>sy-grid {display:block;min-width:0;width:100%}
.gw-grid-host .sy-grid {border-inline:0!important;border-radius:0!important}
.gw-loading {display:grid;place-content:center;min-height:510px;padding:28px;text-align:center;font-size:13px;color:var(--muted)}
.gw-loading button {justify-self:center;margin-top:14px}
.gw-status {grid-area:result;min-width:0;padding:10px 16px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);scroll-margin-top:80px}
.gw-result-heading {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.gw-result-heading strong {font:600 11px/1.6 var(--font-mono);color:var(--accent-ink);overflow-wrap:anywhere}
.gw-result-heading>div {display:flex;gap:12px;flex:none}
.gw-result-heading button {display:inline-flex;align-items:center;gap:5px;padding:2px 0;border:0;background:none;font:inherit;color:var(--muted);cursor:pointer}
.gw-result-heading button:hover {color:var(--text)}
.gw-status p {margin:6px 0 0;line-height:1.6;overflow-wrap:anywhere}
.gw-result-json {max-height:120px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 0;font:11px/1.6 var(--font-mono);color:var(--text);tab-size:2}
.gw-state-actions {display:flex;flex-wrap:wrap;gap:6px;flex:none}
.gw-state-actions button {padding:5px 9px;font-size:11px;white-space:nowrap}
.gw-config {grid-area:config;min-width:0;padding:20px 24px;border-top:1px solid var(--line);background:var(--bg)}
.gw-config-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.gw-config-heading h2 {font-size:13px;margin:0;font-weight:650}
.gw-config-heading>div {display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.gw-config-help {font-size:11px;line-height:1.6;color:var(--faint);margin:0}
.gw-select-fields {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 24px;padding:8px 0 18px}
.gw-select-fields label {display:flex;flex-direction:column;align-items:stretch;gap:8px;font-size:12px;color:var(--muted);min-width:0}
.gw-config select,.gw-config input[type="number"] {width:100%;min-width:0;max-width:100%;background:var(--bg);color:var(--text);border:1px solid var(--line-strong);border-radius:5px;padding:7px 9px;font:12px var(--font-sans)}
.gw-switches {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 32px;border:0;padding:2px 0 16px;margin:0;min-width:0}
.gw-switches legend {position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}
.gw-switch {display:flex;align-items:center;justify-content:space-between;min-height:32px;font-size:12px;gap:8px;cursor:pointer}
.gw-switch>span {display:flex;align-items:center;gap:6px}
.gw-switch input {appearance:none;width:27px;height:16px;flex:none;border:1px solid var(--line-strong);border-radius:20px;background:var(--line-strong);position:relative;cursor:pointer;margin:0;transition:background .15s}
.gw-switch input::after {content:'';position:absolute;width:10px;height:10px;border-radius:50%;background:var(--bg);top:2px;left:2px;transition:transform .15s}
.gw-switch input:checked {background:var(--accent);border-color:var(--accent)}
.gw-switch input:checked::after {transform:translateX(11px);background:var(--on-accent)}
.gw-pro {display:inline-flex;align-items:center;flex:none;white-space:nowrap;font-size:9px;letter-spacing:.04em;font-weight:600;padding:0 5px;border:1px solid var(--accent-line);border-radius:4px;line-height:16px;color:var(--accent-ink);background:var(--accent-soft);vertical-align:middle}
body[data-product="grid"] .pro-badge {flex-shrink:0}
.gw-api-name {display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.gw-docs .section-heading h2 .gw-pro {margin-left:6px}
.gw-analysis-label {display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:12px}
.gw-analysis-label select {width:100%;margin-top:2px}
.gw-config-note {font-size:10px;line-height:1.7;color:var(--faint);margin:0}
/* Use the same inline source disclosure as Chart previews. */
.gw-preview-source {grid-area:source;min-width:0;border-top:1px solid var(--line);scroll-margin-top:80px}
.gw-preview-source>summary {display:flex;align-items:center;gap:8px;padding:11px 20px;background:var(--surface);font-size:13px;font-weight:600;color:var(--text);cursor:pointer;list-style:none}
.gw-preview-source>summary::-webkit-details-marker {display:none}
.gw-preview-source>summary:hover {color:var(--text)}
.gw-preview-source>summary svg:last-child {transition:transform .15s}
.gw-preview-source[open]>summary svg:last-child {transform:rotate(90deg)}
.gw-preview-source>summary:focus-visible {outline:2px solid var(--accent);outline-offset:-3px}
/* Documentation uses the same sections, code tabs and tables as Chart. */
.gw-doc-links {display:flex;flex-wrap:wrap;gap:12px 24px;margin:28px 0 36px;font-size:13px;color:var(--accent-ink)}
.gw-doc-links a {display:inline-flex;align-items:center;gap:6px}
.gw-doc-links a:hover {text-decoration:underline;text-underline-offset:3px}
.gw-docs {font-size:15px;line-height:1.75;min-width:0}
.gw-docs h3 {font-size:16px;margin:26px 0 12px}
.gw-docs .chart-source-link {display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--accent-ink)}
.gw-docs .line-note {display:flex;gap:10px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface);font-size:13px;color:var(--muted)}
.gw-docs .line-note svg {flex:none;margin-top:4px}
.gw-usage-guide {container-type:inline-size;font-size:14px;line-height:1.8;overflow-wrap:anywhere}
.gw-usage-guide h3 {font-size:15px;margin:28px 0 14px;color:var(--text)}
.gw-guide-intro {max-width:88ch;margin:0 0 24px;color:var(--muted);font-size:15px}
.gw-guide-steps {list-style:none;counter-reset:grid-step;display:grid;gap:20px;margin:0 0 26px;padding:0}
.gw-guide-steps>li {counter-increment:grid-step;display:flex;align-items:flex-start;gap:14px;margin:0}
.gw-guide-steps>li::before {content:counter(grid-step);display:grid;place-items:center;flex:none;width:28px;height:28px;border:1px solid var(--accent-line);border-radius:50%;color:var(--accent-ink);background:var(--accent-soft);font:600 12px/1 var(--font-mono)}
.gw-guide-steps>li>div {min-width:0;max-width:88ch}
.gw-guide-steps strong {font-weight:600;color:var(--text)}
.gw-guide-steps p {margin:3px 0 0;color:var(--muted)}
.gw-guide-result {padding:16px 20px;border-left:3px solid var(--accent);border-radius:0 var(--radius-m) var(--radius-m) 0;background:var(--surface)}
.gw-guide-result strong {font-size:13px;color:var(--accent-ink)}
.gw-guide-result p {margin:4px 0 0;color:var(--text)}
.gw-guide-note {max-width:96ch;margin:12px 0 0;font-size:13px;color:var(--muted)}
.gw-guide-terms {display:grid;gap:0;margin:0;border-top:1px solid var(--line)}
.gw-guide-terms>div {display:grid;grid-template-columns:minmax(140px,200px) 1fr;gap:20px;padding:12px 0;border-bottom:1px solid var(--line)}
.gw-guide-terms dt {font-size:13px;font-weight:600;color:var(--text)}
.gw-guide-terms dd {margin:0;color:var(--muted)}
.grid-quick-guide {margin-top:32px}
@container(max-width:620px){.gw-guide-terms>div{grid-template-columns:1fr;gap:3px}.gw-guide-steps>li{gap:10px}.gw-guide-result{padding:14px 16px}}
.gw-guide-actions {display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}
.gw-guide-actions .chart-source-link {padding:0;border:0;background:none;font-size:13px;color:var(--accent-ink)}
.gw-guide-actions [data-gw-action] {color:var(--accent-ink);border-color:var(--accent-line);background:var(--accent-soft)}
.gw-code {margin-top:20px}
.gw-code pre {padding:20px 90px 20px 18px;max-height:400px}
.gw-preview-source .line-code-tabs {border-top:1px solid var(--line);flex-wrap:wrap}
.gw-preview-source .gw-code {margin:0;border:0;border-radius:0}
.gw-preview-source>summary svg:last-child {margin-left:auto}
#grid-data-panel {max-height:440px;overflow:auto;padding:0 20px 18px}
#grid-data-panel .line-fine {margin-bottom:12px}
#grid-data-panel table {min-width:760px}
.gw-column-keys {display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 0;font-size:12px;color:var(--faint)}
.gw-api-toolbar {display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin:16px 0}
.gw-api-toolbar .chart-api-search {flex:1;min-width:220px;margin:0}
.gw-api-scope {display:flex;gap:6px;align-items:center;font-size:13px;white-space:nowrap;color:var(--muted)}
.gw-api-scope input {accent-color:var(--accent)}
.gw-docs .line-table-scroll {max-width:100%;overflow:auto}
.gw-docs .line-api-table {table-layout:fixed;width:100%;min-width:590px}
.gw-docs .line-api-table th:nth-child(2) {width:33%}
.gw-docs .line-api-table td {vertical-align:top;overflow-wrap:anywhere}
.gw-docs .line-api-table td small {white-space:pre-wrap;overflow-wrap:anywhere}
.gw-type-contract {padding:8px 0;border-top:1px solid currentColor;font-size:12px}
.gw-type-contract summary {cursor:pointer}
.gw-panel-heading h2 {font-size:20px;letter-spacing:-.03em;margin:8px 0 10px}
.gw-panel-heading p {font-size:13px;line-height:1.75;color:var(--muted);margin:0}
@container(max-width:620px){.gw-code pre{padding:48px 14px 16px}.gw-preview-source>summary{padding:11px 16px}.gw-preview-source .line-code-tabs{padding:0 6px}.gw-preview-source .line-code-tabs button{padding:11px 9px;font-size:12px}.gw-preview-source .line-code-tabs>span{display:none}.gw-docs .line-api-table{min-width:530px}.gw-doc-links{gap:10px 18px}#grid-data-panel{padding:0 14px 14px}}
.gw-feature-index {border-top:1px solid var(--line);padding-top:28px;scroll-margin-top:80px}
.gw-feature-groups {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;margin-top:25px}
.gw-feature-groups h3 {font-size:12px;margin:0 0 9px;color:var(--text)}
.gw-feature-groups a {display:flex;align-items:center;gap:7px;min-height:28px;padding:4px 0;font-size:11px;color:var(--muted);line-height:1.5}
.gw-feature-groups a:hover {color:var(--accent-ink);text-decoration:underline}
@container(max-width:1050px){.gw-config{padding:18px 20px}.gw-toolbar-actions{gap:4px}.gw-toolbar button{padding:5px 6px;font-size:10px}.gw-feature-groups{grid-template-columns:repeat(3,minmax(0,1fr))}.gw-dataset-label{display:none}}
@container(max-width:780px){.gw-intro{column-gap:12px}.gw-config-footer{align-items:flex-start}.gw-config-heading>div{gap:4px 10px}}
@container(max-width:500px){.grid-workbench{--gw-top:24px;--gw-gutter:18px;padding:24px 18px}.gw-intro{align-items:flex-start}.gw-intro h1{font-size:27px}.gw-intro p{font-size:12px;max-width:240px}.gw-mobile-break{display:block}.gw-start{padding:7px 9px;font-size:11px;gap:6px;margin-top:22px}.gw-toolbar{padding:12px}.gw-search{width:100%}.gw-search input{width:100%}.gw-toolbar-actions{width:100%}.gw-toolbar-actions button{flex:1;white-space:nowrap}.gw-toolbar-divider{display:none}.gw-switches{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 18px}.gw-select-fields{grid-template-columns:1fr;gap:14px}.gw-config-footer{flex-direction:column}.gw-config select{font-size:12px;width:100%;min-width:0}.gw-analysis-label select{width:100%}.gw-code pre{font-size:11px}.gw-feature-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}}
@media(max-width:800px){body[data-view="workspace"] .site-layout{display:block}body[data-view="workspace"] #sidebar{width:min(320px,85vw)}}
@media(prefers-reduced-motion:reduce){.gw-switch input,.gw-switch input::after{transition:none}}

/* The workspace search controls quickFilterText; keep one visible search input. */
.gw-grid-host .sy-grid__quick-filter{display:none}
.gw-grid-host .sy-grid__toolbar:not(:has(.sy-grid__toolbar-import,.sy-grid__toolbar-button)){display:none}
@media(max-width:650px){body[data-product="grid"] .site-header .license-link{display:none}body[data-product="grid"] .header-brand{flex:none}body[data-product="grid"] .header-end{gap:6px}}
@container(max-width:500px){.gw-toolbar-actions button svg{display:none}.gw-toolbar-actions{flex-wrap:nowrap}.gw-toolbar-actions button{padding:5px 6px;font-size:10px}}
.gw-package-help,.gw-downloads p{font-size:12px;line-height:1.7;color:var(--muted)}.gw-downloads{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}.gw-downloads a{display:inline-flex;margin:0 20px 8px 0;font-size:12px;color:var(--accent-ink)}
.grid-brand-preview{min-width:0;min-height:280px;overflow:hidden}
.grid-brand-preview sy-grid{display:block;width:100%;min-width:0}
.grid-reference-page .chart-brand-controls input[type="file"]{min-width:0;width:240px}

.gw-intro h1 .gw-pro {margin-left:6px;vertical-align:middle;letter-spacing:.04em}
.gw-config-heading button {border:0;padding:4px 0;min-height:24px;background:none;flex:none}
.gw-option-group {border:0;border-top:1px solid var(--line);padding:14px 0 0;margin:0;min-width:0}
.gw-option-group>legend {padding:0 10px 0 0;font-size:12px;font-weight:600;color:var(--text)}
.gw-option-group>legend>span {margin-left:6px;color:var(--faint);font:10px var(--font-mono);font-weight:400}
.gw-display-fields {grid-template-columns:repeat(4,minmax(0,1fr))}
@container(max-width:780px){.gw-display-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container(max-width:500px){.gw-option-group{padding-top:12px}.gw-display-fields{gap:14px}}
.gw-feature-fields {padding-top:0;padding-bottom:20px}
.gw-config-footer {border-top:1px solid var(--line);padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:12px}

/* Keep scrolling data behind pinned cells when the sample row is highlighted. */
.gw-grid-host .sy-grid__row:hover {--gw-pin-tint:var(--sy-grid-row-bg-hover)}
.gw-grid-host .sy-grid__row--active {--gw-pin-tint:var(--sy-grid-active-row-bg)}
.gw-grid-host .sy-grid__row--selected {--gw-pin-tint:var(--sy-grid-row-bg-selected)}
.gw-grid-host .sy-grid__row:is(:hover,.sy-grid__row--active,.sy-grid__row--selected) .sy-grid__cell:is(.sy-grid__cell--pinned-left,.sy-grid__cell--pinned-right):not(.sy-grid__cell--in-range) {background-color:var(--sy-grid-viewport-bg);background-image:linear-gradient(var(--gw-pin-tint),var(--gw-pin-tint))}
@container(max-width:500px){.gw-grid-host .sy-grid__pagination{flex-wrap:wrap;white-space:nowrap}.gw-grid-host .sy-grid__pagination>*{flex-shrink:0}}