.handoff-replica .live-browser{width:min(100%, calc(56vh * var(--frame-ratio)));border:1px solid var(--line);background:var(--surface);border-radius:8px;flex-direction:column;display:flex;overflow:hidden}.handoff-replica .live-browser-address{border-bottom:1px solid var(--line);min-width:0;color:var(--secondary);align-items:center;gap:6px;padding:6px 10px;font-size:12px;display:flex}.handoff-replica .live-browser-page{aspect-ratio:var(--frame-ratio);background:var(--background);position:relative}.handoff-replica .live-browser-page img{object-fit:contain;width:100%;height:100%;display:block}.handoff-replica .live-browser[data-controlled=true]{border-color:var(--ring);box-shadow:0 0 0 1px var(--ring)}.handoff-replica .live-browser[data-controlled=true] .live-browser-page{cursor:pointer;outline:none}.handoff-replica .live-browser-handoff{border-bottom:1px solid var(--line);color:var(--ink);align-items:center;gap:8px;padding:8px 10px;font-size:13px;line-height:1.4;display:flex}.handoff-replica .browser-in-use{width:24px;height:24px;color:var(--ink);border-radius:999px;flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative}.handoff-replica .browser-in-use:before{border-radius:inherit;content:"";opacity:0;background:currentColor;animation:1.6s ease-out infinite handoff-browser-pulse;position:absolute;inset:0}@keyframes handoff-browser-pulse{0%{opacity:.25;transform:scale(.6)}to{opacity:0;transform:scale(1.5)}}@media (prefers-reduced-motion:reduce){.handoff-replica .browser-in-use:before{opacity:.12;animation:none;transform:none}}@media (max-width:1023px){.handoff-replica .preview-panel{height:auto;padding-bottom:18px}.handoff-replica .message-timeline{justify-content:start}}.handoff-replica .creation-studio{--studio-pink:350 100% 96%;--studio-pink-ink:352 72% 58%;--studio-blue:204 100% 95%;--studio-blue-ink:204 72% 46%;--studio-mode-gradient:linear-gradient(115deg, #f6d0dd 0%, #ede0f4 54%, #d9e9fc 100%);--studio-mode-border:#e7d9e5;--studio-mode-text:#67586d;--studio-mode-selected-text:#261c29;--studio-mode-surface:#fff;--studio-mode-pink:#b33b64;--studio-mode-blue:#316baf;--studio-mode-violet:#7a4cb0;--studio-composer-gradient:linear-gradient(115deg, #e9b5c8, #e1d3eb, #bbd5f3);--studio-source-shimmer:linear-gradient(90deg, transparent, #f3c3d5 35%, #cfe2fa 65%, transparent)}.handoff-replica .creation-studio .studio-start-tabs{background:var(--studio-mode-gradient);box-shadow:0 0 0 1px var(--studio-mode-border), 0 7px 20px #a3689820}.handoff-replica .creation-studio .studio-start-tab{--studio-mode-accent:var(--studio-mode-pink);color:var(--studio-mode-text);font-weight:550}.handoff-replica .creation-studio .studio-start-tab[data-outcome=enhance_recording]{--studio-mode-accent:var(--studio-mode-blue)}.handoff-replica .creation-studio .studio-start-tab[data-outcome=scene_video]{--studio-mode-accent:var(--studio-mode-violet)}.handoff-replica .creation-studio .studio-start-tab:hover{color:var(--studio-mode-selected-text)}.handoff-replica .creation-studio .studio-start-tab[data-state=active]{background:var(--studio-mode-surface);color:var(--studio-mode-selected-text);box-shadow:0 1px 2px #6639530d,0 4px 7px #66395314}.handoff-replica .studio-start-tab[data-state=active] svg{color:var(--studio-mode-accent)}.handoff-replica .studio-start-tab[data-state=active]:after{content:"";background:var(--studio-mode-accent);border-radius:4px;width:22px;height:4px;position:absolute;bottom:6px;left:calc(50% - 11px)}.handoff-replica .creation-studio .studio-start-tab:focus-visible{outline:2px solid var(--studio-mode-accent);outline-offset:2px}.handoff-replica .creation-studio .studio-composer{background:linear-gradient(var(--background), var(--background)) padding-box, var(--studio-composer-gradient) border-box;border-color:#0000;box-shadow:0 2px 3px #61224704,0 8px 26px #61224707}[data-feature-tour][data-continuous]{height:calc-size(auto, size * 1.25);flex-direction:column;display:flex}[data-feature-tour][data-continuous]>[data-tour-window],[data-feature-tour][data-continuous] [data-demo-step],.handoff-replica,.handoff-replica>div:last-child{flex:1 0 auto}[data-feature-tour][data-continuous]>[data-tour-window],[data-feature-tour][data-continuous] [data-demo-step],.handoff-replica>div:last-child{flex-direction:column;display:flex}.handoff-replica>div:last-child{flex-basis:0;min-width:0}.handoff-replica .creation-studio,.handoff-replica .studio-workspace{flex-grow:1}@supports not (height:calc-size(auto, size * 1.25)){.handoff-replica .studio-workspace,.handoff-replica .creation-studio{min-height:37.5rem}}#demo{scroll-margin-top:5rem}.handoff-replica{--frame-height:21rem}.handoff-demo-typing{transform-box:fill-box;animation:.7s steps(8,end) both handoff-demo-type}@keyframes handoff-demo-type{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@media (prefers-reduced-motion:reduce){.handoff-demo-typing{animation:none}}.handoff-chapters{scrollbar-width:thin;gap:.25rem;margin-bottom:.4rem;display:flex;overflow-x:auto}.handoff-chapters>button{white-space:nowrap;flex:1 0 auto}[data-feature-tour][data-continuous]{margin-top:1rem}.handoff-replica .live-browser-page,.handoff-film{container-type:inline-size}.example-screen{color:var(--ink);background:#fff;font-size:clamp(10px,2.2cqw,16px);position:absolute;inset:0;overflow:hidden}.example-screen svg{flex:none;width:1.15em;height:1.15em}.example-screen header,.example-settings aside b,.example-option{align-items:center;gap:.5em;display:flex}.example-screen header{border-bottom:1px solid var(--line);padding:.8em 1em;font-weight:600}.example-settings{grid-template-columns:27% 1fr;height:100%;display:grid}.example-settings>*{padding:1em}.example-settings aside{background:var(--color-site-surface)}.example-screen small,.handoff-film small{font:500 .65em var(--font-mono,monospace);letter-spacing:.1em;display:block}.example-settings aside span,.example-settings aside b{margin-top:.8em;display:block}.example-settings aside b{display:flex}.example-settings strong,.example-form strong{margin:.3em 0 .7em;font-size:1.6em;line-height:1.1;display:block}.example-option{border:1px solid var(--line);border-radius:.5em;padding:.8em}.example-option>span:last-child{margin-left:auto}.example-option p{color:var(--secondary);margin:.2em 0 0;font-size:.85em}.example-check{border:1px solid;border-radius:.3em;width:1.25em;height:1.25em}.example-login{place-items:center;display:grid}.example-form{gap:.2em;width:min(68%,21em);font-size:clamp(10px,2.1cqw,16px);display:grid}.example-form>svg{margin:0 auto}.example-form strong{text-align:center;margin:.2em 0 .4em}.example-field{border:1px solid var(--line);border-radius:.35em;height:1.8em;padding:.12em .55em}.example-field[data-demo-target]{outline:2px solid var(--ink)}.example-field span{display:inline-block}.example-submit{text-align:center;color:#fff;background:var(--ink);border-radius:.35em;margin-top:.2em;padding:.3em}.handoff-film{aspect-ratio:16/9;color:#fff;background:var(--color-site-inverse);border-radius:.75rem;width:100%;position:relative;overflow:hidden}.handoff-film header{justify-content:space-between;align-items:center;font-size:2.1cqw;display:flex;position:absolute;inset:7% 6% auto}.handoff-film header span:last-child{letter-spacing:.12em;font:500 1.6cqw monospace}.handoff-film-scene{grid-template-columns:1fr .86fr;align-items:center;gap:4%;animation:.45s ease-out both handoff-film-enter;display:grid;position:absolute;inset:24% 6% 12%}.handoff-film-copy small{color:var(--color-site-amber);margin-bottom:1em;font-size:1.8cqw}.handoff-film-copy strong{letter-spacing:-.055em;font-size:6.5cqw;font-weight:500;line-height:.99;display:block}.handoff-film-card{background:var(--color-site-accent-soft);min-height:23cqw;color:var(--color-site-ink);border-radius:2cqw;align-content:center;gap:.55em;padding:12%;font-size:2.65cqw;display:grid;transform:rotate(-3deg)}.handoff-film-card>svg{width:1.45em;height:1.45em}.handoff-film-card>span{font-size:.85em}.handoff-film-switch{background:var(--color-site-ink);border-radius:2em;width:3.2em;padding:.18em;display:block}.handoff-film-switch i{background:#fff;border-radius:100%;width:1.2em;height:1.2em;animation:.55s ease-out .35s both handoff-film-switch;display:block}.handoff-film-playhead{background:linear-gradient(90deg,var(--color-site-pink),var(--color-site-amber));transform-origin:0;height:3px;animation:6s linear both handoff-film-play;position:absolute;inset:auto 0 0}@keyframes handoff-film-enter{0%{opacity:0;transform:translateY(6%)}}@keyframes handoff-film-switch{to{transform:translate(125%)}}@keyframes handoff-film-play{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@media (prefers-reduced-motion:reduce){.handoff-film-scene,.handoff-film-playhead{animation:none}.handoff-film-switch i{animation:none;transform:translate(125%)}}.docs-handoff-demo{margin-bottom:2rem;container-type:inline-size}@container (max-width:48rem){.docs-handoff-demo .studio-workspace{flex-direction:column;height:auto;display:flex}.docs-handoff-demo .chat-panel{border-right:0;border-top:1px solid var(--line);order:2}.docs-handoff-demo .preview-panel{height:auto;padding-bottom:1rem}.docs-handoff-demo .handoff-replica>.shrink-0{display:none}}
