.mcp-stories{max-width:620px;margin:36px auto 0;display:grid;gap:22px;text-align:left}
.mcp-stories::before{content:'This is what secure AI access looks like';display:block;font-size:1.1rem;font-weight:600;letter-spacing:-.02em;color:#243b49;margin:0 0 -4px}
.mcp-story{min-width:0}.lp-root .mcp-story h3{font-size:17px;line-height:1.4;font-weight:550;letter-spacing:-.02em;color:#253c49;margin:0 0 9px}
.mcp-canvas{border:1px solid #d5dfe1;border-radius:8px;background:#fcfcfb;overflow-x:auto;scrollbar-width:thin}
.mcp-canvas>svg{display:block;width:100%;min-width:480px;font-family:Inter,sans-serif}
.mcp-canvas text{font-size:14px;fill:#526571;font-weight:400}
.demo-box{fill:#f0f4f5;stroke:#bbc9ce}.demo-screen{fill:#fff;stroke:#aabcc5;stroke-width:1.5}
.mcp-canvas .demo-brand{fill:#f25a24;font-size:20px;font-weight:600}
.mcp-canvas .demo-security-title{font-size:16px;fill:#294351;font-weight:550}
.demo-track{fill:none;stroke:#b9c6cc}.demo-dotted{fill:none;stroke:#aebec6;stroke-width:1.4;stroke-dasharray:3 5}
.demo-green{fill:none;stroke:#349665;stroke-width:2.5;stroke-dasharray:100;stroke-dashoffset:100}
.demo-dest rect{fill:#eaf0f1;stroke:#bbc8ce}.demo-dest text{fill:#667985}
.opened{opacity:0;transform:scale(.85);transition:opacity .25s,transform .3s!important}.closed{opacity:1;transition:opacity .25s!important}
.orange-lock .closed{filter:sepia(1) saturate(5) hue-rotate(340deg)}
.demo-message{opacity:0;transform:translateX(0);transition:opacity .15s!important}.demo-message rect{fill:#fff;stroke:#c2cfd5}.demo-message text{font-size:13px;fill:#294554}
.demo-typing,.demo-screen-message{opacity:0}.demo-screen-message{transition:opacity .25s!important}
.sequential-demo.is-typing .demo-user-label{opacity:0}.sequential-demo.is-typing .demo-typing{opacity:1}
.sequential-demo.has-message .demo-message{opacity:1}
.sequential-demo.send-message .demo-message{transform:translateX(228px);transition:transform .8s ease-in-out,opacity .15s!important}
.sequential-demo.message-arrived .demo-message{opacity:0;transform:translateX(250px);transition:transform .2s,opacity .2s!important}
.sequential-demo.screen-filled .demo-screen-message{opacity:1}
.sequential-demo.tool-approved .approved-lock .closed,.sequential-demo.source-open .source-lock .closed,.sequential-demo.route-open .route-lock .closed{opacity:0}
.sequential-demo.tool-approved .approved-lock .opened,.sequential-demo.source-open .source-lock .opened,.sequential-demo.route-open .route-lock .opened{opacity:1;transform:scale(1)}
.sequential-demo.route-start .first-route{stroke-dashoffset:0;transition:stroke-dashoffset 1.6s linear!important}
.sequential-demo.route-finish .last-route{stroke-dashoffset:0;transition:stroke-dashoffset .7s linear!important}
.sequential-demo.orders-reached .orders-dest rect{fill:#d9f1e3;stroke:#30956b;transition:fill .3s,stroke .3s!important}
.sequential-demo.orders-reached .orders-dest text{fill:#246e50}
.sequential-demo.is-resetting *{transition:none!important}
@media(max-width:600px){.lp-root .mcp-story h3{font-size:16px}.mcp-stories{gap:18px}}


.demo-play-toggle{justify-self:end;border:1px solid #c4d0d5;background:transparent;border-radius:5px;color:#405967;font:inherit;font-size:13px;padding:6px 10px;cursor:pointer}.demo-play-toggle:focus-visible{outline:2px solid #f25a24;outline-offset:3px}