/* Presentation layout only; stimulus code and original assets stay intact. */
.workspace-standalone main{padding:0 12px}
.workspace-standalone .manuscript-section #labView{max-width:none;margin:0;padding:12px 0 0;border:0}
.workspace-standalone .workspace-heading{margin-bottom:15px}
.workspace-standalone .workspace-heading h2{font-size:23px}
.workspace-standalone .workspace-kicker{font-size:8px}
.workspace-standalone .workspace-fullscreen{font-size:10px;padding:8px 11px}
@media(max-width:760px){.workspace-standalone main{padding:0 5px}.workspace-standalone .workspace-heading h2{font-size:19px}.workspace-standalone .workspace-heading{gap:10px}}

.embedded-workspace .workspace-heading>div{display:none}
.embedded-workspace .workspace-heading{justify-content:flex-end;margin-bottom:10px}
.embedded-workspace .manuscript-section #labView{padding-top:8px}

/* Half the original desktop control-column width; all released space goes to the figures. */
@media(min-width:641px){
 .workspace-standalone{--controls-width:155px}
 .workspace-standalone #labView .workspace{grid-template-columns:minmax(0,1fr) var(--controls-width)}
 .workspace-standalone #labView .controls-panel{min-width:0;padding:8px;align-self:start}
 .workspace-standalone #labView .control-heading{align-items:flex-start;flex-direction:column;gap:8px;margin-bottom:10px}
 .workspace-standalone #labView .control-heading .tiny-label{font-size:7px;letter-spacing:.04em}
 .workspace-standalone #labView .axis-control{min-width:0;padding:10px 7px;margin-bottom:8px}
 .workspace-standalone #labView .axis-heading{display:grid;grid-template-columns:20px minmax(0,1fr);gap:5px}
 .workspace-standalone #labView .axis-letter{width:20px;height:20px;font-size:10px}
 .workspace-standalone #labView .axis-heading label{font-size:11px;line-height:1.4;min-width:0}
 .workspace-standalone #labView .axis-heading output{grid-column:1/-1;font-size:18px;margin-top:4px}
 .workspace-standalone #labView .axis-control p{font-size:10px;line-height:1.5;margin:8px 0 12px;overflow-wrap:anywhere}
 .workspace-standalone #labView .range-labels{gap:8px;font-size:6.5px;line-height:1.4}
 .workspace-standalone #labView .range-labels>span{min-width:0;flex:1;white-space:normal}
 .workspace-standalone #labView .range-labels>span:last-child{text-align:right}
 .workspace-standalone #labView .segmented{flex-direction:column;gap:4px;margin-top:10px}
 .workspace-standalone #labView .segmented button{width:100%;font-size:9px;padding:7px 2px;white-space:normal}
 .workspace-standalone #labView .f0-gate,.workspace-standalone #labView .anchor-module{min-width:0;padding:10px 7px}
 .workspace-standalone #labView .f0-heading,.workspace-standalone #labView .f0-tolerance{flex-wrap:wrap;gap:5px}
 .workspace-standalone #labView .f0-heading>span{font-size:7px;letter-spacing:0}
 .workspace-standalone #labView .f0-heading strong{font-size:17px}
 .workspace-standalone #labView .f0-tolerance{font-size:9px}
 .workspace-standalone #labView .selected-anchor{flex-wrap:wrap;gap:6px}
 .workspace-standalone #labView .anchor-symbol{width:20px;height:20px;font-size:16px}
 .workspace-standalone #labView .selected-anchor strong{font-size:16px}
 .workspace-standalone #labView #poolCount{flex-basis:100%}
 .workspace-standalone #labView .anchor-distances{grid-template-columns:1fr;gap:4px}
 .workspace-standalone #labView .anchor-module .tiny-label{font-size:7px;letter-spacing:.02em}
 .workspace-standalone #labView .anchor-inspect{font-size:9px;gap:4px}
}
@media(min-width:641px) and (max-width:1023px){.workspace-standalone{--controls-width:132.5px}}
@media(min-width:1024px) and (max-width:1200px){.workspace-standalone{--controls-width:142.5px}}
@media(min-width:1536px){.workspace-standalone{--controls-width:170px}}

