*{box-sizing:border-box}body{margin:0;background:#f7f8fa;color:#222b35;font:15px/1.65 system-ui,sans-serif}header,main,footer{max-width:1200px;margin:auto}header{height:90px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e5e9}a{color:inherit;text-decoration:none;font-size:24px;font-weight:800}small{font-size:11px;color:#7b8490}header span{font-size:12px}header b{color:#6577df}main{padding:50px 0}.eyebrow{color:#6570b2;font-size:12px;letter-spacing:2px}h1{font-size:46px;line-height:1.3;letter-spacing:-2px;margin:18px 0}em{font-style:normal;color:#6676d7}.intro p{color:#7b8490}.tags{font-size:12px;margin:26px 0 40px}.workspace{display:grid;grid-template-columns:1.08fr 1fr;gap:28px}section{background:white;border:1px solid #e4e7ec;border-radius:16px;padding:28px;margin-bottom:20px}.step{display:flex;align-items:center;gap:12px;color:#7280d9;font-size:13px;margin-bottom:22px}h2{font-size:18px;color:#28323f;margin:0}.step span{margin-left:auto;color:#8b93a0;font-size:12px}label{display:block;font-weight:600;font-size:13px;margin-bottom:19px}input,textarea{display:block;width:100%;padding:14px;border:1px solid #dce1e8;border-radius:8px;margin-top:8px;font:inherit;background:#fcfcfd;color:#273242}input:focus,textarea:focus,button:focus-visible{outline:2px solid #7b89e1;outline-offset:2px}.upload{border:1px dashed #c6cddd;border-radius:10px;position:relative;text-align:center;padding:25px 12px;cursor:pointer;background:#fafbff}.upload strong{display:block;font-size:28px;color:#7685dc}.upload span{display:block;font-size:11px;color:#8992a2;margin-top:7px}.upload input{position:absolute;inset:0;opacity:0;cursor:pointer;height:100%;margin:0}.upload:focus-within{outline:2px solid #7280d9}button{cursor:pointer;background:white;border:1px solid #dce1e8;border-radius:8px;padding:12px 18px;color:#39475b;font:inherit}.primary{width:100%;background:#6d7ed9;color:white;border:0;margin-top:8px}.primary span{float:right}.note{font-size:11px;color:#89919e;text-align:center}#error{color:#bd384c;font-size:13px}#thumbnails{display:flex;flex-wrap:wrap;gap:10px}#thumbnails div{position:relative}#thumbnails img{width:72px;height:82px;object-fit:cover;border-radius:8px}#thumbnails button{position:absolute;right:0;top:0;padding:0 6px;background:white}.preview{width:200px;aspect-ratio:9/16;background:linear-gradient(150deg,#dfe4f0,#eee9e2 55%,#c1cae1);border-radius:15px;margin:5px auto 28px;padding:25px 18px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 15px 30px #75809c22}.preview span{font-size:27px;font-weight:800;line-height:1.3;letter-spacing:-1px;color:#4b5874}.preview i{color:#8795bc}.preview small{font-size:8px;letter-spacing:2px}#empty{text-align:center}#empty p,.integration p{font-size:13px;color:#808996}.integration{padding:15px 20px}.integration b{font-size:13px}.integration span{font-size:11px;color:#828da1}h3{font-size:14px;color:#6374c9;margin-bottom:6px}#output p{font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}.actions{display:flex;gap:10px}#status{font-size:12px;color:#5667bb}footer{border-top:1px solid #e1e5eb;padding:25px 0;font-size:12px;color:#7b8490}footer span{float:right}[hidden]{display:none!important}@media(max-width:800px){header,main,footer{margin:0 20px}.workspace{grid-template-columns:1fr}h1{font-size:36px}section{padding:22px}header{height:70px}footer span{display:block;float:none}}