:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#f3eee4;--surface:#181818;--surface-strong:#242424;--line:#ffffff1a;--line-strong:#ffffff2e;--accent:#ead3aa;--accent-strong:#d8b878;--accent-ink:#171717;--error:#ff9898;--text:#f7f3eb;--muted:#aaa49a;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Microsoft JhengHei,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 10% 0%, #d8b87838, transparent 32rem), linear-gradient(180deg, #faf8f3 0%, var(--bg) 100%);min-height:100vh;color:var(--text);margin:0;padding:clamp(1.25rem,4vw,3.5rem) 1rem}body:before{content:"";pointer-events:none;opacity:.08;background-image:linear-gradient(#ffffff06 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-size:32px 32px;position:fixed;inset:0}#app{width:100%}.tool-shell{width:min(100%,760px);margin:0 auto;position:relative}.hero{justify-content:space-between;align-items:center;gap:1rem;margin:0 0 1.15rem;display:flex}.brand-mark{color:#fff;letter-spacing:-.08em;background:#111;border-radius:2px;flex:0 0 42px;place-items:center;width:42px;height:42px;font-weight:900;display:grid}.eyebrow{color:var(--accent-strong);letter-spacing:.15em;margin:0 0 .4rem;font-size:.68rem;font-weight:800}h1{letter-spacing:-.025em;margin:0;font-size:clamp(1.2rem,4vw,1.55rem)}.card{border:1px solid var(--line);background:var(--surface);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:22px;padding:clamp(1.25rem,4vw,2rem);overflow:hidden;box-shadow:0 30px 80px #00000061}.intro h1{letter-spacing:-.035em;margin:0 0 .45rem;font-size:clamp(1.35rem,5vw,1.8rem)}.subtitle{max-width:34rem;color:var(--muted);margin:0 0 1rem;font-size:.93rem;line-height:1.7}.privacy-note{color:#f0e2c8;background:#ead3aa12;border:1px solid #ead3aa2e;border-radius:12px;align-items:flex-start;gap:.65rem;margin-bottom:1.35rem;padding:.8rem .9rem;font-size:.82rem;display:flex}.privacy-note span:last-child{gap:.15rem;display:grid}.privacy-note small{color:var(--muted);line-height:1.45}.dropzone{border:1.5px dashed var(--line-strong);text-align:center;cursor:pointer;background:#ffffff05;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;min-height:245px;padding:1.5rem;transition:border-color .16s,background .16s,transform .16s;display:flex}.dropzone:hover,.dropzone.dragover{border-color:var(--accent);background:#ead3aa0e;transform:translateY(-2px)}.dropzone:focus-within{outline-offset:3px;outline:3px solid #ead3aa40}.dropzone input[type=file]{clip:rect(0, 0, 0, 0);width:1px;height:1px;position:absolute;overflow:hidden}.upload-icon{border:1px solid var(--line-strong);width:54px;height:54px;color:var(--accent);background:var(--surface-strong);border-radius:50%;place-items:center;margin-bottom:.9rem;font-size:1.7rem;font-weight:300;display:grid}.dropzone strong{font-size:1rem}.dropzone-or{color:#69746d;margin:.45rem 0;font-size:.75rem}.file-picker{color:var(--accent-ink);background:var(--accent);border-radius:9px;padding:.58rem .9rem;font-size:.86rem;font-weight:750}.file-hint{color:var(--muted);margin-top:.8rem;font-size:.75rem}.file-name{max-width:100%;color:var(--accent);word-break:break-all;margin-top:.6rem;font-size:.82rem}.mode-info{color:#f3e7d1;background:#ead3aa14;border:1px solid #ead3aa40;border-radius:12px;margin-top:1.15rem;padding:.85rem 1rem;font-size:.88rem;line-height:1.55}.back-button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;align-items:center;margin:0 0 1.15rem;padding:0;font-size:.84rem;display:inline-flex}.back-button:hover{color:var(--accent)}.section-heading{justify-content:space-between;gap:1rem;margin-bottom:.65rem;font-size:.9rem;font-weight:700;display:flex}.section-heading small{color:var(--muted);font-weight:400}.preview-container{margin-top:1.35rem}.preview-thumbs{grid-template-columns:repeat(auto-fit,minmax(min(135px,100%),1fr));gap:.7rem;display:grid}.preview-thumbs img{aspect-ratio:1;object-fit:contain;border:1px solid var(--line);background:#101319;border-radius:13px;width:100%}.settings-grid{grid-template-columns:minmax(0,.42fr) minmax(0,1fr);gap:.85rem;display:grid}.field{margin-top:1.25rem}.field label{color:var(--muted);margin-bottom:.42rem;font-size:.8rem;font-weight:600;display:block}.field input[type=number],.field input[type=text]{border:1px solid var(--line-strong);width:100%;color:var(--text);font:inherit;background:#101319;border-radius:10px;outline:none;padding:.72rem .78rem;font-size:.92rem;transition:border-color .15s,box-shadow .15s}.field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #ead3aa24}button.primary{width:100%;color:var(--accent-ink);background:linear-gradient(135deg, #f4e4c5, var(--accent-strong));font:inherit;cursor:pointer;border:0;border-radius:11px;justify-content:center;align-items:center;gap:.65rem;margin-top:1.35rem;padding:.82rem 1rem;font-size:.95rem;font-weight:800;transition:transform .15s,box-shadow .15s,opacity .15s;display:flex;box-shadow:0 12px 30px #d8b87829}button.primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 15px 34px #d8b8783d}button.primary:focus-visible,.back-button:focus-visible{outline-offset:3px;outline:3px solid #ead3aa59}button.primary:disabled{opacity:.68;cursor:wait}button.primary.loading span:last-child{border:2px solid #07140a4d;border-top-color:var(--accent-ink);border-radius:50%;width:16px;height:16px;font-size:0;animation:.75s linear infinite spin}.status{min-height:1.25rem;color:var(--accent);text-align:center;margin-top:.85rem;font-size:.86rem;line-height:1.5}.status.error{color:var(--error)}footer{color:#606a64;text-align:center;padding:1rem 0 0;font-size:.72rem}.hidden{display:none!important}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=520px){body{padding:1rem .75rem 2rem}.card{border-radius:18px}.dropzone{min-height:220px}.settings-grid{grid-template-columns:1fr;gap:0}.section-heading{gap:.2rem;display:grid}.preview-thumbs{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.wordmark{color:#171717;letter-spacing:.16em;align-items:center;gap:.75rem;font-size:1.28rem;font-weight:900;text-decoration:none;display:inline-flex}.brand-link{color:#34312c;border-bottom:1px solid #34312c;padding-bottom:.2rem;font-size:.82rem;font-weight:650;text-decoration:none}.brand-link:hover,footer a:hover{color:#8b662d;border-color:#8b662d}.workflow{grid-template-columns:repeat(3,1fr);gap:.55rem;margin:0 0 1.15rem;padding:0;list-style:none;display:grid}.workflow li{border:1px solid var(--line);min-width:0;color:var(--muted);background:#ffffff06;border-radius:9px;align-items:center;gap:.55rem;padding:.62rem .7rem;font-size:.76rem;display:flex}.workflow b{color:#171717;background:var(--accent);border-radius:50%;flex:0 0 23px;place-items:center;width:23px;height:23px;font-size:.7rem;display:grid}.product-panel{color:#171717;background:#ead9b9;border:1px solid #1717171f;border-radius:18px;justify-content:space-between;align-items:center;gap:2rem;margin-top:1rem;padding:clamp(1.25rem,4vw,1.75rem);display:flex}.product-panel h2{letter-spacing:-.035em;margin:.18rem 0 .35rem;font-size:clamp(1.25rem,4vw,1.6rem)}.product-panel p:not(.product-kicker){color:#5d5548;max-width:31rem;margin:0;font-size:.88rem;line-height:1.65}.product-kicker{color:#786037;letter-spacing:.14em;margin:0;font-size:.66rem;font-weight:800}.product-cta{color:#fff;background:#171717;border-radius:8px;flex:none;padding:.78rem 1rem;font-size:.84rem;font-weight:750;text-decoration:none}.product-cta:hover{background:#37332d}footer{color:#7c756a;justify-content:space-between;gap:1rem;display:flex}footer a{color:#544f47;border-bottom:1px solid #8d8579;text-decoration:none}@media (width<=520px){.hero,.product-panel{align-items:flex-start}.brand-link{text-align:right;max-width:9rem;line-height:1.45}.workflow{gap:.35rem}.workflow li{text-align:center;justify-items:center;gap:.35rem;padding-inline:.3rem;display:grid}.product-panel{gap:1rem;display:grid}.product-cta{text-align:center}footer{justify-content:center;display:grid}}.brand-logo-img{object-fit:contain;width:clamp(125px,20vw,170px);height:auto;display:block}@media (width<=520px){.brand-logo-img{width:120px}}
