@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@400;500;600;700&display=swap');*{box-sizing:border-box}body{margin:0;background:#0b0713;color:#f0e7ff;font:14px/1.7 'DM Sans',Arial}header{display:flex;justify-content:space-between;align-items:center;padding:23px 5%;border-bottom:1px solid #fff2}header a{color:#e8d8ff;text-decoration:none;font-size:12px}header a:first-child{font:700 24px Manrope;letter-spacing:4px}header small{display:block;font:8px 'DM Sans';letter-spacing:3px;color:#bd92e7;margin-top:5px}main{display:grid;grid-template-columns:1fr 1fr;max-width:1500px;margin:auto}.editor{padding:50px 9%;background:radial-gradient(ellipse at 10% 0%,#66249a33,transparent 50%)}h1{font:600 clamp(35px,4vw,60px)/1.1 Manrope;letter-spacing:-2.5px;margin:15px 0}h1 em{font-style:normal;color:#cf9dff}.eyebrow{font-size:9px;letter-spacing:2px;color:#d2b4f3}.intro{font-size:13px;color:#ada0c1;max-width:400px}fieldset{padding:0;border:0;margin:30px 0 20px}legend{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:#c8b1e2;margin-bottom:15px}.scenes{display:flex;gap:9px}.scenes button{flex:1;background:#ffffff08;color:#ccc1dc;border:1px solid #fff2;border-radius:13px;padding:13px 8px;font-size:10px}.scenes button[aria-pressed=true]{border-color:#cba4ff;box-shadow:0 0 25px #b371e533}.scenes i{display:block;width:38px;height:38px;margin:0 auto 10px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff,#c789ff 30%,#3d1756 75%);box-shadow:inset -3px -3px 6px #0008,0 0 18px #b282ff33}.scenes button:nth-child(2) i{background:radial-gradient(circle at 30% 25%,#fff,#77ffdc 30%,#054b66 75%)}.scenes button:nth-child(3) i{background:radial-gradient(circle at 30% 25%,#fff,#ffd186 30%,#a3454e 75%)}label{display:block;font-size:11px;color:#c3b6d3;margin:17px 0 6px}input,textarea{width:100%;border:1px solid #d5b8f933;border-radius:10px;padding:12px;background:#151020;color:#eee2fc;font:13px 'DM Sans',Arial}textarea{resize:vertical}input[type=file]{font-size:10px}.hint{font-size:10px;color:#9887ac;line-height:1.8}.primary,.secondary{cursor:pointer;border:0;padding:15px 20px;border-radius:11px;font:600 12px 'DM Sans';margin:10px 8px 0 0}.primary{background:linear-gradient(120deg,#eddaff,#bb87ee);color:#1a0c2d;box-shadow:0 8px 35px #a15dd333}.secondary{background:#fff1;color:#d5b7f4;border:1px solid #bd91e544}button:disabled{opacity:.5;cursor:wait}button,input,textarea{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #cba1ff;outline-offset:3px}#status{font-size:12px;color:#aee4d6;min-height:20px}.preview{position:sticky;top:0;height:100svh;padding:30px;background:linear-gradient(#0b071333,#0b071399),url('/phone/flux-universe.png') 75% center/cover;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.preview-top{display:flex;width:100%;max-width:430px;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:2px;color:#d0b8eb}.preview-top button{background:#10091c88;border:1px solid #fff3;color:#d3b9ee;padding:7px 10px;border-radius:20px;font-size:9px}.preview iframe{border:1px solid #e0c5ff66;border-radius:35px;width:100%;max-width:430px;height:690px;max-height:80svh;background:#110b20;box-shadow:0 0 40px #aa65e44d,0 25px 70px #0008}.preview>p{font-size:9px;color:#bda7d1}@media(max-width:800px){main{grid-template-columns:1fr}.editor{padding:35px 6%}.preview{position:relative;height:auto;min-height:750px;padding:30px 6%}.preview iframe{height:650px;max-height:none}.preview>p{font-size:10px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
