.xid-section{--xid-blue:#2137ff;--xid-ink:#071033;--xid-muted:#60708d;--xid-line:#dce4f2;background:#f6f8fc;padding:5rem 1.5rem;color:var(--xid-ink)}.xid-section [hidden]{display:none!important}
.xid-section--standalone{display:grid;min-height:100vh;place-items:center;padding:0;background:#eef2ff}
.xid-heading{max-width:780px;margin:0 auto 2.5rem;text-align:center}.xid-heading>span{font-size:.75rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#4f46e5}.xid-heading h2{margin:.9rem 0 0;font-size:clamp(2rem,4vw,3.5rem);line-height:1.02;letter-spacing:-.045em}.xid-heading p{margin:1rem auto 0;max-width:660px;color:#64748b;line-height:1.7}
.xid-story{width:min(1280px,100%);margin:0 auto}.xid-story-row{display:grid;grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);align-items:center;gap:clamp(2rem,5vw,5.5rem);min-height:720px;padding:4rem 0;border-top:1px solid #e2e8f0}.xid-story-row:first-child{border-top:0}.xid-story-row--reverse{grid-template-columns:minmax(0,1.22fr) minmax(300px,.78fr)}.xid-story-row--reverse .xid-story-copy{order:2}.xid-story-row--reverse .xid-shell{order:1}.xid-story-copy{position:relative}.xid-story-number{display:block;color:#d9e1ee;font-size:clamp(4.5rem,9vw,8rem);font-weight:850;line-height:.8;letter-spacing:-.08em}.xid-story-tag{margin:1.5rem 0 0;color:#4f46e5;font-size:.72rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.xid-story-copy h3{margin:.7rem 0 0;font-size:clamp(2rem,3.6vw,3.7rem);line-height:1.02;letter-spacing:-.05em}.xid-story-text{margin:1.25rem 0 0;color:#58677f;font-size:1rem;line-height:1.75}.xid-story-copy ul{display:grid;gap:.7rem;margin:1.5rem 0 0;padding:0;list-style:none}.xid-story-copy li{display:flex;gap:.7rem;color:#334155;font-size:.88rem;line-height:1.45}.xid-story-copy li span{display:grid;width:1.3rem;height:1.3rem;flex:0 0 auto;place-items:center;border-radius:50%;background:#e0e7ff;color:#4338ca;font-size:.7rem;font-weight:900}.xid-story-row .xid-shell{width:100%;margin:0}.xid-story-row .xid-stage{min-height:510px;padding:2rem clamp(1rem,3vw,2.25rem) 1.5rem}.xid-story-row .xid-searchbox{grid-template-columns:1fr}.xid-story-row .xid-searchbox button{width:100%}.xid-story-row .xid-items{grid-template-columns:1fr 1fr}.xid-story-row .xid-result{margin-top:.9rem}.xid-story-row .xid-result-head p{font-size:.78rem}.xid-story-row .xid-controls>span{color:#8190a6;font-size:.68rem;font-weight:750;text-transform:uppercase;letter-spacing:.08em}
.xid-shell{position:relative;width:min(1120px,100%);margin:auto;overflow:hidden;border:1px solid #dbe4f1;border-radius:2rem;background:#fff;box-shadow:0 30px 90px rgba(30,41,59,.12)}
.xid-shell--recording{width:min(100vw,1200px);min-height:min(100vh,675px);border:0;border-radius:0;box-shadow:none}
.xid-section--horizontal .xid-shell--recording{width:min(100vw,1200px);min-height:min(100vh,675px);aspect-ratio:16/9}
.xid-section--vertical .xid-shell--recording,.xid-section--square .xid-shell--recording{display:flex;min-height:100vh;flex-direction:column}
.xid-section--vertical .xid-stage,.xid-section--square .xid-stage{display:flex;min-height:0;flex:1;flex-direction:column;justify-content:center}
.xid-section--vertical .xid-shell--recording{width:min(100vw,1080px)}
.xid-section--square .xid-shell--recording{width:min(100vw,1080px);min-height:min(100vh,1080px);aspect-ratio:1/1}
.xid-section--clean .xid-controls{display:none}
.xid-topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.35rem;border-bottom:1px solid #e7edf6;background:rgba(255,255,255,.96)}
.xid-brand{display:flex;align-items:center;gap:.65rem;color:#1726d3}.xid-brand img{display:block;width:auto;height:1.55rem}.xid-brand-divider{width:1px;height:1.25rem;background:#cbd5e1}.xid-brand small{font-weight:700;color:#3449e7}.xid-demo-badge{border:1px solid #d9e0ef;border-radius:999px;padding:.4rem .75rem;font-size:.68rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase;color:#64748b}
.xid-stage{position:relative;min-height:545px;padding:2.5rem clamp(1rem,5vw,4.5rem) 2rem;background:radial-gradient(circle at 50% 10%,rgba(79,70,229,.09),transparent 32%),linear-gradient(180deg,#fff,#f9fbff)}
.xid-intro{text-align:center}.xid-spark{display:inline-grid;width:3rem;height:3rem;place-items:center;border:1px solid #c7d2fe;border-radius:1rem;background:#eef2ff;color:#4f46e5;box-shadow:0 12px 28px rgba(79,70,229,.18)}.xid-spark svg{width:1.35rem}.xid-kicker{margin:1rem 0 .2rem;font-size:clamp(1.3rem,2.7vw,2rem);font-weight:750;letter-spacing:-.03em}.xid-intro h3{margin:0;color:#667085;font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em}
.xid-searchbox{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:.75rem;width:min(850px,100%);margin:1.6rem auto 0;padding:.65rem;border:1px solid #cfd9ea;border-radius:1.45rem;background:#fff;box-shadow:0 18px 55px rgba(30,41,59,.11)}.xid-searchbox textarea{min-height:86px;max-height:132px;resize:none;border:0;padding:.8rem 1rem;background:transparent;color:#0f172a;font:600 clamp(.92rem,1.8vw,1.12rem)/1.55 system-ui,sans-serif;outline:0}.xid-searchbox button,.xid-mail button{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border:0;border-radius:.9rem;background:#4f46e5;padding:.8rem 1rem;color:#fff;font-weight:750;white-space:nowrap}.xid-searchbox button svg,.xid-mail button svg{width:1rem}.xid-cursor{position:absolute;right:6rem;bottom:-1rem;z-index:5;color:#071033;filter:drop-shadow(0 2px 2px rgba(255,255,255,1));opacity:0}.xid-cursor svg{width:1.75rem;height:1.75rem;fill:#fff}
.xid-mail{width:min(720px,100%);margin:1.2rem auto 0;overflow:hidden;border:1px solid #dbe4f1;border-radius:1.25rem;background:#fff;box-shadow:0 18px 50px rgba(30,41,59,.1)}.xid-mailbar{display:flex;align-items:center;gap:.4rem;padding:.7rem 1rem;background:#f1f5f9}.xid-mailbar span{width:.6rem;height:.6rem;border-radius:999px;background:#cbd5e1}.xid-mailbar strong{margin-left:.45rem;font-size:.72rem;color:#64748b}.xid-mail pre{margin:0;padding:1rem 1.25rem;white-space:pre-wrap;color:#334155;font:500 .82rem/1.45 system-ui,sans-serif}.xid-mail button{float:right;margin:0 1rem 1rem;padding:.6rem .85rem;font-size:.75rem}
.xid-loading{display:flex;align-items:center;justify-content:center;gap:1rem;width:min(650px,100%);margin:2.5rem auto 0;padding:1.25rem;border:1px solid #ddd6fe;border-radius:1.25rem;background:#f5f3ff;color:#312e81}.xid-loading div{display:grid;gap:.2rem}.xid-loading small{color:#6d66a5}.xid-loader{width:2rem;height:2rem;border:3px solid #c4b5fd;border-top-color:#4f46e5;border-radius:50%;animation:xidSpin .8s linear infinite}
.xid-result{width:min(940px,100%);margin:1.5rem auto 0;animation:xidRise .45s ease both}.xid-result-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.xid-result-head>div>span{font-size:.68rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase;color:#16a34a}.xid-result-head h3{margin:.2rem 0 0;font-size:clamp(1.35rem,2.4vw,2rem);letter-spacing:-.035em}.xid-result-head p{max-width:700px;margin:.45rem 0 0;color:#64748b;font-size:.9rem;line-height:1.55}.xid-result-head>svg{width:2rem;height:2rem;color:#16a34a}.xid-chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1rem}.xid-chips span{border:1px solid #c7d2fe;border-radius:999px;background:#eef2ff;padding:.35rem .65rem;color:#3730a3;font-size:.68rem;font-weight:750}.xid-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-top:1rem}.xid-item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.75rem;align-items:start;border:1px solid #e2e8f0;border-radius:1rem;background:#fff;padding:.85rem;box-shadow:0 7px 20px rgba(30,41,59,.045)}.xid-item-icon{display:grid;width:2.1rem;height:2.1rem;place-items:center;border-radius:.7rem;background:#eef2ff;color:#4f46e5}.xid-item-icon svg{width:1.05rem}.xid-item strong{display:block;font-size:.78rem}.xid-item b{display:block;margin-top:.12rem;font-size:.88rem;color:#0f172a}.xid-item small{display:block;margin-top:.15rem;color:#64748b;font-size:.68rem;line-height:1.35}.xid-next{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.75rem;border-radius:.9rem;background:#071033;padding:.75rem 1rem;color:#fff}.xid-next span{color:#94a3b8;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.xid-next strong{font-size:.75rem;text-align:right}.xid-disclaimer{margin:.6rem 0 0;text-align:center;color:#8591a5;font-size:.6rem;line-height:1.4}
.xid-controls{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1.2rem;border-top:1px solid #e7edf6;background:#fff}.xid-scenes{display:flex;min-width:0;gap:.35rem;overflow-x:auto;padding-bottom:.1rem}.xid-scenes button,.xid-replay{border:1px solid transparent;border-radius:.75rem;background:transparent;padding:.55rem .75rem;color:#64748b;font-size:.7rem;font-weight:750;white-space:nowrap}.xid-scenes button[aria-selected="true"]{border-color:#c7d2fe;background:#eef2ff;color:#3730a3}.xid-replay{display:inline-flex;align-items:center;gap:.35rem;border-color:#dce4f2}.xid-replay svg{width:.9rem}
.xid-shell.is-typing .xid-cursor{animation:xidCursor 4.8s ease-in-out both}.xid-shell.is-clicking .xid-searchbox button{animation:xidButton .45s ease}.xid-shell.is-clicking .xid-cursor{right:1rem;bottom:.5rem;opacity:1;transition:right .45s ease,bottom .45s ease}.xid-shell.is-result .xid-intro,.xid-shell.is-result .xid-searchbox,.xid-shell.is-result .xid-mail{display:none}
@keyframes xidSpin{to{transform:rotate(360deg)}}@keyframes xidRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@keyframes xidButton{50%{transform:scale(.96);background:#312e81}}@keyframes xidCursor{0%{right:70%;bottom:2rem;opacity:0}15%{opacity:1}70%{right:6rem;bottom:-1rem;opacity:1}100%{right:6rem;bottom:-1rem;opacity:0}}
@media(max-width:980px){.xid-story-row,.xid-story-row--reverse{grid-template-columns:1fr;gap:2rem;min-height:0;padding:5rem 0}.xid-story-row--reverse .xid-story-copy,.xid-story-row--reverse .xid-shell{order:initial}.xid-story-copy{max-width:700px}.xid-story-number{font-size:5rem}.xid-story-copy h3{font-size:clamp(2rem,7vw,3.5rem)}}
@media(max-width:700px){.xid-section{padding:3.5rem .75rem}.xid-section--standalone{padding:0}.xid-stage,.xid-story-row .xid-stage{min-height:610px;padding:1.2rem .8rem}.xid-searchbox{grid-template-columns:1fr}.xid-searchbox button{width:100%}.xid-items,.xid-story-row .xid-items{grid-template-columns:1fr}.xid-controls{align-items:flex-end}.xid-replay span{display:none}.xid-next{align-items:flex-start;flex-direction:column}.xid-next strong{text-align:left}.xid-demo-badge{font-size:.58rem}.xid-mail pre{font-size:.72rem}.xid-result-head p{font-size:.78rem}.xid-story-row{padding:4rem 0}.xid-story-copy{padding:0 .4rem}}
@media(prefers-reduced-motion:reduce){.xid-loader,.xid-result,.xid-shell.is-typing .xid-cursor,.xid-shell.is-clicking .xid-searchbox button{animation:none}}