.how-player{width:min(100%,1040px)}.how-demo{position:relative;aspect-ratio:1040 / 620}.demo-stage{position:absolute;top:0;left:0;width:1040px;height:620px;overflow:hidden;transform-origin:0 0;border-radius:18px;background:var(--surface);box-shadow:0 0 0 1px var(--line),0 32px 80px -40px #1010104d;font-family:Manrope,sans-serif;font-size:14px;line-height:1.5;pointer-events:none;-webkit-user-select:none;user-select:none}.demo-lens{position:absolute;inset:0;transform-origin:0 0}.demo-stage[data-playing=false] *{animation-play-state:paused!important}.demo-bar{display:flex;align-items:center;gap:14px;height:49px;padding:0 18px;border-bottom:1px solid var(--line);background:var(--form)}.demo-project,.demo-bar-actions{opacity:0;transition:opacity .3s var(--ease-out)}.demo-stage[data-scene=editor] .demo-project,.demo-stage[data-scene=editor] .demo-bar-actions{opacity:1}.demo-project{color:var(--muted);font-weight:500}.demo-bar-actions{display:flex;gap:8px;margin-left:auto}.demo-pill{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 14px;border:1px solid var(--line);border-radius:28px;background:var(--form);font-size:13px;font-weight:500}.demo-body{position:absolute;inset:49px 0 0}.demo-layer{position:absolute;inset:0;opacity:0;transform:translateY(10px);transition:opacity .45s var(--ease-out),transform .45s var(--ease-out)}.demo-layer.is-active{opacity:1;transform:none}.demo-placeholder{position:absolute;color:var(--muted)}.demo-caret{display:inline-block;width:2px;height:1.15em;margin-left:1px;vertical-align:text-bottom;background:var(--accent);animation:demo-blink 1s steps(1) infinite}.demo-compose{display:flex;align-items:center;justify-content:center}.demo-form{display:flex;flex-direction:column;gap:12px;width:620px;padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--form);transition:border-color .2s ease}.demo-form.is-focused{border-color:var(--accent)}.demo-prompt{position:relative;min-height:150px;padding:14px 12px;font-size:20px;line-height:1.55}.demo-prompt .demo-placeholder{top:14px;left:12px}.demo-form-tools{display:flex;align-items:center;gap:4px}.demo-tool{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--muted)}.demo-submit{display:inline-flex;align-items:center;gap:10px;min-height:48px;margin-left:auto;padding:0 22px;border-radius:28px;background:var(--command);font-size:15px;font-weight:500;transition:transform .12s var(--ease-out),opacity .2s ease}.demo-submit.is-disabled,.demo-send.is-disabled{opacity:.42}.demo-submit.is-pressed,.demo-send.is-pressed{transform:scale(.96)}.demo-editor{display:grid;grid-template-columns:132px minmax(0,1fr) 272px;transform:none}.demo-rail,.demo-canvas,.demo-chat{opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}.demo-editor.is-active .demo-rail,.demo-editor.is-active .demo-canvas,.demo-editor.is-active .demo-chat{opacity:1;transform:none}.demo-editor.is-active .demo-canvas{transition-delay:60ms}.demo-editor.is-active .demo-chat{transition-delay:.12s}.demo-rail{display:flex;flex-direction:column;gap:12px;padding:14px;border-right:1px solid var(--line);background:var(--form)}.demo-canvas{position:relative;overflow:hidden;background:var(--surface)}.demo-stack{display:flex;flex-direction:column;align-items:center;gap:28px;min-height:1200px;padding:28px 0 92px;background-color:var(--surface);background-image:linear-gradient(#e8e6df 1px,transparent 1px),linear-gradient(90deg,#e8e6df 1px,transparent 1px);background-size:24px 24px;transition:transform .7s var(--ease-in-out)}.demo-card{position:relative;flex:none;width:540px;height:303.75px;overflow:hidden;border-radius:10px;outline:2px solid transparent;outline-offset:4px;background:#f2f0e9;box-shadow:0 1px 2px #1010100f,0 10px 30px #10101014;transition:outline-color .2s ease,opacity .3s var(--ease-out)}.demo-card.is-current{outline-color:var(--accent)}.demo-card.is-hidden{opacity:0}.demo-card .demo-deck{transform:scale(.421875)}.demo-toolbar{position:absolute;left:50%;bottom:14px;display:flex;align-items:center;gap:10px;height:40px;padding:0 14px 0 10px;border:1px solid var(--line);border-radius:999px;background:var(--form);box-shadow:0 8px 24px #1010101f;color:var(--muted);transform:translate(-50%)}.demo-nav{display:flex;align-items:center;gap:4px}.demo-position{width:48px;font-size:13px;font-variant-numeric:tabular-nums;text-align:center}.demo-chat{position:relative;display:flex;flex-direction:column;overflow:hidden;border-left:1px solid var(--line);background:var(--form)}.demo-messages{display:flex;flex:1;flex-direction:column;gap:16px;padding:16px 14px;line-height:1.6}.demo-message{animation:demo-rise .36s var(--ease-out) both}.demo-message.from-user{margin-left:16px;padding:10px 12px;border-radius:10px;background:#f2f0e9}.demo-composer{margin:0 10px 10px;border:1px solid var(--line);border-radius:10px;background:var(--form);transition:border-color .2s ease,box-shadow .2s ease}.demo-composer.is-focused{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.demo-composer-text{position:relative;min-height:76px;padding:12px}.demo-composer-text .demo-placeholder{top:12px;left:12px}.demo-composer-actions{display:flex;align-items:center;gap:2px;padding:0 8px 8px 4px}.demo-icon{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;color:var(--muted)}.demo-effort{display:inline-flex;align-items:center;gap:4px;height:30px;margin-left:auto;padding:0 8px 0 12px;border-radius:999px;background:#f2f0e9;font-size:13px;font-weight:500}.demo-effort svg{color:var(--muted)}.demo-send{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;margin-left:6px;border-radius:50%;background:var(--command);transition:transform .12s var(--ease-out),opacity .2s ease}.demo-thumb{position:relative;flex:0 0 auto;width:104px;height:59.375px;overflow:hidden;border:1px solid var(--line);border-radius:5px;background:#f2f0e9;outline:2px solid transparent;outline-offset:2px;transition:border-color .2s ease,outline-color .2s ease,opacity .3s var(--ease-out),transform .3s var(--ease-out)}.demo-thumb.is-current{border-color:var(--accent-strong);outline-color:var(--accent-strong)}.demo-thumb.is-hidden{opacity:0;transform:scale(.92)}.demo-thumb-slide{position:absolute;inset:0;opacity:0;transition:opacity .3s var(--ease-out)}.demo-thumb-slide.is-ready{opacity:1}.demo-thumb .demo-deck{transform:scale(.0796875)}.demo-thumb-number{position:absolute;bottom:3px;left:4px;min-width:16px;padding:0 4px;border-radius:3px;background:#ffffffeb;font-size:10px;line-height:15px;text-align:center}.demo-cursor{position:absolute;z-index:5;top:0;left:0;opacity:0;transition:transform .7s var(--ease-in-out),opacity .2s var(--ease-out)}.demo-cursor.is-visible{opacity:1}.demo-cursor>svg{display:block;margin:-2px 0 0 -3px;filter:drop-shadow(0 2px 3px rgb(16 16 16 / .25));transform-origin:3px 2px;transition:transform .12s var(--ease-out)}.demo-cursor.is-pressed>svg{transform:scale(.86)}.demo-ripple{position:absolute;top:-17px;left:-17px;width:34px;height:34px;border:2px solid var(--accent);border-radius:50%;animation:demo-ripple .5s var(--ease-out) both}.demo-hint{position:absolute;display:inline-flex;align-items:center;gap:6px;padding:6px 12px 6px 10px;border-radius:999px;background:var(--command);box-shadow:0 8px 20px -8px #10101066;color:var(--ink);font-size:13px;font-weight:500;line-height:1.3;white-space:nowrap;opacity:0;transition:opacity .2s var(--ease-out),transform .2s var(--ease-out)}.demo-cursor .demo-hint{top:24px;left:14px;transform:scale(.92);transform-origin:0 0}.demo-cursor .demo-hint.is-visible{opacity:1;transform:none}.demo-hint-ai{bottom:142px;left:12px;transform:translateY(6px) scale(.95);transform-origin:0 100%}.demo-hint-ai.is-visible{opacity:1;transform:none}.demo-hint-media{top:250px;left:270px;transform:translate(-50%,6px) scale(.95);transform-origin:50% 0}.demo-hint-media.is-visible{opacity:1;transform:translate(-50%)}.demo-deck{position:absolute;top:0;left:0;width:1280px;height:720px;overflow:hidden;transform-origin:0 0;background:#4c0031}.slide-image{display:block;width:100%;height:100%}.demo-title{position:absolute;top:598.4px;left:72.5px;border-radius:10px;outline:4px solid transparent;outline-offset:14px;color:#fff;font-family:Dela Gothic One,sans-serif;font-size:64px;line-height:64px;white-space:nowrap}.demo-title.is-editing{outline-color:#fff}.demo-title .demo-caret{width:6px;height:.9em;margin-left:4px;vertical-align:-.1em;background:#fff}.demo-word{border-radius:8px}.demo-word.is-selected{background:#005bffbf}.demo-blank{position:absolute;top:540px;left:880px;width:40px;height:40px}@keyframes demo-blink{50%{opacity:0}}@keyframes demo-rise{0%{opacity:0;transform:translateY(8px)}}@keyframes demo-fade{0%{opacity:0}}@keyframes demo-ripple{0%{opacity:.7;transform:scale(.3)}to{opacity:0;transform:scale(1.3)}}@media(prefers-reduced-motion:reduce){.demo-layer,.demo-rail,.demo-canvas,.demo-chat,.demo-thumb{transform:none!important}.demo-stack{transition:none}.demo-message{animation:demo-fade .3s ease both}.demo-caret{animation:none}.demo-cursor{transition:opacity .2s ease}.demo-cursor>svg,.demo-ripple{display:none}.demo-cursor .demo-hint,.demo-hint-ai{transform:none}.demo-hint-media,.demo-hint-media.is-visible{transform:translate(-50%)}}.features{--card-radius: 22px;--card-pad: 24px;position:relative;overflow:clip}.features-inner{display:flex;flex-direction:column;gap:var(--title-gap);max-width:var(--page-max);margin:0 auto;padding:var(--section-space) var(--page-pad)}.features-board{position:relative}.features-grid{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}.feature-card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;min-width:0;aspect-ratio:1;padding:var(--card-pad);border-radius:var(--card-radius);container-type:inline-size}.feature-card-brief{background:var(--form);box-shadow:inset 0 0 0 1px var(--line)}.feature-card-edit{background:var(--command)}.feature-card-images{background:var(--ink);color:#fff}.feature-card-book{background:var(--form);box-shadow:inset 0 0 0 1px var(--line)}.feature-art{position:absolute;inset:0;pointer-events:none;-webkit-user-select:none;user-select:none}.feature-copy{position:relative}.feature-copy h3{margin-bottom:8px;font-size:clamp(20px,8cqw,34px);font-weight:600;line-height:1.08;letter-spacing:-.03em}.feature-copy p{font-size:clamp(14px,5cqw,20px);line-height:1.3;letter-spacing:-.01em;color:var(--muted);text-wrap:balance}.feature-copy strong{font-weight:600;color:var(--ink)}.feature-card-edit .feature-copy p{color:#171513cc}.feature-card-images .feature-copy p{color:#ffffffbd}.feature-card-images .feature-copy strong{color:#fff}.feature-shape{position:absolute;height:auto;pointer-events:none;-webkit-user-select:none;user-select:none}.feature-shape-flower{top:0;right:3%;width:110px;transform:translateY(-60%) rotate(-12deg)}.feature-shape-sphere,.feature-shape-voxel,.feature-shape-cursor{display:none}.brief-prompt{position:absolute;z-index:1;top:var(--card-pad);left:var(--card-pad);display:flex;align-items:center;gap:8px;max-width:72%;padding:10px 16px 10px 12px;border-radius:14px;background:var(--tint);font-size:clamp(12px,4.3cqw,15px);font-weight:500;line-height:1.25}.brief-prompt svg{color:var(--muted)}.brief-fan{position:absolute;top:33%;right:22%;width:33%;aspect-ratio:16 / 9}.brief-fan img{position:absolute;inset:0;width:100%;height:100%;border-radius:8px;object-fit:cover;box-shadow:0 14px 30px -12px #15112a80}.brief-fan img:nth-child(1){transform:translate(26%,-46%) rotate(11deg)}.brief-fan img:nth-child(2){transform:translate(13%,-5%) rotate(4deg)}.brief-fan img:nth-child(3){transform:translate(-3%,38%) rotate(-5deg)}.feature-shape-sparkle{top:7%;right:7%;width:14%}.edit-frame{position:absolute;top:8%;left:var(--card-pad);padding:10px 14px;border:1.5px solid var(--ink);font-family:Dela Gothic One,sans-serif;font-size:11.5cqw;line-height:1.08;transform:rotate(-4deg)}.edit-frame i{position:absolute;width:10px;height:10px;border:1.5px solid var(--ink);background:var(--form)}.edit-frame i:nth-of-type(1){top:-6px;left:-6px}.edit-frame i:nth-of-type(2){top:-6px;right:-6px}.edit-frame i:nth-of-type(3){bottom:-6px;left:-6px}.edit-frame i:nth-of-type(4){right:-6px;bottom:-6px}.edit-pointer{position:absolute;top:41%;left:74%;color:var(--ink);fill:#fff}.edit-ask{position:absolute;top:49%;left:var(--card-pad);padding:7px 12px;border-radius:13px 13px 13px 3px;background:var(--form);font-size:13px;font-weight:500;white-space:nowrap}.images-strip{position:absolute;top:var(--card-pad);right:-8%;left:-8%;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;height:48%}.images-strip img{width:100%;height:100%;min-width:0;border-radius:14px;object-fit:cover}.images-balloon{object-position:14% 50%}.images-love{object-position:42% 50%}.feature-shape-torus{top:-20%;left:-10%;width:50%}.book-page{position:absolute;overflow:hidden;border-radius:12px;box-shadow:0 14px 30px -12px #15112a80}.book-page-type{top:8%;right:33%;display:flex;flex-direction:column;gap:12px;width:30%;height:44%;padding:14px;background:var(--ink);color:#fff;font-family:Dela Gothic One,sans-serif;font-size:11cqw;line-height:1;transform:rotate(9deg)}.book-page-type img{width:76%;height:auto}.book-page-colors{top:5%;right:6%;display:grid;grid-template-rows:2fr 1fr 1fr 1fr;width:26%;height:48%;transform:rotate(7deg)}.book-file{position:absolute;z-index:1;top:42%;left:var(--card-pad);display:inline-flex;align-items:center;gap:6px;padding:7px 14px 7px 10px;border:1.5px solid var(--ink);border-radius:999px;background:var(--coral-soft);font-size:13px;font-weight:500;white-space:nowrap}.book-pointer{position:absolute;right:-10px;bottom:-14px;color:var(--ink);fill:#fff}@media(min-width:1101px){.features{--gap: 14px;--title-size: clamp(42px, min(5.2vw, 9vh), 80px);--square: min( calc((var(--screen) - 2 * var(--screen-pad) - var(--title-size) - var(--title-gap) - var(--gap)) / 2), 30vw, 420px )}.features-inner{position:relative;align-items:center;justify-content:center;min-height:var(--screen);padding-top:var(--screen-pad);padding-bottom:var(--screen-pad);text-align:center}.feature-card{text-align:left}.features-board{position:static;width:calc(2 * var(--square) + var(--gap))}.features-grid{gap:var(--gap)}.feature-shape-sphere,.feature-shape-voxel,.feature-shape-cursor{display:block}.feature-shape-flower{top:27%;right:auto;left:11%;width:8%;transform:rotate(-12deg)}.feature-shape-voxel{bottom:9%;left:4%;width:13.5%}.feature-shape-sphere{top:25%;right:7%;width:11%}.feature-shape-cursor{right:4%;bottom:10%;width:13%}}@media(min-width:901px){.features{scroll-snap-align:start}}@media(max-width:640px){.features{--card-pad: 22px}.features-inner{padding-top:72px;padding-bottom:72px}.features-grid{grid-template-columns:minmax(0,1fr)}}.pricing{max-width:var(--page-max);margin:0 auto;padding:var(--section-space) var(--page-pad) 0}.pricing-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:40px}.period-switch{display:inline-flex;gap:2px;padding:4px;border-radius:999px;background:var(--tint)}.period-switch button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 20px;border-radius:999px;color:var(--muted);font-size:16px;font-weight:500;transition:background-color .2s var(--ease-out),color .2s var(--ease-out),box-shadow .2s var(--ease-out)}.period-switch button:hover{color:var(--ink)}.period-switch button[aria-pressed=true]{background:var(--form);color:var(--ink);box-shadow:0 1px 3px #1715131f}.period-badge{padding:2px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent-strong);font-size:13px;font-weight:600}.pricing-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:40px 0 0;padding:0;list-style:none}.pricing-plan{position:relative;display:flex;flex-direction:column;padding:32px;border-radius:24px;background:var(--form);box-shadow:0 0 0 1px var(--line),0 24px 48px -36px #17151340}.pricing-plan.is-featured{background:#fff0e8;box-shadow:0 0 0 1px #ffd3c1,0 24px 48px -32px #c2401b4d}.pricing-badge{position:absolute;top:30px;right:30px;padding:4px 12px;border-radius:999px;background:var(--command);font-size:14px;font-weight:500}.pricing-plan h3{font-size:32px;font-weight:600;line-height:1.1;letter-spacing:-.03em}.pricing-audience{margin-top:6px;color:var(--muted);font-size:17px}.pricing-price{display:flex;align-items:baseline;gap:8px;margin-top:28px;font-size:52px;font-weight:600;line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums;white-space:nowrap}.pricing-price small{color:var(--muted);font-size:18px;font-weight:400;letter-spacing:0}.pricing-note{min-height:21px;margin-top:10px;color:var(--muted);font-size:15px;line-height:1.4}.pricing-features{display:flex;flex-direction:column;gap:12px;margin:24px 0 32px;padding:0;list-style:none;color:var(--ink-soft);font-size:17px;line-height:1.4}.pricing-features li{display:flex;gap:10px}.pricing-features svg{margin-top:2px;color:var(--accent)}.pricing-action{width:100%;min-height:56px;margin-top:auto;font-size:18px}.pricing-perks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:48px 0 0;padding:0;list-style:none}.pricing-perk{display:flex;align-items:flex-start;gap:14px;font-size:16px;line-height:1.35}.pricing-perk .tile-icon{width:44px;height:44px}.pricing-perk strong{display:block;font-weight:500}@media(max-width:1200px){.pricing-plan{padding:28px}.pricing-price{font-size:46px}}@media(min-width:901px){.pricing{display:flex;flex-direction:column;justify-content:center;min-height:var(--screen);padding:var(--screen-pad) var(--page-pad);scroll-snap-align:start}.pricing-plans{margin-top:var(--title-gap)}.pricing-plan{padding-top:clamp(24px,3.5vh,32px);padding-bottom:clamp(24px,3.5vh,32px)}.pricing-badge{top:clamp(22px,3.3vh,30px)}.pricing-price{margin-top:clamp(18px,3vh,28px)}.pricing-note{margin-top:clamp(6px,1vh,10px)}.pricing-features{gap:clamp(8px,1.4vh,12px);margin:clamp(16px,2.6vh,24px) 0 clamp(24px,3.5vh,32px)}.pricing-perks{margin-top:clamp(28px,5vh,48px)}}@media(max-width:900px){.pricing-plans{grid-template-columns:minmax(0,1fr);max-width:520px}.pricing-perks{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.pricing-head{gap:28px}.period-switch button{padding:0 16px}.pricing-plans{gap:16px;margin-top:28px}.pricing-note:empty{display:none}.pricing-plan{padding:24px}.pricing-badge{top:24px;right:24px}.pricing-perks{grid-template-columns:minmax(0,1fr);gap:18px;margin-top:36px}}@media(prefers-reduced-motion:reduce){.period-switch button{transition:none}}.compare{max-width:var(--page-max);margin:0 auto;padding:var(--section-space) var(--page-pad) 0}.compare-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:40px 0 0;padding:0;list-style:none}.compare-option{display:grid;grid-row:span 6;grid-template-rows:subgrid;row-gap:0;padding:32px;border-radius:24px;background:var(--form);box-shadow:0 0 0 1px var(--line),0 24px 48px -36px #17151340}.compare-option.is-featured{--fact-line: #ffd3c1;background:#fff0e8;box-shadow:0 0 0 1px #ffd3c1,0 24px 48px -32px #c2401b4d}.compare-option h3{padding-bottom:24px;font-size:32px;font-weight:600;line-height:1.1;letter-spacing:-.03em}.compare-facts{display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:0;margin:0}.compare-fact{padding:20px 0;border-top:1px solid var(--fact-line, var(--line))}.compare-fact:last-child{padding-bottom:0}.compare-fact dt{color:var(--muted);font-size:14px}.compare-fact dd{margin:8px 0 0;font-size:18px;font-weight:500;line-height:1.35}.compare-fact.is-figure dd{font-size:40px;font-weight:600;line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.compare-note{display:block;margin-top:8px;color:var(--muted);font-size:15px;font-weight:400;line-height:1.4;letter-spacing:0}@media(max-width:1200px){.compare-option{padding:28px}.compare-fact.is-figure dd{font-size:34px}}@media(min-width:901px){.compare{display:flex;flex-direction:column;justify-content:center;min-height:var(--screen);padding:var(--screen-pad) var(--page-pad);scroll-snap-align:start}.compare-list{margin-top:var(--title-gap)}.compare-option{padding-top:clamp(24px,3.5vh,32px);padding-bottom:clamp(24px,3.5vh,32px)}.compare-option h3{padding-bottom:clamp(14px,2.6vh,24px)}.compare-fact{padding:clamp(10px,1.5vh,20px) 0}.compare-fact dd,.compare-note{margin-top:clamp(4px,.8vh,8px)}.compare-fact.is-figure dd{font-size:clamp(32px,4.4vh,40px)}}@media(max-width:900px){.compare-list{grid-template-columns:minmax(0,1fr);max-width:520px}.compare-option,.compare-facts{display:block;grid-row:auto}}@media(max-width:640px){.compare-list{margin-top:28px}.compare-option{padding:24px}.compare-option h3{padding-bottom:16px;font-size:28px}}
