/* Shared landing composition. Native admin documents keep their own design system. */
:root{
 --layout-max:1440px;--work-max:1120px;--copy-max:440px;
 --space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;
 --page-gutter:clamp(24px,5vw,80px);--column-gap:32px;
 --heading-size:clamp(34px,3.5vw,56px);--body-size:14px;--caption-size:12px;
 --action-size:44px;--compact-action-size:36px;
}
body #stage .chapter:not(.ready-chapter){padding-inline:var(--page-gutter);column-gap:var(--column-gap)}
body #stage .chapter:not(.ready-chapter) .chapter-copy{min-width:0}
body #stage .chapter:not(.ready-chapter):not(#welcome):not(#python):not(#shifts) .chapter-copy :is(h1,h2){font-size:var(--heading-size);line-height:1.08;letter-spacing:-.05em}
body #stage .chapter:not(.ready-chapter) .chapter-copy>p{font-size:var(--body-size);line-height:1.6}
body #stage .chapter .eyebrow{font-size:10px;line-height:1.4;letter-spacing:.12em}
body #stage .chapter-copy .text-link{font-size:var(--body-size);min-height:var(--compact-action-size);align-items:center}
body #stage .chapter .demo-shell{min-width:0}
body .manager-demo-tabs{gap:8px 24px;padding-top:16px}
body .manager-demo-tabs button{font-size:12px;min-height:var(--compact-action-size);line-height:1.4;padding:8px 0}
body .chapter-arrows button{width:var(--action-size);height:var(--action-size);display:grid;place-items:center;flex:none;padding:0}
body .chapter-arrows button svg{display:block;width:20px;height:20px}
body .site-header{top:24px;align-items:center}
body .site-header :is(.menu-button,.home-link,.header-home){min-height:var(--compact-action-size);display:inline-flex;align-items:center;line-height:1}
body #stage .demo-button{min-height:var(--action-size);font-size:12px;padding:12px 16px}
body #site-menu nav a{min-height:var(--action-size);display:flex;align-items:center}
/* Keep presentation types: editorial split, full working surface, intro, and finale. */
body:is([data-page=listing-studio],[data-page=autopilot]) #stage .chapter:not(.ready-chapter){gap:24px;max-width:none;margin-inline:0}
body:is([data-page=listing-studio],[data-page=autopilot]) #stage .chapter:not(.ready-chapter)>.demo-shell{max-width:var(--work-max)!important;align-self:center;width:100%}
body:is([data-page=spot],[data-page=futures],[data-page=market-makers],[data-page=trading-managers]) #stage .chapter:not(.ready-chapter):not(.wide) .chapter-copy{max-width:var(--copy-max)}
body:is([data-page=futures],[data-page=spot]) #stage #desk .chapter-copy h1{font-size:clamp(30px,3.15vw,45px)!important}
@media(min-width:761px) and (max-width:1000px) and (min-height:800px){
 :root{--page-gutter:32px;--heading-size:38px}
 body:is([data-page=spot],[data-page=futures],[data-page=market-makers],[data-page=trading-managers]) #stage .chapter:not(.ready-chapter) .chapter-copy{max-width:none}
}
@media(max-width:760px){
 :root{--page-gutter:16px;--column-gap:16px;--heading-size:30px;--body-size:13px}
 body #stage .chapter:not(.ready-chapter){gap:16px}
 body #stage .chapter:not(.ready-chapter) .chapter-copy :is(h1,h2){margin-top:8px;margin-bottom:8px}
 body #stage .chapter .eyebrow{font-size:9px}
 body .manager-demo-tabs{gap:8px 16px;padding-top:8px}
 body .site-header{top:16px}
 body #stage .chapter-copy .text-link{font-size:13px}
}
@media(max-height:700px) and (min-width:761px){:root{--heading-size:36px;--body-size:13px}body #stage .chapter:not(.ready-chapter){row-gap:16px}}
@media(prefers-reduced-motion:reduce){body .chapter-arrows button{animation:none!important}}
/* Reading pages share spacing and controls, with a readable long-form measure. */
body .docs-layout{width:calc(100% - 2 * var(--page-gutter));max-width:var(--work-max);gap:var(--space-4)}
body .legal-header{padding-inline:var(--page-gutter)}
body .legal-header button,body #legal-menu button{min-height:var(--action-size);padding:8px 16px}
body .docs-content h1{font-size:var(--heading-size);line-height:1.08}
body .docs-content h2{font-size:24px;line-height:1.3}
body .legal-page{padding-top:var(--space-4)}
body .docs-sidebar a{min-height:var(--compact-action-size);display:flex;align-items:center;font-size:var(--caption-size)}
body .docs-content :is(p,ul){max-width:72ch}
@media(max-width:760px){body .docs-layout{display:block}body .legal-page{padding-top:var(--space-3)}}

/* Slides occupy one full viewport. Constrain their content, never the track items. */
body #stage .chapter{flex:0 0 100%;width:100%;max-width:none;margin-inline:0}
body:is([data-page=listing-studio],[data-page=autopilot]) #stage .chapter>.demo-shell{margin-inline:auto}

/* The overview reserves vertical space for the readable phone example. */
@media(min-width:1001px){body:is([data-page=futures],[data-page=spot]) #stage #overview .chapter-copy{display:block;width:100%;max-width:1120px;margin-inline:auto}body:is([data-page=futures],[data-page=spot]) #stage #overview .chapter-copy .eyebrow{display:none}body:is([data-page=futures],[data-page=spot]) #stage #overview .chapter-copy h2{font-size:36px;line-height:1.1}body:is([data-page=futures],[data-page=spot]) #overview .chapter-copy br{display:none}body:is([data-page=futures],[data-page=spot]) #overview .chapter-copy>p{max-width:100%;margin:12px 0 0}}
/* Futures: compact introductions leave the workspace the vertical budget. */
body:is([data-page=futures],[data-page=spot]) #stage :is(#book,#position,#autopilot).chapter{row-gap:20px}
body:is([data-page=futures],[data-page=spot]) #stage :is(#book,#position,#autopilot) .chapter-copy{display:grid;grid-template-columns:1fr 1fr;gap:8px 32px;align-items:start;width:100%;max-width:1120px;margin-inline:auto}
body:is([data-page=futures],[data-page=spot]) #stage :is(#book,#position,#autopilot) .chapter-copy .eyebrow{display:none}
body:is([data-page=futures],[data-page=spot]) #stage :is(#book,#position,#autopilot) .chapter-copy :is(h1,h2){grid-column:1;grid-row:1/3;margin:0;font-size:clamp(30px,3vw,42px);line-height:1.08}
body:is([data-page=futures],[data-page=spot]) #stage :is(#book,#position,#autopilot) .chapter-copy>p{grid-column:2;grid-row:1;margin:0;font-size:14px;line-height:1.5}
body:is([data-page=futures],[data-page=spot]) #stage #autopilot .chapter-copy .text-link{grid-column:2;grid-row:2;justify-self:start;align-self:start;margin:0;min-height:28px;padding:0;gap:8px;font-size:12px}
body:is([data-page=futures],[data-page=spot]) #stage #autopilot .chapter-copy br{display:none}
body:is([data-page=futures],[data-page=spot]) #stage #autopilot .manager-demo-tabs{padding-top:8px}
body:is([data-page=futures],[data-page=spot]) #stage #desk .demo-shell{max-width:1320px!important}
@media(max-width:760px){body:is([data-page=futures],[data-page=spot]) #stage :is(#book,#position,#autopilot) .chapter-copy{display:flex;flex-direction:column;gap:10px}body:is([data-page=futures],[data-page=spot]) #stage :is(#book,#position,#autopilot) .chapter-copy :is(h1,h2){font-size:30px}body:is([data-page=futures],[data-page=spot]) #stage :is(#book,#position,#autopilot) .chapter-copy>p{font-size:12px}}
/* Welcome: the control pyramid and introduction share one balanced canvas. */
body[data-page=autopilot] #stage #welcome{display:grid;grid-template-columns:minmax(280px,.75fr) minmax(0,1.25fr);align-items:center;gap:32px;padding-block:12px}
body[data-page=autopilot] #stage #welcome .chapter-copy{text-align:left;max-width:500px;justify-self:end}
body[data-page=autopilot] #stage #welcome h1{font-size:clamp(40px,4.4vw,70px);line-height:1.08;letter-spacing:-.055em}
body[data-page=autopilot] #stage #welcome .chapter-copy .ap-see-action{margin-top:32px;font-size:16px;width:fit-content}
body[data-page=autopilot] #stage #welcome .ap-pyramid-host{height:100%;min-height:0;max-height:720px;display:flex;align-items:center;justify-content:center;align-self:center}
.ap-control-pyramid{width:100%;height:100%;max-width:880px;max-height:100%;overflow:visible;display:block}
.ap-control-pyramid text{font-family:var(--body),Arial,sans-serif;font-size:22px;font-weight:500;fill:#160c25;letter-spacing:-.025em}
html[data-theme=dark] .ap-control-pyramid text{fill:#100b19}
.ap-pyramid-level path{transition:filter .2s}.ap-pyramid-level:hover path{filter:brightness(1.15)}
body[data-page=autopilot] #stage #coverage .chapter-copy{text-align:left;max-width:1120px;margin-inline:auto}
body[data-page=autopilot] #stage #coverage .chapter-copy .eyebrow{display:none}
@media(max-width:760px){body[data-page=autopilot] #stage #welcome{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:16px;padding-block:8px;overflow:auto}body[data-page=autopilot] #stage #welcome .chapter-copy{max-width:none;width:100%;text-align:left}body[data-page=autopilot] #stage #welcome h1{font-size:32px}body[data-page=autopilot] #stage #welcome .chapter-copy .ap-see-action{margin-top:12px;padding:4px 0;font-size:14px}body[data-page=autopilot] #stage #welcome .ap-pyramid-host{flex:1;min-height:310px;width:100%;height:auto}.ap-control-pyramid{max-height:430px}}
@media(max-height:700px) and (min-width:761px){body[data-page=autopilot] #stage #welcome h1{font-size:42px}}

.ap-pyramid-divider{stroke:#251638;stroke-width:1;stroke-opacity:.2}
.ap-pyramid-guide path{fill:none;stroke:var(--border);stroke-width:1;stroke-dasharray:7 9}
.ap-control-pyramid .ap-pyramid-guide text,html[data-theme=dark] .ap-control-pyramid .ap-pyramid-guide text{fill:var(--muted);font-size:20px;letter-spacing:-.02em}
.ap-pyramid-mobile-layers{display:none}
@media(max-width:760px){.ap-pyramid-guide{display:none}body[data-page=autopilot] #stage #welcome .ap-pyramid-host{flex-direction:column}.ap-pyramid-mobile-layers{display:block;font:11px var(--body);color:var(--muted);margin-top:8px;text-align:center}}