/* A circular capability navigator and an independent product demonstration. */
.workbench { --surface: var(--voice-canvas); --surface-raised: var(--voice-panel); --surface-high: var(--voice-field); --text: var(--voice-white); --text-muted: var(--voice-muted); --text-dim: var(--voice-muted); --accent: var(--voice-blue); --border: var(--voice-line); --accent-soft: var(--voice-field); --wb-wheel-tip: clamp(13.5rem,16vw,17rem); --wb-heading: clamp(1.7rem,2.4vw,2.15rem); padding-block: var(--space-20) var(--space-16); position: relative; background: var(--surface); color: var(--text); }
.workbench [hidden] { display: none !important; }
.workbench .home-section-heading { display: block; text-align: center; margin-bottom: var(--space-12); }
.workbench .home-section-heading h2 { margin-inline: auto; max-width: 24ch; font-weight: 350; }
.workbench .home-section-heading p { max-width: 64ch; margin: var(--space-5) auto 0; color: var(--text-muted); }
.wb-symbols { position: absolute; width: 0; height: 0; overflow: hidden; }
.wb-stage { position: relative; min-width: 0; max-width: 100rem; margin-inline: auto; padding-block: var(--space-12); }
.wb-orbit { position: absolute; width: var(--voice-orbit-size); height: var(--voice-orbit-size); top: 50%; left: calc(var(--wb-wheel-tip) - var(--voice-orbit-size)); transform: translateY(-50%); border: var(--stroke) solid var(--voice-line-strong); border-radius: 50%; background: radial-gradient(circle, var(--transparent) 57%, var(--voice-panel) 68%, var(--voice-field) 71%, var(--transparent) 72%); pointer-events: none; }
.wb-orbit svg { width: 100%; height: 100%; fill: none; stroke: var(--voice-line-strong); }
.wb-ring-outer { stroke-dasharray: 1 12; }.wb-ring-ticks { stroke-width: 6; stroke-dasharray: .7 14; }.wb-ring-inner { stroke-width: .7; }
.wb-rail { position: absolute; inset: 0; width: calc(var(--wb-wheel-tip) + var(--space-20)); }
.wb-tabs { position: relative; height: 100%; }
.wb-mobile-nav { display: none; }
.wb-tab { --wb-slot-x: 0rem; --wb-slot-y: 0rem; position: absolute; left: calc(var(--wb-wheel-tip) + var(--wb-slot-x)); top: calc(50% + var(--wb-slot-y)); transform: translate(-50%,-50%); display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--control-sm); width: max-content; max-width: 15rem; padding: var(--space-2) var(--space-4); color: var(--voice-muted); background: var(--voice-canvas); border: var(--stroke) solid var(--voice-line); border-radius: var(--radius-pill); font: var(--text-xs) var(--font-mono); white-space: nowrap; transition: left var(--duration-slow) var(--ease),top var(--duration-slow) var(--ease),border-color var(--duration),background var(--duration); }
.wb-tab[data-wb-slot='-2'] { --wb-slot-x: -3rem; --wb-slot-y: -9rem; }.wb-tab[data-wb-slot='-1'] { --wb-slot-x: -.75rem; --wb-slot-y: -4.5rem; }.wb-tab[data-wb-slot='1'] { --wb-slot-x: -.75rem; --wb-slot-y: 4.5rem; }.wb-tab[data-wb-slot='2'] { --wb-slot-x: -3rem; --wb-slot-y: 9rem; }
.wb-tab[data-wb-slot='-3'] { --wb-slot-x: -4.75rem; --wb-slot-y: -13.5rem; }.wb-tab[data-wb-slot='3'] { --wb-slot-x: -4.75rem; --wb-slot-y: 13.5rem; }
.wb-tab[data-wb-slot='-4'] { --wb-slot-x: -9rem; --wb-slot-y: -18rem; }.wb-tab[data-wb-slot='4'] { --wb-slot-x: -9rem; --wb-slot-y: 18rem; }
.wb-tab-number { display: none; }
.wb-tab svg { order: -1; width: var(--space-4); height: var(--space-4); flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.4; }
.wb-tab:hover { border-color: var(--accent); color: var(--text); background: var(--surface-raised); }
.wb-tab[aria-selected='true'] { width: var(--space-12); height: var(--space-12); padding: 0; justify-content: center; color: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 var(--space-1) var(--voice-panel),0 0 var(--space-8) var(--voice-glow); }
.wb-tab[aria-selected='true'] .wb-tab-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.wb-tab[aria-selected='true']::after { content: ''; position: absolute; left: 100%; top: 50%; width: var(--space-16); height: var(--stroke); background: linear-gradient(90deg,var(--accent),var(--transparent)); pointer-events: none; }
.wb-tab[aria-selected='true'] svg { width: var(--space-5); height: var(--space-5); }
.wb-panels { margin-left: calc(var(--wb-wheel-tip) + var(--space-24)); margin-right: var(--space-6); }
.wb-panel { display: grid; grid-template-columns: minmax(0,.32fr) minmax(0,1fr); gap: var(--space-10); align-items: center; scroll-margin-top: var(--space-6); }
.workbench[data-enhanced] .wb-panels { display: grid; }
.workbench[data-enhanced] .wb-panel { grid-area: 1 / 1; }
.workbench[data-enhanced] .wb-panel[hidden] { display: grid !important; visibility: hidden; pointer-events: none; }
.wb-panel + .wb-panel { margin-top: var(--space-12); }
.workbench[data-enhanced] .wb-panel { margin: 0; animation: wb-reveal var(--duration-slow) var(--ease); }
@keyframes wb-reveal { from { opacity: 0; transform: translateY(.4rem); } to { opacity: 1; transform: translateY(0); } }
.wb-caption { padding-block: var(--space-5); }
.wb-step { display: block; font: var(--text-xs) var(--font-mono); color: var(--accent); letter-spacing: var(--tracking-label); margin-bottom: var(--space-4); }
.wb-caption h3 { font-size: var(--wb-heading); font-weight: 350; line-height: 1.15; letter-spacing: -.045em; margin-bottom: var(--space-3); }
.wb-caption p { font-size: var(--text-base); line-height: 1.5; color: var(--accent); }
.wb-progress { display: flex; gap: var(--space-2); margin-block: var(--space-8) var(--space-4); }
.wb-progress i { width: 20%; height: 2px; background: var(--voice-line); }.wb-progress i.is-current { background: var(--accent); }
.wb-caption .text-link { display: inline-flex; gap: var(--space-3); align-items: center; min-height: var(--control-sm); font-size: var(--text-xs); color: var(--text-muted); }
.wb-caption .text-link:hover { color: var(--accent); }
.wb-screen { --text-sm: .75rem; min-width: 0; position: relative; padding: var(--space-2); border: var(--stroke) solid var(--voice-line-strong); border-radius: var(--radius-md); background: var(--voice-panel); box-shadow: 0 var(--space-8) var(--space-24) color-mix(in srgb,var(--voice-glow) 28%,var(--transparent)); }
.wb-screen-bar { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); border: var(--stroke) solid var(--border); border-radius: var(--radius-sm) var(--radius-sm) 0 0; font: var(--text-xs) var(--font-mono); color: var(--text-muted); }
.wb-screen-bar > span:first-child { display: inline-flex; align-items: center; gap: var(--space-4); }
.wb-screen-bar i { display: inline-block; width: .4rem; height: .4rem; border-radius: 50%; background: var(--voice-line); box-shadow: .7rem 0 0 var(--voice-line),1.4rem 0 0 var(--voice-line); margin-right: var(--space-4); }
.wb-demo-label { border: var(--stroke) solid var(--voice-line-strong); border-radius: var(--space-1); padding: var(--space-1) var(--space-2); color: var(--accent); white-space: nowrap; font-size: var(--text-xs); }
.wb-screen-body { padding: var(--space-5); min-height: 27rem; border: var(--stroke) solid var(--border); border-top: 0; border-radius: 0 0 var(--radius-sm) var(--radius-sm); background: var(--surface); }
.wb-builder-tabs { display: inline-flex; padding: var(--space-1); gap: var(--space-1); border: var(--stroke) solid var(--border); border-radius: var(--space-1); margin-bottom: var(--space-5); }
.wb-builder-tabs button { min-height: var(--space-8); border: 0; padding: var(--space-2) var(--space-3); background: var(--transparent); color: var(--text-muted); font: var(--text-xs) var(--font-mono); border-radius: var(--space-1); cursor: pointer; }
.wb-builder-tabs button[aria-pressed='true'] { background: var(--voice-white); color: var(--voice-canvas); }
.wb-builder-grid { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(0,1fr); gap: var(--space-5); }
.wb-field { margin-bottom: var(--space-4); min-width: 0; }
.wb-field > span { display: block; font: var(--text-xs) var(--font-mono); letter-spacing: .08em; color: var(--text-muted); margin-bottom: var(--space-2); }
.wb-field > div { border: var(--stroke) solid var(--border); border-radius: var(--space-1); padding: var(--space-2) var(--space-3); background: var(--voice-field); font-size: var(--text-sm); color: var(--text); }
.wb-field .wb-opening { font-style: italic; min-height: var(--space-16); }
.wb-config-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--space-2); }.wb-config-row .wb-field > div { padding-inline: var(--space-2); font-size: var(--text-xs); white-space: nowrap; }
.wb-field .wb-files, .wb-field .wb-apps { display: flex; flex-wrap: wrap; gap: var(--space-2); background: none; padding: 0; border: 0; }
.wb-files span { padding: var(--space-2); border: var(--stroke) solid var(--border); border-radius: var(--space-1); font: var(--text-xs) var(--font-mono); }
.wb-apps span { padding: var(--space-2) var(--space-3); border: var(--stroke) solid var(--voice-line-strong); border-radius: var(--radius-pill); background: var(--voice-field); font-size: var(--text-xs); }
.wb-apps span::before { content: ''; display: inline-block; width: var(--space-1); height: var(--space-1); background: var(--accent); border-radius: 50%; margin-right: var(--space-2); box-shadow: 0 0 var(--space-2) var(--accent); }
.wb-summary-box { border: var(--stroke) solid var(--border); padding: var(--space-4) var(--space-3); border-radius: var(--radius-sm); margin-bottom: var(--space-3); }
.wb-summary-box .wb-mini-label { font-size: var(--text-xs); }
.wb-summary-box strong { display: block; font-size: var(--text-xl); font-weight: 350; margin-block: var(--space-2); line-height: 1.2; }.wb-summary-box strong small { font-size: var(--text-xs); color: var(--text-muted); }
.wb-summary-box .wb-outcome { font-size: var(--text-md); color: var(--accent); }
.wb-summary-box p { font: var(--text-xs)/1.7 var(--font-mono); color: var(--text-muted); }
.wb-test-link { display: flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--control-sm); padding: var(--space-2); background: var(--voice-white); border-radius: var(--space-1); color: var(--voice-canvas); font: var(--text-xs) var(--font-mono); }.wb-test-link:hover { background: var(--accent); color: var(--voice-canvas); }.wb-test-link svg { width: var(--space-4); height: var(--space-4); fill: none; stroke: currentColor; stroke-width: 1.5; }
.wb-scene-heading .eyebrow { font-size: var(--text-sm); letter-spacing: .06em; margin-bottom: var(--space-3); }
.wb-screen h4 { margin: 0; font-size: var(--text-lg); line-height: 1.3; letter-spacing: -.025em; font-weight: 450; }
.wb-flow-steps { list-style: none; padding: 0; margin: var(--space-6) 0; }
.wb-flow-steps li { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-3) var(--space-4); border: var(--stroke) solid var(--border); background: var(--surface); border-radius: var(--radius-sm); position: relative; }
.wb-flow-steps li + li { margin-top: var(--space-3); }
.wb-flow-steps li + li::before { content: ''; position: absolute; left: var(--space-8); bottom: 100%; height: var(--space-3); border-left: var(--stroke) solid var(--accent); }
.wb-flow-steps li > span { color: var(--accent); font: var(--text-sm) var(--font-mono); }
.wb-flow-steps strong { display: block; font-size: var(--text-sm); font-weight: 500; }
.wb-flow-steps small { display: block; color: var(--text-muted); font-size: var(--text-sm); margin-top: var(--space-1); }
.wb-branch { display: flex; flex-wrap: wrap; gap: var(--space-3); font-size: var(--text-sm); }
.wb-branch span { padding: var(--space-2) var(--space-3); border: var(--stroke) solid var(--border); border-radius: var(--radius-sm); background: var(--accent-soft); }
.wb-branch span:last-child { background: var(--surface-high); }
.wb-transcript { padding: var(--space-5); margin-block: var(--space-5); background: var(--surface); border: var(--stroke) solid var(--border); border-radius: var(--radius-sm); }
.wb-transcript > span { font: var(--text-sm) var(--font-mono); color: var(--accent); }
.wb-transcript p { font-size: var(--text-sm); margin: var(--space-2) 0 var(--space-4); }
.wb-transcript p:last-child { margin-bottom: 0; }
.wb-result { margin: 0; font-size: var(--text-sm); }
.wb-result > div { display: grid; grid-template-columns: 1fr 1.8fr; gap: var(--space-3); border-top: var(--stroke) solid var(--border); padding-block: var(--space-3); }
.wb-result dt { color: var(--text-muted); }.wb-result dd { margin: 0; }.wb-result > div:first-child dd { color: var(--success); }
.wb-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.wb-metric { min-width: 0; padding: var(--space-4); background: var(--surface); border: var(--stroke) solid var(--border); border-radius: var(--radius-sm); }
.wb-mini-label { display: block; font: var(--text-sm) var(--font-mono); line-height: 1.5; color: var(--text-muted); }
.wb-large-number { font-size: clamp(1.7rem,3vw,2.6rem); line-height: 1.2; letter-spacing: -.05em; margin-block: var(--space-3); white-space: nowrap; }
.wb-large-number small { font-size: var(--text-sm); color: var(--text-muted); letter-spacing: 0; margin-left: var(--space-1); }
.wb-metric-note { font-size: var(--text-sm); line-height: 1.6; color: var(--text-muted); }
.wb-latency-bar { display: grid; grid-template-columns: 200fr 350fr 150fr 100fr; margin-block: var(--space-5) var(--space-4); border-radius: var(--space-1); overflow: hidden; }
.wb-latency-bar span { font: var(--text-xs) var(--font-mono); color: var(--on-action); background: var(--accent); padding-block: var(--space-3); text-align: center; border-right: var(--stroke) solid var(--surface); }
.wb-latency-bar span:nth-child(2) { background: var(--action); }.wb-latency-bar span:nth-child(3) { background: var(--success); }.wb-latency-bar span:nth-child(4) { background: var(--text-muted); border: 0; }
.wb-latency-key { margin: 0 0 var(--space-5); display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2) var(--space-3); font-size: var(--text-sm); }.wb-latency-key div { display: flex; justify-content: space-between; gap: var(--space-1); flex-wrap: wrap; }.wb-latency-key dt { color: var(--text-muted); }.wb-latency-key dd { margin: 0; }
.wb-rates label { display: grid; grid-template-columns: minmax(0,1fr) 5.5rem; gap: var(--space-2); align-items: center; font-size: var(--text-sm); color: var(--text-muted); }
.wb-rates label + label { margin-top: var(--space-2); }
.wb-rates label > span { overflow-wrap: anywhere; hyphens: auto; }
.workbench input { width: 100%; min-width: 0; min-height: var(--space-10); padding: var(--space-1) var(--space-2); border: var(--stroke) solid var(--text-dim); border-radius: var(--space-1); background: var(--surface-raised); color: var(--text); font: var(--text-sm) var(--font-mono); }
.workbench input[type='number'] { appearance: textfield; }
.workbench input::-webkit-inner-spin-button, .workbench input::-webkit-outer-spin-button { appearance: none; margin: 0; }
.workbench input[aria-invalid='true'] { border-color: var(--danger); }
.wb-budget { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); padding-block: var(--space-4); }
.wb-budget > label { display: grid; grid-template-columns: auto 6rem; align-items: center; gap: var(--space-3); font-size: var(--text-sm); color: var(--text-muted); }
.wb-budget > div { text-align: right; }.wb-budget > div > span { display: block; font-size: var(--text-sm); color: var(--text-muted); }.wb-budget output { font-size: var(--text-lg); }
.wb-budget-note { font-size: var(--text-sm); color: var(--text-muted); padding-top: var(--space-3); border-top: var(--stroke) solid var(--border); }
.wb-calc-error { margin-top: var(--space-3); font-size: var(--text-sm); color: var(--danger); }
.wb-hub { display: grid; grid-template-columns: 8rem minmax(0,1fr); gap: var(--space-8); align-items: center; margin-block: var(--space-8); }
.wb-hub-core { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 8rem; height: 8rem; border: var(--stroke) solid var(--accent); border-radius: 50%; box-shadow: var(--shadow-glow); color: var(--text); font-size: var(--text-xl); position: relative; }
.wb-hub-core::after { content: ''; width: var(--space-8); border-top: var(--stroke) solid var(--accent); position: absolute; left: 100%; }
.wb-hub-core > span { font: var(--text-sm) var(--font-mono); color: var(--accent); margin-top: var(--space-2); }
.wb-hub-tools { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); border-left: var(--stroke) solid var(--accent); padding-left: var(--space-4); }
.wb-hub-tools > span { display: grid; place-items: center; min-height: var(--space-12); padding: var(--space-2); border: var(--stroke) solid var(--border); border-radius: var(--radius-sm); background: var(--surface); font-size: var(--text-sm); text-align: center; }
.wb-permissions { display: flex; flex-wrap: wrap; gap: var(--space-2); font-size: var(--text-sm); color: var(--accent); margin-bottom: var(--space-4); }.wb-permissions span + span::before { content: '→'; margin-right: var(--space-2); color: var(--text-dim); }
.wb-voice { text-align: center; }.wb-language-pair { display: flex; justify-content: center; flex-wrap: wrap; gap: var(--space-3); }.wb-language-pair span { padding: var(--space-2) var(--space-3); border: var(--stroke) solid var(--border); border-radius: var(--radius-pill); font-size: var(--text-sm); color: var(--text-muted); }
.wb-wave { height: 7rem; display: flex; align-items: center; justify-content: center; gap: var(--space-1); margin-block: var(--space-6); }.wb-wave i { display: block; width: .3rem; height: var(--wave-height); border-radius: var(--radius-pill); background: var(--accent); }.wb-wave i:nth-child(3n) { background: var(--text); }
.wb-voice > p { font-size: var(--text-sm); margin-top: var(--space-3); }.wb-voice-pipeline { display: flex; align-items: center; justify-content: center; gap: var(--space-5); margin-block: var(--space-6); font: var(--text-sm) var(--font-mono); }.wb-voice-pipeline small { display: block; margin-top: var(--space-1); color: var(--text-muted); font: var(--text-xs) var(--font-sans); }.wb-voice-pipeline b { color: var(--accent); }.wb-voice > a { font-size: var(--text-sm); }

