*{box-sizing:border-box}body{margin:0;background:#09090f;color:#fff;font-family:Satoshi,Arial,sans-serif;font-size:16px}header{max-width:1320px;margin:auto;padding:22px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff19}header img{width:175px;display:block}a{color:#ddd;text-decoration:none}a:hover{color:#a69dff}main{max-width:1240px;margin:auto;padding:40px 32px 70px}.tag{color:#aca3ff;font-size:12px;letter-spacing:.13em}h1{font-size:clamp(30px,4vw,48px);letter-spacing:-.045em;margin:12px 0}p{color:#afadb9;line-height:1.5}.heading p{margin:0 0 30px}.workspace{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,1fr);gap:28px;align-items:start}.preview{position:sticky;top:20px;background:#14131d;border:1px solid #ffffff16;border-radius:24px;padding:26px}.preview-top{display:flex;justify-content:space-between;font-size:14px;color:#bbb8cb}.stage{min-height:410px;display:flex;align-items:center;justify-content:center;padding:36px 16px;background:radial-gradient(ellipse,#51428733,transparent 70%)}canvas{width:100%;max-width:420px;max-height:460px;object-fit:contain;box-shadow:0 25px 50px #0006;border-radius:20px;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.hint{font-size:14px}.fine{font-size:13px;color:#a3a0b1;margin:10px 0;line-height:1.5}#quality{color:#e6c080;font-size:14px;min-height:21px}.controls{padding:26px;border:1px solid #ffffff16;border-radius:24px;background:#101017;display:flex;flex-direction:column;gap:12px}label{font-size:14px;font-weight:500;margin-top:6px}select,input[type=url]{font:inherit;width:100%;padding:13px;border:1px solid #ffffff29;border-radius:10px;background:#1a1924;color:white}select{font-size:15px}.upload{border:1px dashed #8174db;border-radius:12px;padding:22px;text-align:center;cursor:pointer;background:#5b4fff10}.upload span{display:block;font-size:13px;color:#b5b0ca;margin-top:6px}#file,#project{position:absolute;width:1px;height:1px;opacity:0}.upload:focus-within{outline:2px solid #aa9fff}.colors,.buttons{display:flex;gap:12px}.colors label{flex:1;display:flex;align-items:center;justify-content:space-between;padding:10px;background:#1a1924;border-radius:8px}input[type=color]{width:35px;height:30px;border:0;background:none;padding:0;cursor:pointer}input[type=range]{accent-color:#8b7fff;width:100%}output{float:right;color:#aaa}button{font:inherit;color:#fff;background:#211f30;border:1px solid #ffffff25;padding:12px 16px;border-radius:10px;cursor:pointer}.buttons button{flex:1;font-size:14px}button:hover:not(:disabled){background:#39314f}button.primary{background:#5b4fff;border-color:#7f74ff;font-weight:700}button:disabled{opacity:.4;cursor:not-allowed}:focus-visible{outline:3px solid #b9adff;outline-offset:4px}.restore{text-align:center;color:#bcb3ff;cursor:pointer;text-decoration:underline;font-size:14px}#status{color:#efb3b3;font-size:14px;margin:0}@media(max-width:760px){header{padding:18px}header img{width:130px}header a{font-size:13px}main{padding:28px 16px 60px}.workspace{grid-template-columns:1fr;gap:18px}.preview{position:static;padding:18px}.stage{min-height:0;padding:24px 10px}canvas{max-width:320px}.controls{padding:20px}h1{font-size:34px}}