/* Wide article stage: simultaneous volume, speech structure and compact controls. */
.workspace-record .anchor-module{display:flex;align-items:center;gap:18px;margin:12px 0 0;padding:8px 12px}
.workspace-record .audio-top{flex:0 0 120px}.workspace-record .selected-anchor{margin:0}
.workspace-record .anchor-distances{margin:0;min-width:200px}.workspace-record .anchor-quality{margin:0}
.workspace-record .anchor-inspect{margin:0;padding:0;border:0;width:auto;white-space:nowrap}
.workspace-record .selected-anchor #poolCount{flex-basis:auto!important}
@media(min-width:821px){
 .embedded-workspace .workspace-heading{display:none}
 .workspace-standalone main{padding:0}
 .workspace-standalone #labView .workspace{gap:14px;align-items:start}
 .workspace-standalone #labView .space-stack{gap:8px}
 .workspace-standalone #labView .space-panel{height:var(--live-stage-height,540px);min-height:0;flex:none}
 .workspace-standalone #labView .space-panel.speech-open{display:grid;grid-template-columns:52% 48%;height:var(--live-stage-height,540px);min-height:0}
 .workspace-standalone #labView .speech-open #spaceMount,.workspace-standalone #labView .speech-open #axisLabels{width:52%;height:100%;bottom:0}
 .workspace-standalone #labView .speech-open .speech-shape-inspector{display:grid;grid-template-rows:32px minmax(180px,1fr) auto auto;grid-column:2;position:relative;top:auto;right:auto;width:auto;min-width:0;height:calc(var(--live-stage-height,540px) - 54px);max-height:none;margin:42px 10px 10px 0;overflow:auto}
 .workspace-standalone #labView .speech-shape-inspector canvas{width:100%;height:100%;min-height:0;object-fit:contain}
 .workspace-standalone #labView .speech-shape-inspector>p{font-size:9px;line-height:1.45;margin:5px 10px}
 .workspace-standalone #labView .speech-shape-inspector details{font-size:9px;margin:4px 10px 8px}
 .workspace-standalone #labView .speech-shape-heading{padding:5px 10px}
 .workspace-standalone #labView .speech-open .space-tools{top:auto;right:calc(48% + 12px);bottom:64px}
 .workspace-standalone #labView .speech-open .space-bottom{top:auto;left:14px;right:calc(48% + 12px);bottom:12px;font-size:8px}
 .workspace-standalone #labView .speech-open .masker-field-key{top:auto;bottom:50px;left:14px;font-size:8px}
 .workspace-standalone #labView .space-stack .route-panel{grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;padding:9px 12px}
 .workspace-standalone #labView .route-explainer strong{font-size:10px;margin-top:2px}
 .workspace-standalone #labView .route-context{font-size:8px}
 .workspace-standalone #labView .route-explainer .tiny-label{font-size:7px;letter-spacing:.04em}
 .workspace-standalone #labView .route-buttons{width:auto;gap:4px}
 .workspace-standalone #labView .route-buttons button{padding:5px 8px;font-size:9px}
 .workspace-standalone #labView .route-transport{grid-column:1/-1}
 .workspace-standalone #labView .route-play{width:25px;height:25px;font-size:10px}
 .workspace-standalone #labView .controls-panel{padding:6px}
 .workspace-standalone #labView .control-heading{flex-direction:row;gap:3px;margin-bottom:6px;align-items:center}
 .workspace-standalone #labView .control-heading .tiny-label{font-size:6px;max-width:65px}
 .workspace-standalone #labView .control-heading button{font-size:9px}
 .workspace-standalone #labView .axis-control{padding:7px 6px;margin-bottom:6px}
 .workspace-standalone #labView .axis-heading{gap:3px}
 .workspace-standalone #labView .axis-heading label{font-size:10px;line-height:1.2}
 .workspace-standalone #labView .axis-heading output{font-size:16px;margin-top:1px}
 .workspace-standalone #labView .axis-control p{font-size:9px;line-height:1.35;margin:5px 0 8px}
 .workspace-standalone #labView .range-labels{margin-top:7px;font-size:6px}
 .workspace-standalone #labView .segmented{margin-top:7px;gap:2px}
 .workspace-standalone #labView .segmented button{padding:4px 2px;font-size:9px}
 .workspace-standalone #labView .axis-control .masker-note{margin:5px 0 0;font-size:8px}
 .workspace-standalone #labView .f0-gate{padding:7px 6px;margin-bottom:0}
 .workspace-standalone #labView .f0-gate p{font-size:9px;margin:5px 0}
 .workspace-standalone #labView .f0-heading strong{font-size:15px}
 .workspace-standalone #labView .f0-summary{font-size:8px;line-height:1.35}
 .workspace-standalone #labView .workspace-record .anchor-module{padding:7px 10px;margin-top:8px;gap:14px}
 .workspace-standalone #labView .workspace-record .anchor-distances{grid-template-columns:repeat(3,1fr);margin:0}
 .workspace-standalone #labView .workspace-record .selected-anchor{margin:0;flex-wrap:nowrap}
 .workspace-standalone #labView .pool-toolbar{margin:8px 0 0;padding:8px 0}
 .workspace-standalone #labView .bank-toolbar{margin:8px 0 0;gap:12px}
}
@media(max-width:999px){.workspace-record .anchor-module{flex-wrap:wrap;gap:10px}.workspace-record .anchor-quality{flex-basis:100%}.workspace-record .anchor-distances{min-width:180px}}

