.demo-heading h2 span{color:#aaa}.demo-play{flex-direction:row-reverse}.demo-play-icon{font-style:normal;display:inline-flex}.demo-play .is-pause,.demo-play[aria-pressed=true] .is-play{display:none}.demo-play[aria-pressed=true] .is-pause{display:inline-flex}.demo-window-bar{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);display:grid;position:relative}.demo-window-mark{justify-self:end}.demo-window-status{min-width:0;font-size:var(--font-caption);color:#d2d2d2;letter-spacing:.01em;font-variant-numeric:tabular-nums;align-items:center;gap:9px;display:flex}.demo-status-light{background:#ddd;border-radius:50%;flex:none;width:6px;height:6px;box-shadow:0 0 0 3px #ffffff14}.product-demo[data-motion=playing] .demo-status-light{animation:1.8s ease-in-out infinite demo-status-breathe}.demo-window-progress{background:#ffffff0b;height:2px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.demo-window-progress>span{transform-origin:0;background:linear-gradient(90deg,#858585,#f5f5f5 65%,#aaa);width:100%;height:100%;display:block;transform:scaleX(1);box-shadow:0 0 12px #ffffff5c}.user-message{position:relative}.demo-typing-caret{vertical-align:-.15em;background:#fff;width:2px;height:1em;margin-left:2px;display:none}.product-demo[data-motion=playing][data-phase=typing] .demo-typing-caret{animation:.7s step-end infinite demo-caret-blink;display:inline-block}.demo-message-sent{color:#777;letter-spacing:-.15em;font-size:10px;display:block;position:absolute;bottom:5px;right:12px}.product-demo[data-motion=playing][data-phase=typing] .demo-message-sent{opacity:0}.assistant-message{transition:opacity .4s,transform .4s cubic-bezier(.22,1,.36,1),visibility .4s}.demo-task-list{transition:opacity .35s,transform .35s,visibility .35s}.product-demo[data-motion=playing][data-phase=typing] .assistant-message,.product-demo[data-motion=playing][data-phase=typing] .demo-task-list{opacity:0;visibility:hidden;transform:translateY(9px)}.demo-task-list>div{min-height:19px}.demo-task-text{flex:1;min-width:0}.demo-task-list .is-active{color:#f4f4f4}.demo-task-list .is-active .task-indicator{background:#ffffff0c;border-color:#c5c5c5;box-shadow:0 0 0 3px #ffffff10}.demo-task-list .is-active .task-indicator svg{opacity:0}.demo-task-list .is-active .task-indicator:after{content:"";background:#fff;border-radius:50%;width:5px;height:5px;animation:1.35s ease-in-out infinite demo-status-breathe;box-shadow:0 0 8px #fff9}.demo-task-list .is-waiting{color:#777}.demo-task-meter{opacity:0;background:#393939;border-radius:4px;max-width:175px;height:2px;margin-top:6px;display:block;overflow:hidden}.demo-task-meter>span{transform-origin:0;background:#efefef;width:100%;height:100%;display:block;transform:scaleX(0);box-shadow:0 0 8px #fff9}.demo-task-percent{color:#ddd;font-variant-numeric:tabular-nums;font:11px ui-monospace,Consolas,monospace;display:none}.demo-task-list [data-task="2"].is-active .demo-task-meter{opacity:1}.demo-task-list [data-task="2"].is-active .demo-task-percent{display:block}.editor-status{align-items:center;gap:8px;display:inline-flex}.demo-editor-spinner{border:1.5px solid #555;border-top-color:#fff;border-radius:50%;width:10px;height:10px;animation:1.1s linear infinite demo-spin}.demo-execution .editor-body{grid-template-columns:94px minmax(0,1.2fr) minmax(190px,.82fr);min-height:0}.demo-execution .editor-code{flex-direction:column;padding:19px 16px;display:flex;position:relative;overflow:hidden}.demo-execution .editor-code pre{max-height:302px;position:relative;overflow:hidden}.demo-code-caret{vertical-align:-2px;background:#ddd;width:7px;height:13px;animation:.64s step-end infinite demo-caret-blink;display:none}.product-demo[data-motion=playing][data-stage="2"] .demo-code-caret{display:inline-block}.demo-build-preview{background:#171717;border-left:1px solid #2c2c2c;flex-direction:column;gap:12px;min-width:0;padding:13px 12px;display:flex}.demo-build-preview-top{letter-spacing:.04em;color:#b9b9b9;align-items:center;gap:6px;min-width:0;font-size:9px;display:flex}.demo-build-dot{background:#eee;border-radius:50%;width:5px;height:5px;animation:1.7s ease-in-out infinite demo-status-breathe}.demo-build-count{color:#888;text-transform:none;letter-spacing:0;white-space:nowrap;margin-left:auto}.demo-build-canvas{color:#191919;background:#efefef;border:1px solid #555;border-radius:5px;flex:1;min-height:215px;padding:15px 12px;position:relative;overflow:hidden}.demo-build-nav{border-bottom:1px solid #21212126;align-items:center;gap:8px;padding-bottom:12px;display:flex}.demo-build-nav b{letter-spacing:-.075em;margin-right:auto;font-size:18px;font-weight:650}.demo-build-nav b span{vertical-align:top;letter-spacing:0;font-size:8px}.demo-build-nav i{background:#9e9e9e;border-radius:2px;width:18px;height:3px}.demo-build-nav i:last-child{width:12px}.demo-build-skeleton{flex-direction:column;gap:10px;transition:opacity .5s,transform .6s;display:flex;position:absolute;inset:58px 12px 12px}.demo-build-skeleton>i{background:#c1c1c1;border-radius:2px;width:80%;height:7px}.demo-build-skeleton>i:nth-child(2){background:#9a9a9a;width:92%;height:14px}.demo-build-skeleton>i:nth-child(3){width:51%;height:7px}.demo-build-placeholder{background:linear-gradient(115deg,#d4d4d4,#e1e1e1,#ccc) 0 0/230% 100%;border:1px solid #bbb;border-radius:3px;width:84%;height:66px;animation:2s infinite demo-shimmer}.demo-build-skeleton>i:nth-last-child(2){width:67%}.demo-build-skeleton>i:last-child{width:41%}.demo-build-content{opacity:0;flex-direction:column;align-items:flex-start;padding-top:24px;transition:opacity .5s,transform .65s cubic-bezier(.22,1,.36,1);display:flex;position:relative;transform:translateY(13px)}.demo-build-content small{letter-spacing:.075em;font-size:8px}.demo-build-content strong{letter-spacing:-.055em;margin-top:12px;font-size:clamp(15px,1.5vw,23px);font-weight:600;line-height:1.05}.demo-build-content>span:not(.demo-build-cta){color:#666;margin-top:13px;font-size:9px}.demo-build-cta{border-bottom:1px solid #222;margin-top:15px;padding-bottom:4px;font-size:9px;font-weight:600}.product-demo[data-build=styling] .demo-build-skeleton,.product-demo[data-build=preview] .demo-build-skeleton{opacity:0;transform:translateY(-8px)}.product-demo[data-build=styling] .demo-build-content,.product-demo[data-build=preview] .demo-build-content{opacity:1;transform:translateY(0)}.demo-build-pointer{color:#111;text-shadow:0 1px 1px #fff;opacity:0;font-size:23px;font-weight:700;position:absolute;bottom:18px;right:14px}.product-demo[data-build=preview][data-motion=playing] .demo-build-pointer{opacity:1;animation:2.5s ease-in-out both demo-pointer-arrive}.demo-footer-percent{color:#dedede;white-space:nowrap;font-variant-numeric:tabular-nums;margin-left:auto;font:11px ui-monospace,Consolas,monospace}.product-demo[data-motion=playing][data-stage="3"] .result-page{animation:1s cubic-bezier(.2,.8,.2,1) both demo-result-reveal}.product-demo[data-motion=playing][data-stage="3"] .result-copy{animation:1s .18s both demo-copy-reveal}.product-demo[data-motion=playing][data-stage="3"] .result-art{animation:1.3s .28s both demo-art-reveal}.product-demo[data-motion=playing][data-stage="3"] .result-receipt{animation:.6s .8s both demo-copy-reveal}@keyframes demo-status-breathe{50%{opacity:.35;box-shadow:0 0 0 5px #ffffff1c}}@keyframes demo-caret-blink{0%,49%{opacity:1}50%,to{opacity:0}}@keyframes demo-spin{to{transform:rotate(360deg)}}@keyframes demo-shimmer{to{background-position:-230% 0}}@keyframes demo-pointer-arrive{0%{opacity:0;transform:translate(-30px,24px)}30%{opacity:1}65%{transform:translate(0)}to{opacity:.9;transform:translate(4px,-4px)}}@keyframes demo-result-reveal{0%{opacity:.35;filter:blur(3px);transform:scale(.974)}to{opacity:1;filter:blur();transform:scale(1)}}@keyframes demo-copy-reveal{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes demo-art-reveal{0%{opacity:0;transform:translate(24px,12px)rotate(-10deg)scale(.88)}to{opacity:1;transform:translate(0)rotate(0)scale(1)}}@media (width<=1100px){.demo-execution .editor-body{grid-template-columns:94px minmax(0,1fr)}.demo-build-preview{display:none}}@media (width<=900px){.demo-execution .editor-body{grid-template-columns:80px minmax(0,1fr)}}@media (width<=600px){.demo-execution .editor-body{grid-template-columns:minmax(0,1fr)}.demo-window-bar{gap:8px}.demo-window-status{gap:6px;font-size:10px}.demo-status-light{width:5px;height:5px}.demo-task-percent,.demo-footer-percent{font-size:10px}.demo-editor-spinner{width:9px;height:9px}.demo-task-meter{max-width:130px}.demo-execution .editor-code pre{max-height:280px}}@media (prefers-reduced-motion:reduce){.demo-status-light,.demo-typing-caret,.demo-editor-spinner,.demo-task-list .is-active .task-indicator:after,.demo-build-dot,.demo-build-placeholder,.demo-code-caret,.demo-build-pointer,.result-page,.result-copy,.result-art,.result-receipt{transition:none!important;animation:none!important}.demo-play{display:none}}
