.engine-demo{padding-bottom:64px;scroll-margin-top:180px}.engine-demo-heading{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:25px}.engine-demo-heading h2{font-size:clamp(30px,4vw,48px);font-weight:500;letter-spacing:-.035em;line-height:1.12}.engine-demo-heading .engine-label{font-size:11px;letter-spacing:.055em;margin-bottom:12px}.engine-demo-heading>p{max-width:30ch;font-size:13px;line-height:1.7;color:#bcb7ce}.engine-demo-frame{padding:32px;border:1px solid #514061;border-radius:16px;background:radial-gradient(ellipse at 45% 0,#251934,transparent 65%),#121018}.engine-demo-route{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;align-items:center;padding-top:24px}.engine-demo-column{position:relative;min-width:0}.engine-demo-column:not(:last-child)::after{content:'→';position:absolute;right:-20px;top:calc(50% - 12px);color:#b7a0cf;font-size:18px}.engine-demo-parallel{display:grid;gap:10px}.demo-parallel-label{position:absolute;top:-24px;left:0;right:0;color:#a99bb8;font-size:9px;letter-spacing:.025em;text-align:center}.engine-demo-route button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:7px;width:100%;min-height:124px;padding:16px 12px;border:1px solid #625071;border-radius:8px;background:#1c1725;color:#f5f3ff;text-align:left;font:inherit;cursor:pointer;overflow-wrap:anywhere}.engine-demo-route button:hover{background:#2b2039}.engine-demo-route button:focus-visible{outline:2px solid #d5ff8d;outline-offset:4px}.demo-node-index{font-size:10px;color:#bca4d3}.engine-demo-route strong{font-size:15px;font-weight:500;line-height:1.3}.engine-demo-route small{font-size:10px;line-height:1.45;color:#bcb7ce}.engine-demo-route .demo-conditional{border-style:dashed;min-height:103px}.engine-demo-route .demo-person{border-color:#647c46;background:#1a2116}.engine-demo-route button[aria-pressed=true]{background:#dac8ff;border-color:#dac8ff;color:#201329;box-shadow:0 0 0 3px #dac8ff1a}.engine-demo-route button[aria-pressed=true] small,.engine-demo-route button[aria-pressed=true] .demo-node-index{color:#513a66}.engine-demo-route button.is-input{border-color:#c9b0ec;background:#30223e;box-shadow:inset 0 -3px #c9b0ec}.engine-demo-route button.demo-person[aria-pressed=true]{background:#d5ff8d;border-color:#d5ff8d;color:#233011}.engine-demo-route button.demo-person[aria-pressed=true] small,.engine-demo-route button.demo-person[aria-pressed=true] .demo-node-index{color:#3a5222}.engine-demo-key{display:flex;gap:18px;flex-wrap:wrap;margin:26px 0;font-size:10px;color:#bcb7ce}.engine-demo-key span{display:inline-flex;align-items:center;gap:7px}.engine-demo-key span::before{content:'';height:8px;width:8px;background:#dac8ff;border-radius:2px}.engine-demo-key span:nth-child(2)::before{background:#30223e;border:1px solid #c9b0ec}.engine-demo-key span:nth-child(3)::before{background:transparent;border:1px dashed #c9b0ec}.engine-demo-panels :is(details,.reading-block){border-top:1px solid #4a385a}.engine-demo-panels :is(summary,.reading-heading){font-size:16px;padding:20px 0;cursor:pointer}.engine-demo-panels :is(summary,.reading-heading):focus-visible{outline:2px solid #d5ff8d;outline-offset:4px}.engine-demo.is-enhanced .engine-demo-panels :is(summary,.reading-heading){display:none}.engine-demo-panel-body{display:grid;grid-template-columns:1fr 1fr;gap:32px;padding:26px 0 8px}.demo-panel-label{font-size:11px;color:#cbb4e4;margin-bottom:12px}.engine-demo-panel-body h3{font-size:clamp(21px,2.6vw,30px);font-weight:500;line-height:1.2;letter-spacing:-.025em;margin-bottom:15px}.engine-demo-panel-body p:not(.demo-panel-label):not(.demo-source){font-size:13px;line-height:1.8;color:#c6bfd1}.engine-demo-panel-body .demo-dependency{margin-top:18px;padding-left:13px;border-left:2px solid #a381c1}.demo-contract{padding:20px 22px;background:#1d1727;border-radius:8px;min-width:0}.demo-contract blockquote{margin:0 0 12px;font-size:17px;line-height:1.55;color:#e8d8ff}.demo-source{font-size:10px;color:#b4a8c2;margin-bottom:22px}.demo-contract dl{border-top:1px solid #483853;padding-top:15px}.demo-contract dt{font-size:10px;color:#b4a8c2;margin-bottom:6px;text-transform:uppercase;letter-spacing:.06em}.demo-contract dd{font-size:12px;line-height:1.7;color:#d6cde0}.engine-demo-caption{font-size:11px;line-height:1.7;color:#ada3bb;padding-top:22px;max-width:85ch}.engine-demo [hidden]{display:none!important}
@media(max-width:900px){.engine-demo-frame{padding:24px}.engine-demo-route{gap:15px}.engine-demo-column:not(:last-child)::after{right:-14px;font-size:14px}.engine-demo-route button{padding:12px 8px}.engine-demo-route strong{font-size:13px}.engine-demo-route small{font-size:9px}.engine-demo-panel-body{gap:24px}.demo-contract{padding:20px 18px}}
@media(max-width:620px){.engine-demo-heading{display:block}.engine-demo-heading>p{max-width:none;margin-top:16px}.engine-demo-frame{padding:20px 16px}.engine-demo-route{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding-top:24px;align-items:start}.engine-demo-column:not(:last-child)::after{display:none}.engine-demo-parallel{grid-column:2;grid-row:1 / span 2}.engine-demo-column:nth-child(3){grid-column:1;grid-row:2}.engine-demo-column:nth-child(4){grid-column:1;grid-row:3}.engine-demo-column:nth-child(5){grid-column:2;grid-row:3}.engine-demo-route button{min-height:104px;padding:14px 10px}.engine-demo-route .demo-conditional{min-height:104px}.engine-demo-parallel{gap:16px}.engine-demo-route strong{font-size:14px}.engine-demo-route small{font-size:10px}.demo-parallel-label{font-size:9px}.engine-demo-panel-body{grid-template-columns:1fr;gap:22px}.engine-demo-key{gap:10px 14px}.engine-demo{padding-bottom:44px}.demo-contract blockquote{font-size:16px}}
@media(prefers-reduced-motion:reduce){.engine-demo,.engine-demo *{scroll-behavior:auto;animation:none;transition:none}}

.engine-full-map>:is(summary,.reading-heading){max-width:1200px;margin:auto;padding:22px 32px;cursor:pointer;font-size:16px;color:#dac8ff;border-block:1px solid #514061}.engine-full-map>:is(summary,.reading-heading):focus-visible{outline:2px solid #d5ff8d;outline-offset:4px}