@media(min-width:821px){
 /* The coordinate definitions remain available on hover and in the article. */
 .workspace-standalone #labView .axis-control>p:not(.masker-note){display:none}
 .workspace-standalone #labView .axis-heading{margin-bottom:10px}
}
/* Keep the compact rail readable in narrower desktop windows without adding rows. */
@media(min-width:821px) and (max-width:1200px){.workspace-standalone{--controls-width:155px}}

/* Tactile controls: vivid instrument colors, graduated rails and clear live readouts.
   Range hit areas expand inside the existing spacing; plot geometry stays fixed. */
.workspace-standalone #labView .axis-control.spectral{--accent:#007bb9;--edge:#93c8e0;--tint:#edf8fe;--rail:#d1e6f0}
.workspace-standalone #labView .axis-control.temporal{--accent:#bb6416;--edge:#e5b781;--tint:#fff6e9;--rail:#f0ddc4}
.workspace-standalone #labView .axis-control.masker{--accent:#516477;--edge:#b0becb;--tint:#f0f4f8;--rail:#d7e0e9}
.workspace-standalone #labView .f0-gate{--accent:#12816d;--edge:#9ccfbe;--rail:#cbe5dd}
.workspace-standalone #labView .axis-control{position:relative;border-color:var(--edge);background:linear-gradient(120deg,var(--tint),#fff);box-shadow:inset 0 1px 0 #fff,0 2px 6px #20374705;transition:border-color .16s,box-shadow .16s,background .16s}
.workspace-standalone #labView .axis-control:hover,.workspace-standalone #labView .axis-control:focus-within,.workspace-standalone #labView .axis-control.is-adjusting{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 12%,transparent),0 4px 12px color-mix(in srgb,var(--accent) 9%,transparent)}
.workspace-standalone #labView .axis-letter{color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,white);border:1px solid color-mix(in srgb,var(--accent) 35%,white);box-shadow:inset 0 1px 0 #fff;font-weight:600}
.workspace-standalone #labView .axis-heading label{color:#233e50;font-weight:600}
.workspace-standalone #labView .axis-heading output{color:var(--accent);font-size:21px;line-height:1;font-weight:500;letter-spacing:-.04em;transform-origin:right center;transition:transform .14s,text-shadow .14s}
.workspace-standalone #labView .axis-control.is-adjusting .axis-heading output{transform:scale(1.06);text-shadow:0 2px 14px color-mix(in srgb,var(--accent) 24%,transparent)}
.workspace-standalone #labView .range-labels{color:#526676;letter-spacing:.01em}
.workspace-standalone #labView .controls-panel input[type=range],
.workspace-standalone #labView .route-transport input[type=range]{
 appearance:none;-webkit-appearance:none;display:block;box-sizing:border-box;padding:0;border:0;border-radius:0;
 height:24px;width:100%;background:linear-gradient(90deg,var(--accent) 0%,var(--accent) var(--range-fill,0%),var(--rail,#d8e6ed) var(--range-fill,0%),var(--rail,#d8e6ed) 100%) center/100% 7px no-repeat;
 cursor:ew-resize;touch-action:pan-y;outline-offset:3px;
}
.workspace-standalone #labView .axis-control input[type=range]{margin:-9.5px 0}
.workspace-standalone #labView .f0-gate input[type=range]{--accent:#12816d;margin:-5px 0 0}
.workspace-standalone #labView .route-transport input[type=range]{--accent:#287cab;--rail:#dce7ee;margin:0}
.workspace-standalone #labView input[type=range]::-webkit-slider-runnable-track{height:24px;border:0;border-radius:4px;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(10% - 1px),#ffffffa6 calc(10% - 1px),#ffffffa6 10%) center/100% 7px no-repeat}
.workspace-standalone #labView input[type=range]::-moz-range-track{height:7px;border:0;border-radius:4px;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(10% - 1px),#ffffffa6 calc(10% - 1px),#ffffffa6 10%)}
.workspace-standalone #labView input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;box-sizing:border-box;width:20px;height:20px;margin-top:2px;border:3px solid white;border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent),0 2px 5px #233f5130;transition:box-shadow .14s,transform .14s}
.workspace-standalone #labView input[type=range]::-moz-range-thumb{box-sizing:border-box;width:20px;height:20px;border:3px solid white;border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent),0 2px 5px #233f5130;transition:box-shadow .14s,transform .14s}
.workspace-standalone #labView .spectral input[type=range]::-webkit-slider-thumb{width:15px;height:22px;margin-top:1px;border-radius:5px;background:linear-gradient(90deg,var(--accent) 0 42%,#9bdcff 42% 58%,var(--accent) 58%)}
.workspace-standalone #labView .spectral input[type=range]::-moz-range-thumb{width:15px;height:22px;border-radius:5px;background:linear-gradient(90deg,var(--accent) 0 42%,#9bdcff 42% 58%,var(--accent) 58%)}
.workspace-standalone #labView .masker input[type=range]::-webkit-slider-thumb{width:14px;height:22px;margin-top:1px;border-radius:7px}
.workspace-standalone #labView .masker input[type=range]::-moz-range-thumb{width:14px;height:22px;border-radius:7px}
.workspace-standalone #labView input[type=range]:hover::-webkit-slider-thumb,.workspace-standalone #labView input[type=range]:focus-visible::-webkit-slider-thumb,.workspace-standalone #labView input[type=range]:active::-webkit-slider-thumb{box-shadow:0 0 0 1px var(--accent),0 0 0 5px color-mix(in srgb,var(--accent) 14%,transparent),0 3px 7px #233f5130}
.workspace-standalone #labView input[type=range]:hover::-moz-range-thumb,.workspace-standalone #labView input[type=range]:focus-visible::-moz-range-thumb,.workspace-standalone #labView input[type=range]:active::-moz-range-thumb{box-shadow:0 0 0 1px var(--accent),0 0 0 5px color-mix(in srgb,var(--accent) 14%,transparent),0 3px 7px #233f5130}
.workspace-standalone #labView input[type=range]:focus-visible{outline:2px solid var(--accent)}
.workspace-standalone #labView .f0-gate:focus-within,.workspace-standalone #labView .f0-gate.is-adjusting{border-color:#12816d;box-shadow:0 0 0 2px #12816d18}
.workspace-standalone #labView .f0-tolerance output{font-size:12px;font-weight:600;color:#08725f}
.workspace-standalone #labView .segmented button{transition:background .14s,color .14s,box-shadow .14s}
.workspace-standalone #labView .segmented button.active{background:#516477;box-shadow:inset 0 1px 0 #ffffff30,0 2px 4px #30445520}
.workspace-standalone #labView .route-play{color:white;background:#287cab;border-color:#287cab;box-shadow:0 2px 6px #287cab26}
.workspace-standalone #labView .route-buttons button.active{color:#125d85;background:#e8f4fb;border-color:#68a5c8;box-shadow:inset 0 1px 0 white}
@media(prefers-reduced-motion:reduce){.workspace-standalone #labView .axis-control,.workspace-standalone #labView .axis-heading output,.workspace-standalone #labView .segmented button{transition:none}.workspace-standalone #labView .axis-control.is-adjusting .axis-heading output{transform:none}.workspace-standalone #labView input[type=range]::-webkit-slider-thumb{transition:none}.workspace-standalone #labView input[type=range]::-moz-range-thumb{transition:none}}

/* First-use guidance stays inside the existing rail; pointer events reach the slider. */
.workspace-standalone #labView .f0-gate,
.workspace-standalone #labView .axis-heading{position:relative}
.workspace-standalone #labView .needs-exploration .control-heading .tiny-label{color:#0877a1;font-weight:600;letter-spacing:.04em}
.workspace-standalone #labView .slider-drag-label{display:none}
.workspace-standalone #labView .slider-invitation{position:absolute;z-index:4;width:0;height:0;pointer-events:none;opacity:0;color:var(--accent)}
.workspace-standalone #labView .slider-cue-ring{position:absolute;left:-15px;top:-15px;width:30px;height:30px;border:1.5px solid currentColor;border-radius:50%;box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 13%,transparent)}
.workspace-standalone #labView .slider-cue-hand{position:absolute;left:0;top:3px;width:23px;height:27px;overflow:visible;filter:drop-shadow(0 2px 2px #163e4933);stroke:var(--accent);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;fill:#fff}
.workspace-standalone #labView .gesture-arrow{fill:none;stroke-width:1.7}
.workspace-standalone #labView .is-cue-visible .slider-invitation{animation:slider-cue-reveal 1.1s ease-in-out var(--cue-delay) 3 both}
.workspace-standalone #labView .is-cue-visible .slider-cue-hand{animation:slider-cue-swipe 1.1s ease-in-out var(--cue-delay) 3 both}
.workspace-standalone #labView .is-cue-visible .slider-cue-ring{animation:slider-cue-ring 1.1s ease-out var(--cue-delay) 3 both}
.workspace-standalone #labView .cue-offscreen .slider-invitation,
.workspace-standalone #labView .cue-offscreen .slider-invitation *,
.workspace-standalone #labView .cue-paused .slider-invitation,
.workspace-standalone #labView .cue-paused .slider-invitation *{animation-play-state:paused}
@keyframes slider-cue-reveal{0%,100%{opacity:0}15%,83%{opacity:1}}
@keyframes slider-cue-swipe{0%,18%,100%{transform:translateX(0)}48%{transform:translateX(13px)}78%{transform:translateX(-5px)}}
@keyframes slider-cue-ring{0%{transform:scale(.85);opacity:.8}75%,100%{transform:scale(1.42);opacity:0}}
@media(min-width:821px){
 .workspace-standalone #labView .slider-drag-label{display:block;position:absolute;left:0;bottom:0;color:var(--accent);border:1px solid var(--edge);background:#fff;border-radius:4px;font-size:8px;line-height:1.2;font-weight:600;letter-spacing:0;padding:3px 5px;pointer-events:none}
}
@media(prefers-reduced-motion:reduce){
 .workspace-standalone #labView .slider-invitation,.workspace-standalone #labView .slider-invitation *{animation:none!important}
 .workspace-standalone #labView .slider-invitation{display:none}
}