/* Small product stories, using the actual molecular viewer and canvas cards. */
.door-intro{display:block;text-decoration:none;color:inherit}
.door-intro:focus-visible,.door-cta:focus-visible{outline:2px solid currentColor;outline-offset:6px}
a.door-cta{color:inherit;text-decoration:none}
.portal-demo{position:relative;min-height:456px;margin:0 0 26px;color:var(--ink)}
.product-door--flow .portal-demo{color:var(--lilac)}
.portal-demo-stage{position:relative;height:360px;overflow:hidden;border:1px solid #302c3326;background:#fff;color:#302c33;box-shadow:0 8px 24px #180f2010}
.portal-demo-heading{height:48px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 17px;border-bottom:1px solid #302c3314;font:500 13px/1.4 Manrope,Arial,sans-serif}
.portal-demo-heading small{font-size:12px;color:#817487;font-weight:400}
.portal-demo-heading strong{font-weight:600}
.portal-file-icon{display:inline-block;border:1px solid #ddd5e0;border-radius:4px;padding:2px 4px;margin-right:7px;color:#796c81;font-size:11px}
.portal-model{position:absolute;top:49px;left:0;right:0;bottom:96px;overflow:hidden;background:#faf9f7}
.portal-model iframe,.portal-model-fallback{display:block;width:100%;height:100%;border:0;position:absolute;inset:0}
.portal-model iframe{opacity:0;pointer-events:none}
.portal-demo[data-ready] .portal-model iframe{opacity:1}
.portal-demo[data-ready] .portal-model-fallback{visibility:hidden}
.portal-chain-key{position:absolute;left:14px;top:11px;display:flex;gap:9px;z-index:1;font-size:11px;color:#807585;pointer-events:none}
.portal-chain-key span::before{content:'';display:inline-block;width:6px;height:6px;margin-right:4px;border-radius:50%;background:var(--chain)}
.portal-lab-cursor{position:absolute;z-index:2;left:48%;top:43%;pointer-events:none;opacity:0}
.portal-demo[data-ready][data-playing] .portal-lab-cursor{opacity:1}
.portal-lab-cursor svg{width:22px;height:28px;filter:drop-shadow(0 1px 2px #291a2c30)}
.portal-lab-cursor span{display:block;margin:-1px 0 0 14px;background:#77568b;color:white;padding:3px 8px;border-radius:4px;font-size:11px;white-space:nowrap}
.portal-lab-cursor.is-down::before{content:'';position:absolute;top:-9px;left:-9px;width:25px;height:25px;border:1px solid #886aa0;border-radius:50%;background:#886aa026}
.portal-conversation{position:absolute;bottom:0;left:0;right:0;height:96px;border-top:1px solid #302c3314;padding:12px 16px;background:#fff}
.portal-scene[hidden]{display:none!important}
.portal-message{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.55}
.portal-avatar{width:26px;height:26px;display:grid;place-items:center;flex-shrink:0;border-radius:6px;background:#f2edf5;color:#795c8e;font-size:10px;font-weight:600}
.portal-message strong{font-size:12px;font-weight:600}
.portal-message p{margin-top:3px;line-height:1.5}
.portal-message small{margin-left:7px;font-size:11px;color:#938898}
.portal-note-label{display:flex;justify-content:space-between;color:#897892;font-size:11px;margin-bottom:6px}
.portal-note-field{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:38px;padding:6px 9px;border:1px solid #cfc3d8;border-radius:6px;font-size:13px;line-height:1.4}
.portal-note-send{flex:none;display:grid;place-items:center;width:25px;height:25px;background:#795a8e;border-radius:4px;color:#fff;font-size:17px}
.portal-demo[data-playing][data-step="1"] .portal-typed::after{content:'|';color:#795a8e;animation:portal-caret 900ms step-end infinite}
@keyframes portal-caret{50%{opacity:0}}
.portal-thread-reply{font-size:13px;line-height:1.5;margin-top:7px;padding-left:36px;color:#5f5367}
.portal-thread-reply strong{font-size:12px;color:#302c33;margin-right:6px}
.portal-flow-viewport{position:absolute;top:48px;left:0;right:0;bottom:46px;overflow:hidden;background:#fafafa}
.portal-flow-viewport iframe{position:absolute;inset:0;width:100%;height:100%;border:0;opacity:0;pointer-events:none}
.portal-flow-fallback{width:100%;height:100%;display:block}
.portal-demo[data-ready] .portal-flow-viewport iframe{opacity:1}
.portal-demo[data-ready] .portal-flow-fallback{visibility:hidden}
.portal-flow-caption{position:absolute;bottom:0;height:46px;left:0;right:0;display:flex;align-items:center;padding:0 16px;border-top:1px solid #302c3314;font-size:13px;background:#fff}
.portal-steps{display:flex;gap:12px;margin-top:15px}
.portal-steps button{flex:1;position:relative;min-width:0;min-height:42px;padding:12px 0 4px;border:0;background:transparent;color:inherit;text-align:left;font:500 12px/1.4 Manrope,Arial,sans-serif;cursor:pointer;opacity:.58}
.portal-steps button::before,.portal-steps button::after{content:'';position:absolute;top:0;left:0;height:2px;width:100%;background:currentColor;opacity:.25}
.portal-steps button::after{opacity:1;transform:scaleX(var(--progress,0));transform-origin:left}
.portal-steps button[aria-current="step"]{opacity:1}
.portal-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:36px;margin-top:3px;font-size:11px;line-height:1.5}
.portal-controls>span{opacity:.7}
.portal-toggle{display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;color:inherit;padding:6px 0 6px 8px;min-height:36px;font:500 12px/1.4 Manrope,Arial,sans-serif;cursor:pointer}
.portal-toggle svg{width:14px;height:14px;fill:currentColor}
.portal-toggle .portal-play{display:none}
.portal-demo:not([data-playing]) .portal-toggle .portal-play{display:block}
.portal-demo:not([data-playing]) .portal-toggle .portal-pause{display:none}
.portal-demo button:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.portal-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[data-demo-controls][hidden],.portal-steps[hidden],.portal-toggle[hidden]{display:none}
@media(max-width:1100px){.portal-demo{min-height:436px}.portal-demo-stage{height:340px}.portal-demo-heading{padding-inline:12px}.portal-steps{gap:9px}.portal-steps button{font-size:11px}.portal-conversation{padding-inline:12px}}
@media(max-width:760px){.portal-steps button{font-size:12px}.portal-demo{margin-bottom:22px}}
@media(max-width:370px){.portal-demo-heading{font-size:12px}.portal-demo-heading small{font-size:10px}.portal-message,.portal-thread-reply,.portal-note-field,.portal-flow-caption{font-size:12px}.portal-note-field{padding-inline:6px}.portal-steps{gap:8px}.portal-steps button{font-size:11px}}
@media(prefers-reduced-motion:reduce){.portal-typed::after{animation:none!important;display:none}}

.portal-thread-panel{position:absolute;inset:0;overflow:hidden;will-change:opacity}
.portal-research-frame{display:block;position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none}
.portal-module-fallback{height:100%;padding:32px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:14px;font-size:13px;line-height:1.6;background:#faf9f7}
.portal-module-fallback[hidden],.portal-research-frame[hidden]{display:none}
.portal-demo[data-portal-demo="lab"] .portal-demo-heading small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}
