:root{--tx:clamp(.75rem, .7rem + .25vw, .875rem);--ts:clamp(.875rem, .8rem + .35vw, 1rem);--tb:clamp(1rem, .95rem + .25vw, 1.125rem);--tl:clamp(1.125rem, 1rem + .75vw, 1.5rem);--txl:clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);--s1:.25rem;--s2:.5rem;--s3:.75rem;--s4:1rem;--s5:1.25rem;--s6:1.5rem;--s8:2rem;--s10:2.5rem;--r:.375rem;--rm:.5rem;--rl:.75rem;--rx:1rem;--rf:9999px;--tr:.18s cubic-bezier(.16, 1, .3, 1);--fd:"Cabinet Grotesk", "Helvetica Neue", sans-serif;--fb:"Satoshi", "Inter", sans-serif;--bg:#111110;--sf:#161615;--so:#1c1c1a;--bd:#2e2e2b;--dv:#252523;--t:#e8e6e0;--tm:#888784;--tf:#555350;--p:#4f9cf5;--ph:#3a87e8;--pg:#4f9cf526;--wa:#f5a623;--wag:#f5a6231f;--er:#e05c6a;--erg:#e05c6a1f}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased}body{min-height:100dvh;font-family:var(--fb);font-size:var(--ts);color:var(--t);background:var(--bg);line-height:1.6}button{cursor:pointer;font:inherit;color:inherit;background:0 0;border:none}input{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--p);outline-offset:3px;border-radius:var(--r)}.topbar{align-items:flex-start;gap:var(--s1);padding:var(--s3) var(--s6);background:var(--sf);border-bottom:1px solid var(--bd);flex-direction:column;display:flex}.partner-badge{align-items:center;gap:var(--s2);font-size:var(--tx);color:var(--tm);display:flex}.partner-badge-icon{border-radius:var(--r);object-fit:cover;flex-shrink:0;width:20px;height:20px}.logo{font-family:var(--fd);font-size:var(--tb);letter-spacing:-.02em;font-weight:800}.main{width:100%;max-width:560px;padding:var(--s8) var(--s6);margin-inline:auto}.card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--rx);overflow:hidden}.dropzone{min-height:300px;padding:var(--s10);border:2px dashed var(--bd);border-radius:var(--rl);margin:var(--s4);cursor:pointer;text-align:center;transition:border-color var(--tr), background var(--tr);flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.dropzone:hover,.dropzone.drag-over{border-color:var(--p);background:var(--pg)}.dropzone input[type=file]{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.dz-icon{background:var(--so);border:1px solid var(--bd);border-radius:var(--rx);width:52px;height:52px;margin-bottom:var(--s4);color:var(--p);justify-content:center;align-items:center;display:flex}.dz-title{font-family:var(--fd);font-weight:700;font-size:var(--tb);margin-bottom:var(--s2)}.dz-sub{font-size:var(--tx);color:var(--tm);margin-bottom:var(--s4)}.dz-browse{padding:var(--s2) var(--s4);border:1px solid var(--bd);border-radius:var(--rm);font-size:var(--tx);background:var(--so);color:var(--tm);pointer-events:none;font-weight:600}.dropzone:hover .dz-browse{border-color:var(--p);color:var(--p)}.loading{justify-content:center;align-items:center;gap:var(--s4);min-height:300px;padding:var(--s10);margin:var(--s4);text-align:center;flex-direction:column;display:flex}.spinner{border:3px solid var(--bd);border-top-color:var(--p);border-radius:50%;width:36px;height:36px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{font-size:var(--ts);font-weight:600}.loading-detail{font-size:var(--tx);color:var(--tm)}.error-box{align-items:center;gap:var(--s3);padding:var(--s8);margin:var(--s4);text-align:center;flex-direction:column;display:flex}.error-message{color:var(--er);font-weight:600}.preview{gap:var(--s4);padding:var(--s4);flex-direction:column;display:flex}.preview-header{padding-bottom:var(--s3);border-bottom:1px solid var(--dv);justify-content:space-between;align-items:center;display:flex}.preview-header h2{font-size:var(--ts);font-weight:700}.reset-btn{padding:var(--s1) var(--s3);border-radius:var(--rm);font-size:var(--tx);color:var(--tm);transition:background var(--tr), color var(--tr);font-weight:600}.reset-btn:hover{background:var(--so);color:var(--t)}.canvas-wrap{background:var(--so);border:1px solid var(--bd);border-radius:var(--rl);padding:var(--s3);justify-content:center;display:flex}.canvas-wrap canvas{border-radius:var(--r);max-width:100%;height:auto;display:block}.field{gap:var(--s2);flex-direction:column;display:flex}.field label{font-size:var(--tx);color:var(--tm);font-weight:600}.field input{padding:var(--s3);background:var(--so);border:1px solid var(--bd);border-radius:var(--rm);transition:border-color var(--tr)}.field input:focus{border-color:var(--p);outline:none}.field input::placeholder{color:var(--tf)}.warning-banner{gap:var(--s2);padding:var(--s3);border-radius:var(--rl);background:var(--wag);border:1px solid var(--wa);color:var(--wa);font-size:var(--tx);align-items:flex-start;display:flex}.btn{width:100%;padding:var(--s3) var(--s6);background:var(--p);color:#fff;border-radius:var(--rm);font-family:var(--fd);font-size:var(--ts);letter-spacing:-.01em;transition:background var(--tr), box-shadow var(--tr), transform var(--tr);justify-content:center;align-items:center;gap:var(--s2);font-weight:700;display:flex}.btn:hover:not(:disabled){background:var(--ph);box-shadow:0 0 20px var(--pg);transform:translateY(-1px)}.btn:active:not(:disabled){transform:translateY(0)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-note{color:var(--tf);text-align:center;font-size:10px}.hidden{display:none!important}