:root{color-scheme:dark;--ink:#f7f0df;--night:#07111f;--panel:#0d2034;--orange:#ff8a3d;--teal:#38d6c2;--blue:#73a7ff;--muted:#9db0c4}*{box-sizing:border-box}html,body{overflow-x:hidden}body{margin:0;background:radial-gradient(circle at 70% 20%,#173552 0,var(--night) 48%,#03070d 100%);color:var(--ink);font:16px/1.45 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}.shell{display:grid;grid-template-columns:minmax(280px,360px) 1fr;min-height:100vh}.lesson{min-width:0;padding:28px;border-right:1px solid #ffffff1f;background:#06101bd9;overflow:auto}.eyebrow{color:var(--orange);font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:12px}.lesson h1{font-size:clamp(28px,4vw,46px);line-height:1;margin:.2em 0}.lesson h1,.lesson p,.learning,.authority,.footer{overflow-wrap:anywhere}.lesson p{color:#d1dce7}.learning{border-left:4px solid var(--teal);padding:10px 14px;background:#16314780}.graph{width:100%;height:260px;margin:20px 0;border:1px solid #ffffff24;border-radius:18px;background:#071523}.node{cursor:pointer}.node rect{fill:#142c44;stroke:#73a7ff;stroke-width:2}.node text{fill:#f7f0df;font-size:12px;font-weight:700}.node.dense text{font-size:10px}.node.active rect{fill:#5c2e1f;stroke:#ff8a3d}.edge{stroke:#637b91;stroke-width:2;marker-end:url(#arrow)}.authority{min-height:76px;color:#dbe7f2}.stage{position:relative;min-width:0;display:flex;flex-direction:column;padding:24px}.stage-head{display:flex;gap:16px;align-items:center;justify-content:space-between;margin-bottom:16px}.stage-head h2{margin:0;font-size:clamp(22px,3vw,36px)}.badge{border:1px solid #ffffff42;border-radius:999px;padding:7px 12px;color:var(--teal);font-size:13px}.viewport{position:relative;flex:1;min-height:480px;border-radius:28px;overflow:hidden;background:#050a10;box-shadow:0 25px 80px #0008,inset 0 0 0 1px #ffffff1f}.viewport canvas{display:block;width:100%;height:100%}.controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.controls button,.controls input{accent-color:var(--orange)}button{background:var(--orange);color:#1b0b02;border:0;border-radius:999px;padding:10px 16px;font-weight:800;cursor:pointer}button.secondary{background:#17324d;color:var(--ink);border:1px solid #ffffff2c}.readout{margin-left:auto;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.spec{max-width:100%;white-space:pre-wrap;font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;color:#b9c9d8;max-height:180px;overflow:auto;background:#02070c;padding:12px;border-radius:12px}.footer{color:#7f94a8;font-size:12px;margin-top:14px}.flash{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 5px var(--orange);opacity:0;transition:opacity .2s}.flash.on{opacity:1}@media(max-width:820px){.shell{grid-template-columns:minmax(0,1fr)}.lesson{border-right:0;border-bottom:1px solid #ffffff1f}.stage{padding:18px}.stage-head{align-items:flex-start;flex-wrap:wrap}.graph{height:220px}.viewport{min-height:420px}.readout{width:100%;margin:0}}

.flow-title{font-size:18px;margin:24px 0 6px}.inventory{font-size:13px;color:var(--muted)}.node:focus rect{stroke:var(--orange);stroke-width:4}.range-control{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-weight:700}.range-control input{min-width:180px;max-width:100%}.controls p{width:100%;margin:0;color:var(--muted);overflow-wrap:anywhere}.spec{max-height:360px;tab-size:2}.source-inspector{padding:24px;min-width:0;border-top:1px solid #ffffff24}.source-inspector details{margin:12px 0}.source-inspector summary,.source-identity{overflow-wrap:anywhere}.source-identity{font:12px/1.5 ui-monospace,monospace;color:var(--muted)}.source{white-space:pre-wrap;max-height:480px;user-select:text}summary{cursor:pointer}

.spec-heading{color:var(--teal);font-weight:800}.spec-step{color:#ffc490;font-weight:700}.spec-bullet{color:#b4cfff}.harness-panel{margin-top:24px}.harness-panel>p{color:var(--muted)}.harness-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px}.harness-card{border:1px solid #ffffff30;border-left:4px solid var(--teal);border-radius:12px;padding:14px;background:#0d2034;min-width:0}.harness-card h3{font-size:16px;margin:0 0 8px}.harness-card p{font-size:14px;margin:0 0 10px;color:#d1dce7}.harness-card code{font-size:12px;overflow-wrap:anywhere;color:var(--muted)}.harness-card.shared{border-left-color:var(--blue)}.harness-card.context{border-left-color:#b7a3f5}.harness-card.unselected{border-left-color:var(--orange)}
.viewport canvas{position:absolute;inset:0}