.wb-toolbar { margin: var(--space-6) var(--space-6) 0 calc(var(--wb-wheel-tip) + var(--space-24)); display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.wb-hint { font: var(--text-xs) var(--font-mono); color: var(--text-muted); }
.wb-controls { display: flex; align-items: center; gap: var(--space-6); }
.wb-paging { display: flex; align-items: center; gap: var(--space-2); font: var(--text-xs) var(--font-mono); color: var(--text-muted); }
.wb-paging > span { margin-right: var(--space-3); white-space: nowrap; }
.wb-controls button { appearance: none; display: inline-flex; align-items: center; justify-content: center; min-width: var(--control-sm); min-height: var(--control-sm); border: var(--stroke) solid var(--voice-line-strong); border-radius: var(--radius-pill); color: var(--text-muted); background: var(--surface); cursor: pointer; font: inherit; }
.wb-controls button svg { width: var(--space-4); height: var(--space-4); fill: none; stroke: currentColor; stroke-width: 1.5; }
.wb-controls button:hover { color: var(--accent); border-color: var(--accent); }
.wb-controls .wb-auto { white-space: nowrap; font-size: var(--text-xs); gap: var(--space-2); padding-inline: var(--space-3); }
.wb-auto[aria-pressed='true'] { border-color: var(--accent); color: var(--accent); }
.wb-auto [data-wb-auto-short] { display: none; }.wb-auto .wb-pause-icon, .wb-auto[aria-pressed='true'] .wb-play-icon { display: none; }.wb-auto[aria-pressed='true'] .wb-pause-icon { display: block; }
.wb-footnote { display: flex; justify-content: space-between; gap: var(--space-8); font-size: var(--text-xs); color: var(--text-muted); padding-top: var(--space-6); border-top: var(--stroke) solid var(--border); }
.wb-footnote > span { max-width: 76ch; }.wb-footnote a { color: var(--accent); flex-shrink: 0; min-height: var(--control-sm); }
.workbench:not([data-enhanced]) .wb-orbit { display: none; }
.workbench:not([data-enhanced]) .wb-rail { position: static; width: auto; margin: var(--space-6); }
.workbench:not([data-enhanced]) .wb-tabs { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.workbench:not([data-enhanced]) .wb-tab { position: static; transform: none; }
.workbench:not([data-enhanced]) .wb-panels { margin-inline: var(--gutter); }
@media (max-width: 75rem) {
  .workbench { --wb-wheel-tip: 12rem; }
  .wb-tab[data-wb-slot="-4"], .wb-tab[data-wb-slot="4"] { --wb-slot-x: -7rem; }
  .wb-panels { margin-left: calc(var(--wb-wheel-tip) + var(--space-20)); }
  .wb-panel { gap: var(--space-6); grid-template-columns: minmax(0,.34fr) minmax(0,1fr); }
  .wb-caption h3 { font-size: var(--text-xl); }.wb-caption p { font-size: var(--text-sm); }
  .wb-screen-body { padding: var(--space-4); }.wb-builder-grid { gap: var(--space-3); }
  .wb-config-row { grid-template-columns: 1fr 1fr; }.wb-config-row > :last-child { grid-column: 1/-1; }
  .wb-toolbar { margin-left: calc(var(--wb-wheel-tip) + var(--space-20)); }.wb-hint { display: none; }.wb-controls { width: 100%; justify-content: space-between; }
}
@media (max-width: 62rem) {
  .workbench { padding-block: var(--space-12); }
  .wb-stage { padding: 0 var(--gutter); }.wb-orbit { display: none; }
  .wb-rail { position: static; width: 100%; margin-bottom: var(--space-8); }
  .workbench[data-enhanced] .wb-mobile-nav { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-2); }
  .wb-mobile-nav > span { margin-right: auto; color: var(--text-muted); font-size: var(--text-xs); }
  .wb-mobile-nav button { min-width: var(--control-sm); min-height: var(--control-sm); border: var(--stroke) solid var(--voice-line-strong); border-radius: 50%; background: var(--surface); color: var(--text); cursor: pointer; }
  .wb-mobile-nav button:hover { border-color: var(--accent); color: var(--accent); }
  .wb-tabs { display: flex; gap: var(--space-2); overflow-x: auto; padding: var(--space-2) var(--space-1); scrollbar-width: thin; scrollbar-color: var(--voice-line-strong) var(--surface); }
  .wb-tab, .wb-tab[aria-selected='true'] { position: relative; left: auto; top: auto; transform: none; width: auto; height: auto; max-width: none; flex: 0 0 auto; padding: var(--space-3) var(--space-4); font-size: var(--text-xs); box-shadow: none; }
  .wb-tab[aria-selected='true'] .wb-tab-label { position: static; width: auto; height: auto; clip-path: none; overflow: visible; }
  .wb-tab[aria-selected='true']::after { display: none; }.wb-tab[aria-selected='true'] svg { width: var(--space-4); height: var(--space-4); }
  .wb-panels { margin: 0; }.wb-panel { grid-template-columns: minmax(0,.34fr) minmax(0,1fr); }
  .wb-toolbar { margin: var(--space-6) 0 0; }.wb-footnote { margin-top: var(--space-8); }
}
@media (max-width: 48rem) {
  .workbench .home-section-heading { margin-bottom: var(--space-6); }.workbench .home-section-heading h2 { font-size: var(--text-h3); max-width: 24ch; }.workbench .home-section-heading p { font-size: var(--text-sm); }
  .wb-panel { grid-template-columns: 1fr; gap: var(--space-6); }.wb-caption { padding: 0; }.wb-caption h3 { font-size: var(--text-xl); }.wb-caption p { max-width: 52ch; }
  .wb-step { margin-bottom: var(--space-3); }.wb-progress { max-width: 12rem; margin-block: var(--space-5) var(--space-2); }.wb-caption .text-link { min-height: var(--space-8); }
  .workbench[data-enhanced] .wb-panels { display: block; }.workbench[data-enhanced] .wb-panel[hidden] { display: none !important; }
  .wb-screen-body { min-height: 0; }.wb-screen-bar { padding: var(--space-3); }.wb-screen-bar i { display: none; }.wb-screen-bar > span:first-child { font-size: var(--text-xs); }
  .wb-builder-grid { grid-template-columns: 1fr; }.wb-builder-summary { display: grid; grid-template-columns: 1fr; gap: var(--space-3); }.wb-summary-box { margin: 0; display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: var(--space-2) var(--space-3); }.wb-summary-box .wb-mini-label { grid-row: 1/3; }.wb-summary-box strong { margin: 0; }.wb-summary-box p { grid-column: 2; }.wb-summary-box strong small { display: inline-block; white-space: nowrap; }.wb-test-link { grid-column: 1/-1; }
  .wb-config-row { grid-template-columns: repeat(3,1fr); }.wb-config-row > :last-child { grid-column: auto; }
  .wb-builder-tabs { display: flex; }.wb-builder-tabs button { flex: 1; font: var(--text-xs)/1.5 var(--font-sans); min-height: var(--control-sm); padding-inline: var(--space-2); }
  .wb-field > span, .wb-summary-box .wb-mini-label { font-size: var(--text-xs); }.wb-field > div, .wb-field .wb-config-row, .wb-apps span, .wb-summary-box p, .wb-files span { font-size: var(--text-sm); }
  .wb-metrics { grid-template-columns: 1fr; }.wb-latency-key { grid-template-columns: 1fr 1fr; }
  .wb-budget { flex-direction: column; align-items: stretch; }.wb-budget > label { grid-template-columns: 1fr 6rem; }.wb-budget > div { text-align: left; }
  .workbench input { min-height: var(--control-sm); font-size: var(--text-base); }
  .wb-hub { grid-template-columns: 1fr; gap: var(--space-6); justify-items: center; }.wb-hub-core::after { width: 0; height: var(--space-6); border-top: 0; border-left: var(--stroke) solid var(--accent); left: 50%; top: 100%; }.wb-hub-tools { width: 100%; padding: var(--space-4) 0 0; border-left: 0; border-top: var(--stroke) solid var(--accent); }
  .wb-result > div { grid-template-columns: 1fr; gap: var(--space-1); }.wb-voice-pipeline { gap: var(--space-3); }
  .wb-footnote { flex-direction: column; gap: var(--space-3); }.wb-paging > span { margin-right: 0; }
  .wb-auto [data-wb-auto-label] { display: none; }.wb-auto [data-wb-auto-short] { display: inline; }
}
@media (max-width: 23rem) { .wb-config-row { grid-template-columns: 1fr; }.wb-builder-summary { grid-template-columns: 1fr; }.wb-wave { gap: .15rem; }.wb-builder-tabs button { font-size: var(--text-xs); } }
@media (prefers-reduced-motion: reduce) { .workbench[data-enhanced] .wb-panel { animation: none; }.wb-tab { transition: none; } }
/* Scroll-pinned chapters: the stage stays in view while the page scrolls through the track. */
.workbench[data-pinned] .wb-stage { position: sticky; }
@media (min-width: 62.001rem) { .wb-track { margin-block: var(--space-8); } .wb-stage { padding-block: var(--space-4); } }
