.db-howto.svelte-1wsk8q8{--howto-primary:#7d68dc;--howto-secondary:#a78bfa;--howto-gradient:linear-gradient(135deg, #a78bfa, #7d68dc);--howto-hover:#6e59c8;--howto-light:#f8f5ff;--howto-border:#e6dff1;--howto-text:#31264f;--howto-muted:#716883;color:var(--howto-text);background:#fff;padding:56px 24px}.howto-inner.svelte-1wsk8q8{max-width:1240px;margin:0 auto}h2.svelte-1wsk8q8{text-align:center;letter-spacing:-.025em;margin:0 auto 44px;font-size:36px;font-weight:700;line-height:1.2}.step-grid.svelte-1wsk8q8{grid-template-columns:repeat(3,minmax(0,1fr));gap:34px;display:grid}.step-card.svelte-1wsk8q8{border:1px solid color-mix(in srgb, var(--howto-border) 45%, white);background:#fff;border-radius:6px;overflow:hidden}.step-art.svelte-1wsk8q8{aspect-ratio:525/405;background:linear-gradient(130deg,#e7dfff 0%,#f8f5ff 100%);position:relative;container-type:inline-size}.prompt-panel.svelte-1wsk8q8{background:linear-gradient(#c9bfee, #c9bfee) padding-box, var(--howto-gradient) border-box;border:2px solid #0000;border-radius:15px;width:77.4%;padding:4.1% 9.4%;position:absolute;top:26.7%;left:11.3%}.prompt-panel.svelte-1wsk8q8 p:where(.svelte-1wsk8q8){color:#fff;letter-spacing:-.02em;white-space:nowrap;margin:0 0 6%;font-size:5.65cqw;font-weight:500;line-height:1.35}.generate-demo.svelte-1wsk8q8{color:#fff;background:var(--howto-gradient);border-radius:7px;justify-content:center;align-items:center;gap:9%;height:10.6cqw;font-size:4.5cqw;font-weight:600;display:flex}.prompt-panel.svelte-1wsk8q8 .prompt-cursor{color:#fff;fill:#15121c;width:11cqw;height:11cqw;position:absolute;bottom:-5%;right:18%;transform:rotate(-12deg)}.result-frame.svelte-1wsk8q8{aspect-ratio:4/3;background:#fff;border-radius:20px;width:71.5%;position:absolute;top:15.5%;left:11%;overflow:hidden;box-shadow:0 7px 13px #7d68dc33}.result-frame.svelte-1wsk8q8 img:where(.svelte-1wsk8q8){object-fit:contain;width:100%;height:100%;display:block}.floating-tool.svelte-1wsk8q8{aspect-ratio:1;color:#fff;background:var(--howto-gradient);border:1px solid #fff;border-radius:10px;justify-content:center;align-items:center;width:16.3%;display:flex;position:absolute;top:37%;left:74.3%;transform:rotate(-7deg);box-shadow:0 5px 12px #7d68dc33}.download-demo.svelte-1wsk8q8{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;background:#7d68dc88;border-radius:100px;justify-content:center;align-items:center;gap:7px;width:42%;height:14.5%;font-size:3.8cqw;display:flex;position:absolute;top:75%;left:26.5%}.step-copy.svelte-1wsk8q8{min-height:165px;padding:20px 25px 26px}h3.svelte-1wsk8q8{letter-spacing:-.025em;margin:0 0 13px;font-size:20px;font-weight:600;line-height:1.3}.step-copy.svelte-1wsk8q8 p:where(.svelte-1wsk8q8){color:var(--howto-muted);margin:0;font-size:17px;line-height:1.5}.howto-cta.svelte-1wsk8q8{background:var(--howto-primary);color:#fff;border-radius:999px;justify-content:center;align-items:center;gap:10px;width:fit-content;margin:32px auto 0;padding:14px 26px;font-size:16px;font-weight:600;text-decoration:none;display:flex}.howto-cta.svelte-1wsk8q8:hover{background:var(--howto-hover)}.howto-cta.svelte-1wsk8q8:active{background:var(--howto-hover);transform:translateY(1px)}.howto-cta.svelte-1wsk8q8:focus-visible{outline:3px solid var(--howto-secondary);outline-offset:4px}@media (width>=1600px){.howto-inner.svelte-1wsk8q8{max-width:1667px}.step-grid.svelte-1wsk8q8{gap:46px}h2.svelte-1wsk8q8{margin-bottom:60px;font-size:46px}.step-copy.svelte-1wsk8q8{min-height:220px;padding:27px 34px 26px}h3.svelte-1wsk8q8{margin-bottom:12px;font-size:24px}.step-copy.svelte-1wsk8q8 p:where(.svelte-1wsk8q8){font-size:21px}}@media (width<=1100px) and (width>=761px){.step-grid.svelte-1wsk8q8{gap:20px}.step-copy.svelte-1wsk8q8{padding:20px 18px}h3.svelte-1wsk8q8{font-size:18px}.step-copy.svelte-1wsk8q8 p:where(.svelte-1wsk8q8){font-size:15px}}@media (width<=760px){.db-howto.svelte-1wsk8q8{padding:40px 20px}h2.svelte-1wsk8q8{margin-bottom:30px;font-size:28px}.step-grid.svelte-1wsk8q8{grid-template-columns:1fr;gap:24px;max-width:525px;margin:auto}.step-copy.svelte-1wsk8q8{min-height:0;padding:24px}h3.svelte-1wsk8q8{font-size:20px}.step-copy.svelte-1wsk8q8 p:where(.svelte-1wsk8q8){font-size:16px}}.dragon-ball-page.svelte-12t7o5m{font-family:Inter,ui-sans-serif,system-ui,sans-serif}.dragon-ball-page.svelte-12t7o5m p:where(.svelte-12t7o5m){line-height:1.5}.dragon-ball-page.svelte-12t7o5m p.hero-description:where(.svelte-12t7o5m),.dragon-ball-page.svelte-12t7o5m p.cta-description:where(.svelte-12t7o5m){line-height:1.35}
