@font-face{font-family:Studio;src:local('Segoe UI');font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:#f4f4ee;color:#192132;font-family:Studio,Inter,Arial,sans-serif;font-size:15px;line-height:1.55}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}button,a,input,select,summary{outline-offset:5px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #477cff}button{color:inherit}img{max-width:100%}.wrap{width:min(1320px,calc(100% - 80px));margin:auto}.site-header{height:96px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dbdfd7}.brand{display:flex;align-items:center;gap:10px;font-size:20px;letter-spacing:-.6px;font-weight:900}.brand img{border-radius:9px}.brand-dot{color:#2864f0}.site-header nav{display:flex;align-items:center;gap:30px;font-size:13px;font-weight:600}.channel-link{padding:11px 16px;border:1px solid #c9cec5;border-radius:6px}.hero{padding:62px 0 48px;display:flex;align-items:center;justify-content:space-between}.eyebrow{font-size:11px;letter-spacing:1.8px;font-weight:800;display:block}.hero .eyebrow{display:flex;align-items:center;gap:9px;margin:0 0 20px}.live-dot{display:inline-block;height:7px;width:7px;border-radius:50%;background:#2864f0;box-shadow:0 0 0 4px #2864f015}.hero h1{font-size:clamp(38px,4.8vw,67px);line-height:1.07;letter-spacing:-3.4px;margin:0 0 21px;font-weight:800}.hero h1>span{color:#2864f0}.hero-description{color:#626979;font-size:16px;line-height:1.7}.hero-pills{display:flex;gap:22px;font-size:11px;font-weight:700;margin-top:24px;color:#535f71}.hero-aside{text-align:right;display:flex;flex-direction:column;align-items:flex-end;padding:30px 0 0}.hero-aside strong{font-size:44px;line-height:1.15;letter-spacing:-1px}.hero-aside>span{font-size:12px;margin-top:6px}.hero-aside small{font-size:11px;color:#7b8490;margin-top:20px}.count-mark{border:1px solid #c9cec5;border-radius:50%;width:42px;height:42px;text-align:center;line-height:40px;font-size:23px;margin-bottom:18px}.studio{background:#111723;border:1px solid #272e3c;border-radius:16px;color:#f5f7fc;overflow:hidden;box-shadow:0 22px 65px #10172c19}.studio-topbar{height:55px;padding:0 26px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #2a3241;font-size:10px;letter-spacing:1.8px;font-weight:700}.studio-topbar>div{display:flex;align-items:center;gap:10px}.studio-led{width:6px;height:6px;border-radius:50%;background:#83e5b4}.version{color:#747f92;margin-left:8px}.topbar-note{color:#909caf;letter-spacing:.4px;font-weight:400}.studio-grid{display:grid;grid-template-columns:330px 1fr}.controls{padding:26px 24px;border-right:1px solid #2a3241}.control-block{border:0;padding:0;margin:0 0 25px;min-width:0}.control-block legend{font-size:12px;font-weight:700;padding:0;margin-bottom:15px;width:100%;display:flex;align-items:center;gap:10px}.step{font-size:10px;color:#7f8ca2;border:1px solid #364055;line-height:22px;width:24px;text-align:center;border-radius:5px}.style-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.style-option{padding:11px 4px 8px;background:#1c2331;color:#aab5c8;border:1px solid #30394a;border-radius:7px;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10px}.style-option .style-icon{font-family:Arial,sans-serif;font-size:29px;line-height:35px}.style-option.selected{background:#203769;border-color:#5289ff;color:white}.style-option:hover{border-color:#7b97c2}.style-option:after{content:'';width:4px;height:4px;background:transparent;border-radius:50%;margin-top:2px}.style-option.selected:after{background:#72a2ff}.color-controls{display:flex;gap:8px}.color-control{flex:1;min-width:0}.color-control label{font-size:9px;display:block;color:#a1aec2;margin-bottom:5px;white-space:nowrap}.color-control input[type=color]{display:block;appearance:none;border:1px solid #45516a;background:transparent;height:32px;width:100%;padding:3px;border-radius:6px;cursor:pointer}.color-control input[type=color]::-webkit-color-swatch-wrapper{padding:0}.color-control input[type=color]::-webkit-color-swatch{border:0;border-radius:3px}.color-control input[type=text]{width:100%;font-family:Consolas,monospace;font-size:9px;padding:5px 0;border:0;color:#b4bfd1;background:transparent;text-align:center}.palette-presets{display:flex;align-items:center;gap:6px;margin-top:11px}.palette-presets button{background:none;border:1px solid #394459;width:27px;height:24px;border-radius:5px;padding:3px}.swatch{display:block;width:100%;height:100%;border-radius:2px}.brand-swatch{background:linear-gradient(90deg,#2864f0 33%,#56d6e8 33% 66%,#fff 66%)}.sunset-swatch{background:linear-gradient(90deg,#ff573d 33%,#ffbe6b 33% 66%,#fff5df 66%)}.mint-swatch{background:linear-gradient(90deg,#0f826d 33%,#b9eb8c 33% 66%,#f0fff5 66%)}.mono-swatch{background:linear-gradient(90deg,#202a3a 33%,#9aa6b8 33% 66%,#fff 66%)}.palette-presets>span{font-size:9px;color:#8290a5;margin-left:4px}.upload-area{position:relative;border:1px dashed #4a5871;border-radius:8px;padding:14px 11px;display:flex;align-items:center;gap:10px;background:#1a2231;cursor:pointer}.upload-area:hover,.upload-area.dragging{background:#203769;border-color:#5289ff}.upload-area input{position:absolute;width:100%;height:100%;inset:0;opacity:0;cursor:pointer}.upload-area:focus-within{outline:3px solid #477cff;outline-offset:3px}.upload-icon{font-size:24px;color:#8ab1ff}.upload-area strong{display:block;font-size:11px;font-weight:600;max-width:208px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.upload-area small{font-size:9px;color:#8c9ab0;display:block;margin-top:3px}.field-hint{font-size:10px;color:#8c9ab0;margin:7px 0 15px}.range-label{display:flex;justify-content:space-between;align-items:center;font-size:11px;margin-bottom:10px}.range-label output{color:#a1bfff;font-size:11px}.range-label input[type=number]{width:55px;border:1px solid #3b4962;background:#1c2639;color:white;padding:4px 6px;border-radius:5px;text-align:center;font-size:11px}input[type=range]{width:100%;height:5px;accent-color:#72a2ff;cursor:pointer;display:block;margin:10px 0 12px}.small-actions{display:flex;justify-content:space-between;margin-top:10px}.small-actions button,.reset-all{background:none;border:0;padding:0;color:#94a3ba;font-size:10px;text-decoration:underline;text-underline-offset:3px}.small-actions button:hover,.reset-all:hover{color:white}.range-ends{display:flex;justify-content:space-between;font-size:9px;color:#7b8aa1;margin-top:-6px}.select-label{display:block;font-size:11px;margin:14px 0 7px}select{width:100%;border:1px solid #35425a;background:#1b2434;color:#c7d2e5;padding:10px 8px;border-radius:5px;font-size:11px}.reset-all{display:block;margin:auto;text-decoration:none}.preview-column{padding:28px 30px 24px;min-width:0}.preview-heading{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.4px;margin-bottom:16px;color:#9eacc1}.preview-heading>span:first-child{display:flex;align-items:center;gap:9px;color:#dce5f4;font-weight:600}.preview-heading>span:last-child{letter-spacing:0}.preview-heading .live-dot{background:#8bd9b9;box-shadow:0 0 0 3px #8bd9b914}.preview-stage{aspect-ratio:16/9;position:relative;border:1px solid #38445a;border-radius:9px;overflow:hidden;background-color:#1b2330;isolation:isolate}.checker{background-image:conic-gradient(#252e3e 25%,#1b2330 0 50%,#252e3e 0 75%,#1b2330 0);background-size:24px 24px}.preview-stage.dark{background:#09101a}.preview-stage.light{background:#f0f0e8}.preview-stage.scenes{background:radial-gradient(ellipse at 20% 30%,#e8b769,#a34f2e 48%,#452f37)}.preview-stage.scenes.scene-b{background:radial-gradient(ellipse at 70% 30%,#7fd5bb,#285b68 48%,#1a2440)}.preview-stage canvas{width:100%;height:100%;display:block}.stage-label{position:absolute;right:12px;bottom:10px;font-size:9px;padding:3px 7px;border-radius:4px;background:#0d162a85;color:#c9d2e5;pointer-events:none}.playback-controls{display:flex;align-items:center;gap:12px;margin-top:13px}.icon-button{background:#1e293b;border:1px solid #344058;border-radius:5px;width:29px;height:28px;color:#dce8fc;font-size:15px;flex-shrink:0}.playback-controls input{flex:1;margin:0}.playback-controls>span{font:10px Consolas,monospace;color:#a6b5cd;white-space:nowrap}.preview-tools{display:flex;justify-content:space-between;align-items:center;margin:16px 0 29px;gap:8px}.background-options{display:flex;gap:4px}.background-options button{font-size:11px;padding:5px 7px;background:transparent;color:#8796ad;border:1px solid transparent;border-radius:4px}.background-options button span{font-size:9px;margin-left:3px}.background-options button.selected{background:#24324b;border-color:#3d537b;color:#c7dcff}.preview-note{font-size:9px;color:#7e8ba1}.export-card{padding:26px;border-radius:9px;border:1px solid #344361;background:linear-gradient(120deg,#1b2d4e,#192233);display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:20px}.export-card .eyebrow{font-size:8px;letter-spacing:1.5px;color:#8fa9cf}.export-card h2{font-size:21px;margin:9px 0 7px;letter-spacing:-.5px}.export-card p{font-size:10px;line-height:1.7;color:#a7b5cc;margin:0}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;background:#316ef5;color:white;border:1px solid #5b8aff;font-weight:700;font-size:12px;padding:14px 20px;border-radius:6px;box-shadow:0 4px 20px #0a14371a}.primary-button:hover{background:#1b5de9}.primary-button>span{font-size:19px;line-height:1}.export-card .render-note{grid-column:2;font-size:8px;margin-top:9px;text-align:center;color:#8fa0bc}.output-info{display:flex;justify-content:space-between;align-items:center;padding:16px 2px 0;color:#9dacc2;font-size:10px}.info-dot{display:inline-block;width:5px;height:5px;background:#83a7e9;border-radius:50%;margin-right:7px}.output-info strong{color:#d9e6fe;font-weight:600}.output-info button{font-size:9px;border:0;background:transparent;color:#92baff;text-decoration:underline;text-underline-offset:3px}.app-status{min-height:18px;margin:12px 0;color:#a9bedf;font-size:11px}.app-status.error{color:#ffb1ae}.privacy-note{border-top:1px solid #2a3446;margin-top:22px;padding-top:18px;display:flex;gap:12px;color:#8190a7;font-size:10px}.privacy-note>span{font-size:23px;color:#7b93b9}.privacy-note p{margin:0;line-height:1.8}.privacy-note strong{font-weight:500;color:#abbad1}.last-result{padding:13px;border:1px solid #367b65;background:#1d3e35;border-radius:7px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;font-size:10px}.last-result a{color:#b0f5d6}.last-result button{border:0;background:none;color:#b0f5d6;font-size:10px;text-decoration:underline}.section-heading{margin-bottom:34px}.section-heading .eyebrow{color:#6a7689;font-size:10px}.section-heading h2{font-size:34px;line-height:1.2;letter-spacing:-1.2px;margin:13px 0}.how-section{padding:74px 0 64px}.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px}.number{font-size:13px;font-weight:700;color:#2864f0}.how-grid h3{font-size:19px;letter-spacing:-.5px;margin:18px 0 10px}.how-grid p{font-size:13px;color:#626e7d;line-height:1.85;margin:0}.editorial{border-top:1px solid #d7dcd4;border-bottom:1px solid #d7dcd4;padding:64px 0;display:grid;grid-template-columns:1fr 1fr;gap:100px}.editorial .eyebrow{color:#2864f0;font-size:10px}.editorial h2{font-size:39px;letter-spacing:-1.6px;line-height:1.2;margin:18px 0 24px}.editorial p{font-size:13px;color:#626e7d;line-height:1.9}.text-link{color:#2864f0;font-weight:700;font-size:12px}.editorial .text-link{display:inline-block;margin-top:16px}.usage-guide{background:#e9ece4;border:1px solid #d8ddd2;padding:30px;border-radius:10px}.pill{font-size:8px;letter-spacing:1.2px;background:#f9faf5;padding:6px 10px;border:1px solid #d5dbce;border-radius:4px;font-weight:700}.usage-guide h3{font-size:23px;letter-spacing:-.6px;margin:19px 0}.usage-guide h4{font-size:13px;margin:16px 0 5px}.usage-guide p{font-size:12px;margin:0}.faq-section{padding:66px 0}.faq-list{display:grid;grid-template-columns:1fr 1fr;column-gap:48px}.faq-list details{border-top:1px solid #d3d9cf;padding:17px 0}.faq-list summary{cursor:pointer;font-size:14px;font-weight:600;list-style:none;padding-right:26px;position:relative}.faq-list summary:after{content:'+';position:absolute;right:3px;font-size:21px;top:-5px;color:#2864f0}.faq-list details[open] summary:after{content:'−'}.faq-list p{font-size:12px;color:#626e7d;line-height:1.85}.support-banner{background:#2864f0;border-radius:12px;padding:37px 42px;display:flex;align-items:center;justify-content:space-between;gap:25px;color:white}.support-banner .eyebrow{font-size:9px;opacity:.75}.support-banner h2{font-size:27px;letter-spacing:-.8px;margin:10px 0}.support-banner p{font-size:12px;opacity:.8}.support-banner .primary-button{background:#fff;color:#1c4eba;border-color:#fff;white-space:nowrap}.site-footer{display:flex;justify-content:space-between;gap:30px;padding:48px 0}.site-footer p{font-size:11px;color:#7b8796}.site-footer nav{display:flex;gap:20px;font-size:10px;color:#67748a;align-items:flex-start;padding-top:6px}.site-footer .brand{font-size:17px}.skip-link{position:fixed;z-index:100;top:-70px;left:16px;background:#2864f0;color:#fff;padding:12px}.skip-link:focus{top:10px}.noscript{position:fixed;bottom:0;width:100%;padding:16px;background:#ffd5a1;color:#492700;text-align:center;z-index:100}.error input{border-color:#fb8888}dialog{width:min(1050px,calc(100% - 32px));max-height:92vh;overflow:auto;border:1px solid #34425b;border-radius:16px;padding:35px;background:#151e2d;color:#edf3ff;box-shadow:0 30px 120px #0008}dialog::backdrop{background:#080e1bc9;backdrop-filter:blur(5px)}.modal-close{position:absolute;right:19px;top:12px;background:none;border:0;color:#acbdd9;font-size:28px}.modal-heading .eyebrow{font-size:9px;color:#95b2e8}.modal-heading h2{font-size:27px;letter-spacing:-.7px;margin:9px 0}.modal-heading p{font-size:12px;color:#a6b7d2;margin:0 0 18px}progress{appearance:none;width:100%;height:6px;display:block;border:0;border-radius:8px;overflow:hidden;background:#2e3b50}progress::-webkit-progress-bar{background:#2e3b50}progress::-webkit-progress-value{background:#6395ff}progress::-moz-progress-bar{background:#6395ff}.progress-meta{display:flex;justify-content:space-between;gap:15px;font-size:9px;color:#a3b4ce;margin:8px 0 25px}.modal-columns{display:grid;grid-template-columns:1.1fr 1fr;gap:30px}.youtube-preview{min-height:260px;background:radial-gradient(ellipse at 60% 20%,#3152a0,#121b2c 70%);border-radius:10px;border:1px solid #3d4e6b;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px;aspect-ratio:16/10}.youtube-preview .video-play{font-size:32px;color:#8db1ff}.youtube-preview strong{margin-top:7px;font-size:16px}.youtube-preview p{font-size:10px;color:#9fb3d7}.youtube-preview small{font-size:8px;color:#8397b8;margin-top:14px}.youtube-preview iframe{width:100%;height:100%;min-height:260px;border:0}.youtube-preview.loaded{padding:0;display:block;overflow:hidden}.video-side>a{font-size:10px;color:#9abaff;margin-top:12px;display:inline-block}.thank-you{padding:2px 5px}.heart{color:#8eacff;font-size:26px}.thank-you h3{font-size:27px;line-height:1.1;letter-spacing:-.6px;margin:8px 0 16px}.thank-you p,.thank-you li{font-size:11px;color:#aabbd6;line-height:1.8}.thank-you ul{padding-left:18px}.thank-you small{display:block;font-size:8px;color:#7d91b1;margin-top:9px}.thank-you .primary-button{font-size:11px;padding:12px 15px}.secondary-button{border:1px solid #4c6081;color:#d9e7ff;background:#26364e;border-radius:6px;padding:10px 15px;font-size:11px}.modal-bottom{margin-top:28px;border-top:1px solid #30405b;padding-top:18px;display:flex;align-items:center;gap:17px}.modal-bottom>span{font-size:10px;color:#99b3d5}[hidden]{display:none!important}.content-page{max-width:850px;padding:60px 0}.content-page h1{font-size:40px;line-height:1.15;letter-spacing:-1px}.content-page h2{font-size:22px;margin-top:36px}.content-page p,.content-page li{color:#586575;font-size:15px;line-height:1.9}.content-page a{color:#2864f0;text-decoration:underline}.content-page code{font-size:12px;overflow-wrap:anywhere}
@media(min-width:1500px){.preview-stage{margin-top:10px}.preview-column{padding:32px 38px}.export-card{margin-top:36px}.hero{padding-top:75px;padding-bottom:58px}}
@media(max-width:1100px){.wrap{width:calc(100% - 44px)}.studio-grid{grid-template-columns:290px 1fr}.controls{padding:22px 18px}.preview-column{padding:24px 22px}.export-card{grid-template-columns:1fr;padding:23px}.export-card .primary-button{margin-top:20px}.export-card .render-note{grid-column:1}.preview-tools{align-items:flex-start;flex-direction:column}.editorial{gap:45px}.site-footer nav{flex-wrap:wrap;max-width:430px}.hero-aside{padding-left:20px}.hero h1{font-size:55px}}
@media(max-width:760px){.wrap{width:calc(100% - 28px)}.site-header{height:75px}.brand{font-size:17px}.brand img{width:31px;height:31px}.site-header nav{gap:16px;font-size:11px}.site-header nav>a:not(.channel-link){display:none}.channel-link{padding:7px 10px}.hero{padding:37px 0 30px;align-items:flex-start}.hero h1{font-size:43px;letter-spacing:-2.2px}.hero .eyebrow{font-size:8px;letter-spacing:1.2px;margin-bottom:17px}.hero-description{font-size:13px;max-width:330px}.desktop-break{display:none}.hero-pills{gap:11px;flex-wrap:wrap;font-size:9px;margin-top:20px}.hero-aside{display:none}.studio{border-radius:10px}.studio-topbar{padding:0 17px;font-size:8px;height:47px;letter-spacing:1.2px}.topbar-note{font-size:8px}.studio-grid{display:flex;flex-direction:column}.preview-column{order:-1;padding:20px 16px 19px;border-bottom:1px solid #2a3241}.preview-heading{font-size:8px;margin-bottom:12px}.preview-heading>span:last-child{font-size:8px}.preview-tools{flex-direction:row;align-items:center;margin-bottom:19px}.preview-note{display:none}.background-options button{padding:4px 6px}.export-card{padding:19px;display:block}.export-card h2{font-size:19px}.export-card p{font-size:10px}.export-card .primary-button{width:100%;margin-top:16px;padding:13px}.export-card .render-note{margin-top:9px;font-size:9px}.privacy-note{display:none}.app-status{margin-bottom:0}.controls{border:0;padding:25px 20px;display:grid;grid-template-columns:1fr 1fr;gap:20px}.control-block{margin:0}.control-block legend{font-size:10px;gap:6px}.step{font-size:8px;width:20px;line-height:19px}.style-options{grid-template-columns:repeat(3,1fr);gap:5px}.style-option{font-size:9px;padding:5px 2px}.style-option .style-icon{font-size:24px;line-height:29px}.color-controls{gap:5px}.color-control input[type=text]{font-size:7px}.color-control label{font-size:7px}.color-control input[type=color]{height:29px}.palette-presets{gap:3px;flex-wrap:wrap}.palette-presets>span{width:100%;margin:3px 0 0}.upload-area{padding:10px 7px;gap:5px;display:block}.upload-icon{display:none}.upload-area strong{font-size:9px;max-width:130px;white-space:normal}.upload-area small{font-size:8px}.range-label{font-size:9px}.small-actions{gap:8px}.small-actions button{font-size:8px}.field-hint{font-size:8px}.select-label{font-size:9px}select{font-size:9px;padding:8px 4px}.reset-all{grid-column:1/-1;margin-top:7px}.how-section{padding:45px 0}.section-heading{margin-bottom:25px}.section-heading h2{font-size:27px}.section-heading .eyebrow{font-size:8px}.how-grid{grid-template-columns:1fr;gap:25px}.how-grid article{padding-left:42px;position:relative}.number{position:absolute;left:0;top:4px;font-size:11px}.how-grid h3{margin:0 0 8px;font-size:18px}.how-grid p{font-size:12px}.editorial{grid-template-columns:1fr;gap:25px;padding:40px 0}.editorial h2{font-size:32px;margin:14px 0 20px}.usage-guide{padding:24px}.faq-section{padding:42px 0}.faq-list{grid-template-columns:1fr}.faq-list summary{font-size:13px}.support-banner{padding:28px 24px;flex-direction:column;align-items:flex-start;gap:10px}.support-banner h2{font-size:24px}.support-banner .primary-button{width:100%;font-size:11px}.site-footer{padding:34px 0;flex-direction:column;gap:15px}.site-footer nav{flex-direction:column;gap:13px}.modal-columns{grid-template-columns:1fr;gap:24px}dialog{padding:26px 20px}.modal-heading h2{font-size:23px}.progress-meta>span:last-child{max-width:190px;text-align:right}.youtube-preview{min-height:210px}.thank-you{padding:0}.thank-you h3 br{display:none}.thank-you h3{font-size:24px}.modal-bottom{flex-wrap:wrap}.modal-bottom .primary-button{width:100%}.content-page{padding:35px 0}.content-page h1{font-size:31px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(max-width:480px){.controls{grid-template-columns:1fr;gap:25px}.style-options{grid-template-columns:repeat(5,1fr)}.control-block legend{font-size:12px}.color-control label{font-size:10px}.color-control input[type=text]{font-size:11px}.color-control input[type=color]{height:36px}.palette-presets{gap:7px}.palette-presets>span{width:auto}.upload-area{padding:14px}.upload-area strong{font-size:12px;max-width:none}.upload-area small{font-size:10px}.range-label,.select-label{font-size:12px}.small-actions button,.field-hint{font-size:11px}select{font-size:12px;padding:11px 7px}.hero{flex-direction:column}.hero-aside{display:flex;flex-direction:row;align-items:center;gap:9px;text-align:left;padding:18px 0 0}.hero-aside strong{font-size:24px}.hero-aside>span{font-size:11px;margin:0}.hero-aside .count-mark,.hero-aside small{display:none}}