/* The second-screen, scripted build narrative. Local demo only. */
.build-story{position:relative;background:#101e19;color:#e8f0de;padding:88px 0 32px;overflow:hidden;isolation:isolate;scroll-margin-top:75px}
.story-ambient{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 70% 35%,#59744030,transparent 62%),linear-gradient(115deg,transparent 35%,#9cc56b08 50%,transparent 65%);pointer-events:none}
.story-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:35px}.story-heading .eyebrow{color:#b3cc8b;font-size:10px;letter-spacing:.16em}.story-heading h2{font-size:clamp(30px,3.4vw,47px);line-height:1.4;letter-spacing:-.045em;margin-top:18px}.story-heading h2 span{color:#d7f9a3}.story-heading>div:last-child{padding-bottom:7px;font-size:13px;line-height:1.9;color:#9daf9e}.story-heading a{display:inline-flex;gap:25px;color:#d9edbb;margin-top:16px;border-bottom:1px solid #5d7251;padding-bottom:5px;font-size:12px}
.story-console{border:1px solid #52604785;border-radius:13px;background:#17231c;overflow:hidden;box-shadow:0 26px 80px #0004}.story-console-bar{display:flex;justify-content:space-between;align-items:center;padding:16px 22px;gap:15px;border-bottom:1px solid #40503c7a}.story-console-bar>span:first-child{display:flex;align-items:center;gap:9px;font:600 15px Arial,sans-serif}.story-console-bar b{font:11px var(--font);font-weight:400;color:#9bad91;border-left:1px solid #586750;margin-left:8px;padding-left:16px}.story-demo-label{font-size:10px;color:#b3c5a3}.story-step-nav{display:grid;grid-template-columns:repeat(6,1fr);background:#1d2c23;border-bottom:1px solid #52604760}.story-step-nav button{position:relative;border:0;border-right:1px solid #52604740;background:none;padding:15px 10px;color:#81977f;text-align:left;font-size:11px;display:flex;align-items:center;gap:10px}.story-step-nav button>span{font:10px Arial,sans-serif;opacity:.6}.story-step-nav button.active{color:#dfffb1;background:#ddf9ab0a}.story-step-nav button.active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:#d3f99a;box-shadow:0 0 12px #c3f48a80}.story-step-nav button.done{color:#bad296}
.story-workspace{display:grid;grid-template-columns:350px minmax(0,1fr)}.story-chat{background:#17231c;padding:22px;display:flex;flex-direction:column;min-width:0;border-right:1px solid #52604770}.story-chat-title{display:flex;align-items:center;gap:10px;margin-bottom:16px}.story-ai-avatar{width:33px;height:33px;border-radius:10px;background:#d7f3af;color:#25351d;display:grid;place-items:center;font-size:25px}.story-chat-title strong{display:block;font-size:12px;font-weight:550}.story-chat-title>div>span{display:block;font-size:9px;color:#809776;margin-top:4px}.story-chat-title i{width:6px;height:6px;border-radius:50%;background:#bfe289;margin-left:auto;box-shadow:0 0 10px #bfe28980}.story-chat-log{height:314px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#465e3e transparent;padding:8px 2px 8px 0;display:flex;flex-direction:column;gap:14px}.story-msg{flex-shrink:0;animation:story-message .5s ease both}.story-msg>span{display:block;color:#718568;font-size:8px;margin-bottom:6px}.story-msg p{font-size:12px;line-height:1.9;padding:12px 13px;border-radius:8px;border:1px solid #405139;background:#243321;color:#b9ceb0}.story-msg.user{margin-left:28px}.story-msg.user>span{text-align:right}.story-msg.user p{background:#3d5131;border-color:#5a7147;color:#e2efcc}.story-msg.ai small{display:inline-flex;align-items:center;gap:5px;background:#ceee9e0d;border:1px solid #6c92514d;border-radius:4px;color:#bbd892;padding:5px 7px;font-size:8px;margin-top:9px}.story-input{display:flex;gap:12px;align-items:center;min-height:65px;padding:12px;border:1px solid #677c505e;background:#101c15;border-radius:7px;color:#a6bb94;margin-top:auto;font-size:11px;line-height:1.8}.story-input>span:first-child{flex:1}.story-input.is-typing>span:first-child:after{content:"";display:inline-block;width:1px;height:13px;background:#d8f7ad;vertical-align:middle;animation:story-caret .7s steps(1) infinite;margin-left:2px}.story-send{display:grid;place-items:center;background:#d3efab;color:#1f3019;border-radius:5px;width:26px;height:26px;font:18px Arial;flex-shrink:0}.story-chat-note{font-size:8px;color:#687f61;text-align:center;margin-top:11px}
.story-preview{min-width:0;display:flex;flex-direction:column;background:#dfe5d3}.story-preview-bar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 16px;background:#eef1e5;color:#7b8870;font:9px Arial,sans-serif;border-bottom:1px solid #d7dfca}.story-preview-bar>span:first-child{display:flex;align-items:center;gap:6px}.story-preview-bar i{width:5px;height:5px;background:#849d61;border-radius:50%}.story-preview-bar>div{display:flex;gap:4px;margin-left:auto}.story-preview-bar button{border:0;background:none;color:#8f9e80;border-radius:3px;padding:5px 8px;font-size:9px}.story-preview-bar button.active{background:#dce5cc;color:#465b35}#story-build-state{font:8px var(--font);min-width:65px;text-align:right}.story-preview-canvas{height:447px;overflow:auto;position:relative;overscroll-behavior:contain;display:flex;justify-content:center;background-image:radial-gradient(#97ad7c55 .7px,transparent .7px);background-size:14px 14px}.story-preview-canvas[data-device=mobile] #story-site{max-width:300px;box-shadow:0 0 60px #253b2440}#story-site{position:relative;width:100%;min-height:100%;max-width:100%;background:#f5f5ea;overflow:hidden;transition:max-width .5s cubic-bezier(.2,.8,.2,1)}.story-empty{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:24px;text-align:center;background:#f1f3e9}.story-empty>span{font:68px Georgia;color:#bbcba0;animation:story-star 18s linear infinite}.story-empty strong{font-size:20px;line-height:1.8;font-weight:450;color:#688252}.story-empty small{font:7px Arial;letter-spacing:.2em;color:#a8b19b}.story-wireframe{display:none;position:absolute;inset:28px;grid-template-columns:1fr 1fr;grid-template-rows:25px 190px 90px;gap:24px}.story-wireframe i{background:linear-gradient(100deg,#e4e8db 15%,#f7f9f0 45%,#e4e8db 75%);background-size:300% 100%;animation:story-skeleton 2s linear infinite;border-radius:3px}.story-wireframe i:first-child{grid-column:1/-1}.story-wireframe i:nth-child(2){width:85%}.story-wireframe i:nth-child(4){grid-column:1/-1}.story-made{display:none;color:#273223}.story-made nav{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:19px 22px;border-bottom:1px solid #dae0cb;font:6px Arial}.story-made nav b{font:700 17px Arial;letter-spacing:-.08em}.story-made nav b span{font-size:6px;vertical-align:super}.story-made nav>span:last-child{border-bottom:1px solid #94aa6c;padding-bottom:4px}.story-made-hero{display:grid;grid-template-columns:.95fr 1.2fr;min-height:233px;align-items:center;padding:26px 22px;gap:5px;background:#e9eddc}.story-mini-kicker{font:5px Arial;letter-spacing:.1em;color:#718459}.story-made-hero h3{font:400 clamp(24px,3.2vw,44px)/.97 Georgia,serif;letter-spacing:-.06em;margin:14px 0;color:#293c23}.story-made-hero h3 em{color:#849853;font-weight:400}.story-made-hero p{font:6px/1.7 Arial;max-width:160px;color:#889477}.story-made-hero a{display:inline-block;font:6px Arial;padding:7px 9px;background:#273c23;color:#ecf5d4;margin-top:13px}.story-product-stage{position:relative;isolation:isolate;display:grid;place-items:center;min-width:0}.story-product-stage img{width:120%;max-width:120%;position:relative;z-index:1;filter:drop-shadow(0 19px 10px #29382130)}.story-product-stage>span{position:absolute;right:0;bottom:-20px;font:6px Arial;color:#718359}.story-planet{position:absolute;border-radius:50%;width:80%;aspect-ratio:1;background:linear-gradient(125deg,#d4dfa7,#b7c49a);box-shadow:0 0 0 17px #dce4cb60,0 0 0 18px #c4d1ad50;z-index:-1}.story-made-products{display:none;padding:19px 22px;background:#f7f7ee}.story-made-products>div:first-child{display:flex;justify-content:space-between;align-items:center;gap:10px;font:6px Arial;color:#7b8a65;margin-bottom:13px}.story-made-products button{border:0;background:none;padding:4px 7px;font:6px Arial;color:#7b8a65;border-radius:3px}.story-made-products button.active{background:#2c4225;color:#edf6d8}#story-mini-products{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}#story-mini-products>div{border:1px solid #e0e6d3;padding:9px;border-radius:3px;background:#edf0e3}#story-mini-products img{width:100%;height:48px;object-fit:contain}#story-mini-products span{display:flex;justify-content:space-between;font:6px Arial;margin-top:8px}#story-mini-products small{font-size:5px;color:#94a178}.story-made-contact{display:none;justify-content:space-between;align-items:center;background:#263b22;color:#d1e5ae;padding:16px 22px;font:10px Georgia}.story-made-contact a{font:6px Arial;color:#d1e5ae}
#story-site[data-phase="1"] .story-empty{display:none}#story-site[data-phase="1"] .story-wireframe{display:grid}#story-site:is([data-phase="2"],[data-phase="3"],[data-phase="4"],[data-phase="5"],[data-phase="6"]) .story-empty{display:none}#story-site:is([data-phase="2"],[data-phase="3"],[data-phase="4"],[data-phase="5"],[data-phase="6"]) .story-made{display:block;animation:story-message .65s ease both}#story-site:is([data-phase="3"],[data-phase="4"],[data-phase="5"],[data-phase="6"]) .story-made-products{display:block}#story-site:not([data-phase="4"]):not([data-phase="5"]):not([data-phase="6"]) .story-made-products>div:first-child>div{visibility:hidden}#story-site:is([data-phase="5"],[data-phase="6"]) .story-made-contact{display:flex}.story-build-flash{pointer-events:none;position:absolute;inset:0;border:2px solid #c3fa85;opacity:0}.story-preview-canvas.updated .story-build-flash{animation:story-flash .8s ease-out}.story-output{display:flex;align-items:center;gap:7px;padding:13px 16px;color:#647a4d;background:#edf2e3;font-size:9px;line-height:1.6;margin-top:auto;min-height:40px}.story-output-dot{width:5px;height:5px;background:#8eab65;border-radius:50%;flex-shrink:0}#story-step-count{margin-left:auto;white-space:nowrap;font:8px Arial;color:#8c9c79}
.story-controls{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:16px 21px;border-top:1px solid #64774d40}.story-controls>div:first-child{display:flex;gap:8px;flex-shrink:0}.story-controls button{border:1px solid #728b5550;background:none;color:#9eb982;font-size:10px;padding:9px 12px;border-radius:4px;min-height:35px}#story-play{background:#d9f9a8;color:#283b1c;border-color:#d9f9a8;min-width:94px}.story-controls>a{font-size:10px;white-space:nowrap;color:#d8f1b6}.story-timeline{height:2px;background:#435536;flex:1;max-width:350px;overflow:hidden}.story-timeline>span{display:block;width:0;height:100%;background:#ceef9c;box-shadow:0 0 10px #c8f691;transition:width .2s}.story-takeaway{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:26px;font-size:11px;color:#9fb68b}.story-takeaway i{font:9px Arial;color:#769260;border:1px solid #647f4d66;padding:6px;border-radius:50%;margin-right:9px}.story-takeaway .button{font-size:12px}.story-footnote{font-size:9px;color:#718366;line-height:1.9;margin-top:20px;text-align:center}.build-story button:focus-visible,.build-story a:focus-visible{outline:2px solid #d8f4a8;outline-offset:4px}
[data-device=mobile] .story-made-hero{grid-template-columns:1fr;padding:23px 22px 30px}[data-device=mobile] .story-made-hero h3{font-size:35px}[data-device=mobile] .story-product-stage{margin-top:23px;min-height:120px}[data-device=mobile] .story-product-stage img{width:90%;max-width:90%}[data-device=mobile] .story-planet{width:50%}[data-device=mobile] .story-made nav>span:nth-child(2){display:none}[data-device=mobile] #story-mini-products{grid-template-columns:1fr}[data-device=mobile] #story-mini-products img{height:70px}
#story-mini-products>a{border:1px solid #e0e6d3;padding:9px;border-radius:3px;background:#edf0e3;display:block;transition:background .2s,transform .2s}#story-mini-products>a:hover{background:#d6e7b4;transform:translateY(-3px)}
@keyframes story-message{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes story-flash{0%{opacity:0}30%{opacity:.9}100%{opacity:0}}@keyframes story-caret{50%{opacity:0}}@keyframes story-skeleton{to{background-position:-300% 0}}@keyframes story-star{to{transform:rotate(360deg)}}
@media(max-width:1100px){.story-workspace{grid-template-columns:300px minmax(0,1fr)}.story-chat{padding:17px}.story-heading{gap:20px}.story-step-nav button{gap:5px;font-size:10px}.story-takeaway{gap:10px;font-size:10px}.story-takeaway i{margin-right:5px}.story-takeaway .button{font-size:10px}.story-made nav>span:nth-child(2){display:none}}
@media(max-width:800px){.build-story{padding-top:62px}.story-heading{display:block}.story-heading h2{font-size:34px}.story-heading>div:last-child{margin-top:21px;font-size:12px}.story-workspace{grid-template-columns:1fr}.story-chat{border-right:0;border-bottom:1px solid #52604770}.story-chat-log{height:180px}.story-chat-title{margin-bottom:10px}.story-input{margin-top:12px;min-height:48px}.story-chat-note{display:none}.story-preview-canvas{height:430px}.story-step-nav button{display:block;text-align:center;font-size:10px;padding:12px 4px}.story-step-nav button>span{display:block;margin-bottom:6px;font-size:8px}.story-takeaway{flex-wrap:wrap;justify-content:center;gap:20px}.story-controls{gap:12px;flex-wrap:wrap;padding:14px}.story-timeline{order:3;max-width:none;flex-basis:100%}.story-made-hero h3{font-size:44px}.story-made-hero{min-height:245px}.story-made nav>span:nth-child(2){display:block}.story-mini-kicker{font-size:6px}.story-made-hero p,.story-made-hero a{font-size:7px}.story-console-bar{padding:13px 15px}.story-demo-label{font-size:8px}.story-console-bar b{font-size:9px;margin-left:3px;padding-left:10px}}
@media(max-width:480px){.build-story .container{width:calc(100% - 28px)}.story-heading h2{font-size:29px}.story-heading .eyebrow{font-size:8px;letter-spacing:.08em}.story-step-nav button{font-size:9px}.story-controls button{font-size:9px;padding:8px}.story-controls>a{font-size:9px}.story-controls>div:first-child{gap:4px}#story-play{min-width:80px}.story-takeaway{gap:15px 9px;font-size:9px}.story-takeaway i{font-size:7px;padding:4px}.story-takeaway .button{flex-basis:100%;justify-content:center;max-width:240px}.story-preview-bar{padding:10px;font-size:8px;gap:6px}.story-preview-bar button{padding:4px 6px;font-size:8px}#story-build-state{min-width:54px;font-size:7px}.story-made-hero{min-height:230px;padding:25px 15px;grid-template-columns:.9fr 1fr}.story-made-hero h3{font-size:30px}.story-made-hero p{font-size:6px}.story-mini-kicker{font-size:5px}.story-made nav{padding:15px}.story-made nav>span:nth-child(2){display:none}.story-made-products{padding:18px 15px}.story-footnote{text-align:left;font-size:8px}.story-preview-canvas{height:425px}.story-made-contact{padding-inline:15px}}
.story-controls button:disabled{opacity:.4;cursor:default}
@media(prefers-reduced-motion:reduce){.build-story *{animation:none!important;transition:none!important}.story-input.is-typing>span:first-child:after{display:none}}