/* Local preview: saved geometry plus an approved Profit redraw and reference annotations. */
.candle-motion{scroll-margin-top:100px}.candle-motion .motion-side-nav{display:grid;gap:5px}.candle-motion button.side-item{width:100%;font-family:inherit;font-weight:400;text-align:left;border:1px solid transparent;background:transparent;cursor:pointer;margin:0}.candle-motion button.side-item>span{font-size:12px;min-width:0;overflow-wrap:anywhere}.candle-motion button.side-item .ui-icon{flex:0 0 17px;width:17px;height:17px}.candle-motion button.side-item.selected{background:#2c2c30;color:#f2f2f2}.candle-motion button.side-item[data-motion-role="profit"].selected{background:#163027;color:#60dbac;border-color:#244337}.candle-motion button:focus-visible{outline:2px solid #7bbaff;outline-offset:2px}.candle-motion .chart-heading{gap:16px;align-items:center}.motion-replay{flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:7px;min-width:86px;min-height:36px;padding:7px 11px;background:#151518;border:1px solid #2c2c30;border-radius:7px;color:#b5b5bd;font:inherit;font-size:11px;cursor:pointer}.motion-replay:hover{color:#f2f2f2;background:#232327}.motion-replay svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}.candle-motion #hero-chart{max-height:none;margin:8px 0 0}.candle-motion #hero-chart text{font-family:Inter,Arial,sans-serif;font-size:10px;letter-spacing:1px}.motion-range-lines path{fill:none;stroke:#6498cb;stroke-width:1;stroke-dasharray:5 7}.motion-range-lines text{fill:#6899cb}.motion-midline path{fill:none;stroke:#73737f;stroke-width:.7;stroke-dasharray:3 8}.motion-midline text{fill:#797983}.candle-motion #hero-chart .motion-markers text{font-size:10px;letter-spacing:.25px}.motion-progress{height:2px;background:#242429}.motion-progress i{display:block;height:100%;background:#5794c5;width:100%}.candle-motion .motion-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:12px 12px 14px}.candle-motion .motion-tabs button{display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:44px;padding:10px 4px;cursor:pointer;line-height:1.4}.candle-motion .motion-tabs b{font-weight:400;overflow-wrap:anywhere}.candle-motion .motion-tabs button[data-motion-role="profit"].active{color:#67dfb1}.candle-motion .motion-markers,.candle-motion .motion-profit-background{pointer-events:none}
@media(max-width:800px){.candle-motion .model-sidebar{padding-left:6px;padding-right:6px}.candle-motion button.side-item{gap:6px;padding:12px 7px}.candle-motion button.side-item>span{font-size:10px}.candle-motion .motion-tabs button{font-size:10px;gap:5px}}
@media(max-width:560px){.candle-motion .chart-heading{padding:17px 13px 4px;gap:8px}.candle-motion .chart-symbol{font-size:14px}.candle-motion .chart-subtitle{font-size:9px}.motion-replay{min-width:75px;min-height:34px;font-size:10px;padding:6px 8px}.candle-motion .motion-tabs{grid-template-columns:repeat(2,minmax(0,1fr));padding:8px;gap:4px}.candle-motion .motion-tabs button{font-size:11px;padding:7px;min-height:39px}.candle-motion #hero-chart .motion-range-lines text,.candle-motion #hero-chart .motion-midline text{font-size:21px}.candle-motion .motion-markers{display:block}}
@media(prefers-reduced-motion:reduce){.candle-motion *{scroll-behavior:auto}}

/* Reference-style callouts and restrained Profit accents. */
.candle-motion #hero-chart .motion-markers .motion-sweep-label{font-size:14px;letter-spacing:1.65px}
.candle-motion #hero-chart .motion-markers .motion-entry-label{font-size:13px;letter-spacing:1.6px}
.candle-motion #hero-chart .motion-range-lines :is(.motion-low-label,.motion-high-label){font-size:11px;letter-spacing:1px}
.motion-profit-particles{opacity:0;pointer-events:none}
.candle-motion.profit-visible .motion-profit-particles{opacity:1}
.candle-motion #hero-chart .motion-dollar{font-size:18px;font-weight:400;fill:#70d6ad;opacity:0;animation:motion-dollar-drift 6s linear infinite;animation-play-state:paused;will-change:transform,opacity}
.candle-motion.profit-visible #hero-chart .motion-dollar{animation-play-state:running}
.candle-motion[data-playback="paused"] #hero-chart .motion-dollar,.candle-motion[data-visibility="hidden"] #hero-chart .motion-dollar{animation-play-state:paused}
@keyframes motion-dollar-drift{0%{transform:translate(0,10px) rotate(-8deg);opacity:0}18%{opacity:.27}72%{opacity:.19}100%{transform:translate(12px,-46px) rotate(9deg);opacity:0}}
@media(max-width:560px){.candle-motion #hero-chart .motion-range-lines :is(.motion-low-label,.motion-high-label){font-size:20px;letter-spacing:.3px}.motion-profit-particles>[data-profit-particle="3"],.motion-profit-particles>[data-profit-particle="4"]{display:none}.candle-motion #hero-chart .motion-dollar{font-size:24px}}
@media(prefers-reduced-motion:reduce){.candle-motion #hero-chart .motion-dollar{animation:none;opacity:0;will-change:auto}}

/* A shared centre axis and reserved rows prevent stage-caption shifts. */
.page-indicator .motion-insight{display:grid;grid-template-columns:minmax(0,1fr);width:min(100%,580px);max-width:580px;min-height:112px;justify-content:normal;align-content:start;justify-items:center;align-items:center;gap:10px;padding:14px 20px;box-sizing:border-box}
.page-indicator .motion-insight .insight-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;margin-top:0;color:#8f8f94}
.page-indicator .motion-insight .insight-icon>.ui-icon{width:24px;height:24px;flex:none}
.page-indicator .motion-insight .insight-icon>.ui-icon[hidden]{display:none}
.page-indicator .motion-insight .insight-copy{min-width:0;width:100%;text-align:center}
.page-indicator .motion-insight strong{display:block;line-height:1.5;min-height:1.5em}
.page-indicator .motion-insight p{line-height:1.6;min-height:1.6em;margin:5px 0 0}
@media(max-width:560px){.page-indicator .motion-insight{min-height:132px;padding:9px 7px;gap:10px}.page-indicator .motion-insight strong{min-height:3em}.page-indicator .motion-insight p{min-height:3.2em}.page-indicator .motion-insight .insight-icon{margin-top:0}}

/* Approved chart proportions: 84% width, 120% height of the original plot. */
.chart-proportions-v2 .candle-motion #hero-chart{display:block;width:84%;height:auto;aspect-ratio:806.4 / 516;margin:8px auto 0}

/* Keep all stage annotations readable on phones without changing the candle path. */
@media(max-width:560px){
 .candle-motion #hero-chart .motion-markers .motion-sweep-label{font-size:24px;letter-spacing:1px}
 .candle-motion #hero-chart .motion-markers .motion-entry-label{font-size:24px;letter-spacing:1px}
 .candle-motion #hero-chart [data-marker-kind="profit"] text{font-size:24px;letter-spacing:.2px}
}
