*{box-sizing:border-box} :root{font-family:'Segoe UI',Arial,sans-serif;color:#393249;background:#faf8ff;font-size:16px}body{margin:0;background-image:radial-gradient(#cfc5e644 .8px,transparent .8px);background-size:18px 18px}button,select,input{font:inherit}button,select,.upload{cursor:pointer}button,select{border:1px solid #e2daee;border-radius:10px;background:white;color:inherit;padding:10px 12px}button:hover{background:#f2ebff}button:disabled{opacity:.4;cursor:default}button:focus-visible,select:focus-visible,input:focus-visible,canvas:focus-visible,.upload:focus-within{outline:3px solid #ab7ced;outline-offset:3px}header{height:88px;display:flex;align-items:center;justify-content:space-between;max-width:1440px;margin:auto;padding:0 44px;border-bottom:1px solid #e9e1f1;background:#faf8ffee}.brand{display:flex;align-items:center;gap:12px;color:#44335f;font-size:25px;font-weight:850;text-decoration:none;letter-spacing:-1px}.mark{background:#8559d3;color:#fff6bc;display:inline-flex;width:42px;height:42px;align-items:center;justify-content:center;border-radius:12px;box-shadow:3px 3px 0 #d5c1f2;font-size:30px;position:relative}.mark span{position:absolute;right:-5px;top:-10px;font-size:22px;color:#d5a944}.badge{font-size:11px;letter-spacing:2px;color:#8b789b;border:1px solid #dfd4e9;padding:5px 7px;border-radius:5px}main{max-width:1440px;margin:auto;padding:34px 44px 20px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:800;color:#9674b8}h1{font-size:36px;letter-spacing:-1.2px;margin:8px 0 10px;line-height:1.2}.intro p{color:#81738e;margin:0;line-height:1.6}.intro-star{font-size:75px;color:#efafc4;margin-right:25px;transform:rotate(12deg)}.workspace{display:grid;grid-template-columns:210px minmax(300px,1fr) 265px;gap:22px;align-items:start}.panel{background:#fff;border:1px solid #e7dff0;border-radius:19px;padding:22px;box-shadow:0 5px 0 #eee8f555}h2{font-size:16px;margin:0 0 17px}.tools{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tool{display:flex;flex-direction:column;gap:7px;font-size:13px;padding:12px 4px}.tool b{font-size:23px;font-weight:400}.tool.active{background:#f0e7ff;border-color:#a37bd9;color:#764bb8;box-shadow:0 2px 0 #d6c2ef}.divider{height:1px;background:#eee7f3;margin:24px 0}#swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.swatch{padding:0;aspect-ratio:1;border-radius:7px;border:2px solid #0000000c}.swatch.selected{outline:2px solid #8c63c0;outline-offset:2px}.custom{display:flex;align-items:center;gap:8px;font-size:13px;margin:15px 0 0}input[type=color]{width:30px;height:30px;padding:0;border:0;background:none;cursor:pointer}aside label{font-size:14px;display:block;margin:18px 0 9px}aside select{width:100%;font-size:14px}.small{font-size:12px;line-height:1.6;color:#93859e}.editor{padding:0;overflow:hidden}.editorbar{padding:15px 18px;display:flex;align-items:center;justify-content:space-between;font-size:14px;border-bottom:1px solid #eee7f5}.status-dot{display:inline-block;width:7px;height:7px;background:#ac8bd7;border-radius:50%;margin-inline-end:8px}.history{display:flex;gap:4px}.history button{border:0;padding:5px 9px;font-size:18px}.history #clear{font-size:13px}.canvas-wrap{padding:28px;overflow:auto;background:#f1edf6;display:flex;min-height:360px;align-items:flex-start;justify-content:flex-start;max-height:650px}canvas{width:100%;height:auto;aspect-ratio:1;image-rendering:pixelated;touch-action:none;background:white;box-shadow:0 4px 15px #55427412;flex-shrink:0;cursor:crosshair}.canvas-footer{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;font-size:12px;color:#8c7d98;gap:8px}.canvas-footer label{display:flex;align-items:center;gap:5px}.canvas-footer button{padding:2px 8px;border:0}.canvas-footer #zoom{display:inline-block;min-width:40px;text-align:center}.right{display:grid;gap:20px}.photo{background:#fffaff}.mini-icon{display:flex;align-items:center;justify-content:center;border-radius:10px;background:#efdef8;color:#9b60c6;width:37px;height:37px;font-size:27px;margin-bottom:16px}.photo p{font-size:13px;line-height:1.6;color:#8a7995}.upload{border:2px dashed #d9bfea;border-radius:13px;background:#faf1ff;padding:17px 10px;text-align:center;display:flex;align-items:center;flex-direction:column;gap:7px}.upload>span{font-size:26px;color:#ab7ccd}.upload strong{font-size:14px}.upload small{font-size:10px;color:#96829f;letter-spacing:1px}.privacy{font-size:11px!important}.full{width:100%;font-size:14px;font-weight:650}.primary{background:#875bcc;color:white;border-color:#875bcc;box-shadow:0 3px 0 #68449e;margin-top:17px}.primary:hover{background:#7349b7}.secondary{background:#f1e8fa;color:#7d55a6;border-color:#e5d5f1;margin-top:9px}input[type=range]{width:100%;accent-color:#9867ce}output{float:right;color:#9765c5}footer{display:flex;justify-content:space-between;padding:25px 0;font-size:12px;color:#a193ad;gap:18px}footer span:last-child{font-size:10px;letter-spacing:1.5px}#message{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#49375f;color:white;padding:12px 22px;border-radius:12px;z-index:10;font-size:14px;max-width:90%;box-shadow:0 5px 24px #42305230}#message:empty{display:none}[dir=rtl] output{float:left}@media(min-width:1500px){main{padding-top:50px}.canvas-wrap{padding:36px}}@media(max-width:1080px){.workspace{grid-template-columns:170px minmax(270px,1fr)}.right{grid-column:1/-1;grid-template-columns:1fr 1fr}.photo{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}.photo .mini-icon{display:none}.photo h2,.photo p{grid-column:1}.photo .upload{grid-row:1/4;grid-column:2}.photo>label[for=count],.photo>input,.photo>button{grid-column:1/-1}.panel{padding:18px}.editor{padding:0}}@media(max-width:650px){header{padding:0 18px;height:74px}.brand{font-size:21px}.badge{display:none}header select{max-width:125px;font-size:13px}main{padding:25px 16px}.intro{margin-bottom:22px}h1{font-size:28px}.intro p{font-size:14px}.intro-star{display:none}.workspace{grid-template-columns:1fr;gap:14px}.workspace>aside:first-child{display:grid;grid-template-columns:1fr 1fr;gap:10px}.workspace>aside:first-child h2,.divider,.custom,.workspace>aside:first-child .small{display:none}.tools{grid-column:1/-1;grid-template-columns:repeat(4,1fr)}.tool{flex-direction:row;align-items:center;justify-content:center;padding:9px 3px;font-size:12px}.tool b{font-size:20px}#swatches{grid-column:1/-1;grid-template-columns:repeat(10,1fr);margin:7px 0}.workspace>aside:first-child label{margin:0}.workspace>aside:first-child select{grid-row:5}.canvas-wrap{padding:18px;min-height:0;max-height:520px}.right{grid-template-columns:1fr}.photo{display:block}.canvas-footer{padding:10px}.editorbar{padding:10px}footer{flex-direction:column;gap:10px}}

footer{flex-wrap:wrap}.legal-links{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.legal-links button{font-size:14px;background:transparent;border:0;padding:7px 10px;color:#746083;text-decoration:underline;text-underline-offset:4px}.legal-dialog{border:1px solid #dfd0ed;border-radius:20px;padding:28px;max-width:700px;width:calc(100% - 32px);max-height:85vh;color:#493653;background:#fffaff;box-shadow:0 20px 80px #30204033}.legal-dialog::backdrop{background:#30204066}.legal-dialog h2{font-size:24px;margin-top:20px}.legal-dialog p{font-size:16px;line-height:1.8;overflow-wrap:anywhere}.legal-close{float:inline-end}.legal-draft{color:#876098;font-size:13px!important}.remember-setting{display:flex;align-items:center;gap:12px;padding:18px;background:#f0e4fa;border-radius:12px;line-height:1.6}.remember-setting input{width:20px;height:20px;accent-color:#8257cf;flex-shrink:0}

.search-help{margin-top:28px;padding:22px;background:#ffffff99;border:1px solid #e7dff0;border-radius:16px}.search-help ol{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding-inline-start:24px;margin-bottom:0}.search-help li{font-size:14px;line-height:1.8;color:#756082}.language-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.language-links a{font-size:13px;color:#79618e;text-underline-offset:3px}@media(max-width:650px){.search-help ol{grid-template-columns:1fr;gap:8px}}

/* MelloPixel wordmark */
.brand{letter-spacing:-.8px}.mark{font-size:26px;font-weight:900}.brand .badge{letter-spacing:1.4px}@media(max-width:380px){header{padding-inline:12px;gap:10px}.brand{font-size:19px;gap:8px}.mark{width:34px;height:36px;font-size:23px}header select{max-width:104px}}

.tool-nav{margin:0 0 24px}.tool-nav a{color:#7953ae;font-weight:600}.comparison{margin-top:28px}.comparison-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:900px;margin:auto}.comparison figure{margin:0}.comparison figcaption{margin-bottom:10px;font-weight:600}.comparison canvas{border-radius:14px;cursor:default;touch-action:auto}.signature-option{display:flex;gap:8px;align-items:center;margin-top:20px}.comparison h2{font-size:22px}.comparison #comparisonHint{color:#81738e}html[data-converter=true] .photo{border:2px solid #b695e0}html[data-converter=true] .intro{max-width:850px}@media(max-width:650px){html[data-converter=true] .right{grid-row:1}.comparison{padding:16px}.comparison-pair{gap:10px}}