.learning-demo{--ld-orange:var(--orange,#ff8700);--ld-ink:var(--chalk,#f2f1eb);--ld-muted:#94a1a8;--ld-line:#30383d;--ld-bg:#0c0f10;--ld-mono:var(--mono,ui-monospace,monospace);--ld-body:var(--body,system-ui,sans-serif);container-type:inline-size;box-sizing:border-box;width:100%;margin:0;color:var(--ld-ink);background:var(--ld-bg);border-top:1px solid var(--ld-line);border-bottom:1px solid var(--ld-line)}
.learning-demo *{box-sizing:border-box}
.learning-demo .ld-header{display:flex;justify-content:space-between;gap:20px;padding:24px 0 28px;font:10px/1.6 var(--ld-mono);color:var(--ld-muted)}
.learning-demo .ld-header>span:first-child{letter-spacing:1px;color:var(--ld-orange)}
.learning-demo .ld-header [data-ld-status]{text-align:right}
.learning-demo .ld-stage{width:100%;max-width:1000px;margin-inline:auto}
.learning-demo .ld-map{display:block;width:100%;height:auto;overflow:visible}
.learning-demo .ld-compact{display:none}
.learning-demo .ld-map path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.learning-demo .ld-tracks path{stroke:var(--ld-line);stroke-width:4}
.learning-demo .ld-ghost{stroke:#394247;stroke-width:1.5;stroke-dasharray:5 8}
.learning-demo .ld-trace{stroke-width:4}
.learning-demo .ld-first{stroke:#ab976c}
.learning-demo .ld-reuse,.learning-demo .ld-transfer{stroke:var(--ld-orange)}
.learning-demo .ld-transfer{stroke-width:2}
.learning-demo .ld-stations circle{fill:var(--ld-bg);stroke:#77848b;stroke-width:2}
.learning-demo .ld-stations text{fill:#a8b3b9;font:18px var(--ld-mono);text-anchor:middle}
.learning-demo [data-ld-station=first][data-lit=true] circle{stroke:#c0aa7a}
.learning-demo [data-ld-station=reuse][data-lit=true] circle,.learning-demo[data-presentation=static] [data-ld-station=reuse] circle{stroke:var(--ld-orange)}
.learning-demo [data-lit=true] text{fill:var(--ld-ink)}
.learning-demo .ld-lane{fill:var(--ld-muted);font:11px var(--ld-mono);letter-spacing:1px}
.learning-demo .ld-later{fill:var(--ld-orange)}
.learning-demo .ld-saved rect{fill:var(--ld-bg);stroke:var(--ld-orange);stroke-width:1.5}
.learning-demo .ld-saved text{fill:var(--ld-ink);font:17px var(--ld-mono)}
.learning-demo .ld-saved .ld-saved-title{fill:var(--ld-orange);font-size:11px;letter-spacing:.7px}
.learning-demo .ld-agent{opacity:0;pointer-events:none}
.learning-demo .ld-agent circle{fill:var(--ld-bg);stroke:var(--ld-orange);stroke-width:2}
.learning-demo .ld-agent[data-ld-agent=first] circle{stroke:#c0aa7a}
.learning-demo .ld-agent .ld-core{fill:#f4f1e8;stroke:none}
.learning-demo .ld-chart-layer{opacity:0}
.learning-demo .ld-chart-title{fill:var(--ld-ink);font:600 25px var(--ld-body)}
.learning-demo .ld-chart-subtitle{fill:var(--ld-muted);font:14px var(--ld-mono)}
.learning-demo .ld-chart-note{fill:var(--ld-muted);font:13px var(--ld-mono);text-anchor:middle}
.learning-demo .ld-grid path{fill:none;stroke:#273136;stroke-width:1}
.learning-demo .ld-axis text{fill:var(--ld-muted);font:14px var(--ld-mono);text-anchor:end}
.learning-demo .ld-axis text[text-anchor=start]{text-anchor:start}
.learning-demo .ld-static-cost{border-top:1px solid var(--ld-line);margin-top:24px;padding-top:24px}
.learning-demo .ld-static-cost svg{display:block;width:100%;max-width:600px;height:auto;margin-inline:auto;overflow:visible}
.learning-demo .ld-static-cost .ld-axis text{font-size:16px}
.learning-demo .ld-static-line{fill:none;stroke:var(--ld-orange);stroke-width:3;stroke-linecap:round}
.learning-demo .ld-static-points circle{fill:var(--ld-bg);stroke:var(--ld-orange);stroke-width:2.5}
.learning-demo[data-presentation=animated] .ld-static-cost{display:none}
.learning-demo .ld-footer{display:flex;align-items:center;gap:22px;padding:24px 0 22px;font:10px/1.6 var(--ld-mono);color:var(--ld-muted)}
.learning-demo .ld-legend{display:flex;gap:22px;flex-wrap:wrap}
.learning-demo .ld-legend>span{display:flex;align-items:center;gap:8px}
.learning-demo .ld-legend i{width:23px;height:2px;display:block}
.learning-demo .ld-key-first{background:#ab976c}.learning-demo .ld-key-reuse{background:var(--ld-orange)}
.learning-demo .ld-qualification{margin-left:auto;font-size:9px;color:#94a1a8}
@container(max-width:760px){.learning-demo .ld-footer{flex-wrap:wrap;gap:12px 22px}.learning-demo .ld-qualification{margin-left:0}.learning-demo .ld-header{gap:16px}}
@container(max-width:480px){.learning-demo .ld-header{display:block;padding:18px 0 24px;font-size:9px;min-height:88px}.learning-demo .ld-header [data-ld-status]{display:block;text-align:left;margin-top:8px}.learning-demo .ld-wide{display:none}.learning-demo .ld-compact{display:block}.learning-demo .ld-stations text{font-size:14px}.learning-demo .ld-stations text[text-anchor=end]{text-anchor:end}.learning-demo .ld-saved text{font-size:14px}.learning-demo .ld-saved .ld-saved-title{font-size:12px;letter-spacing:0}.learning-demo .ld-lane{font-size:10px}.learning-demo .ld-chart-title{font-size:23px}.learning-demo .ld-chart-subtitle{font-size:12px}.learning-demo .ld-chart-note{font-size:13px}.learning-demo .ld-axis text{font-size:14px}.learning-demo .ld-footer{font-size:9px}.learning-demo .ld-legend{gap:14px}.learning-demo .ld-qualification{font-size:8px}.learning-demo .ld-static-cost .ld-chart-title{font-size:25px}.learning-demo .ld-static-cost .ld-chart-subtitle{font-size:14px}}