:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif;color:#202124;background:#f6f7f4;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,select{font:inherit}button,select,input{min-height:42px;border:1px solid #d5d8d2;border-radius:8px;background:#fff;color:#202124}button{padding:0 15px;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease}button:hover:not(:disabled){transform:translateY(-1px);border-color:#8c9a90}button:disabled{cursor:not-allowed;opacity:.48}button.primary{border-color:#202124;background:#202124;color:#fff}button.ghost{background:#fff9}.app-shell{min-height:100vh;padding:24px;background:linear-gradient(180deg,#ffffffbd,#f6f7f4f5),linear-gradient(135deg,#57927029,#ce68481a)}.workspace{width:min(1180px,100%);margin:0 auto}.topbar,.result-head,.top-actions{display:flex;align-items:center;gap:12px}.topbar{justify-content:space-between;margin-bottom:16px}.top-actions{flex:0 0 auto}.eyebrow{margin:0 0 6px;color:#657166;font-size:.78rem;font-weight:750;letter-spacing:0;text-transform:uppercase}h1,h2,p{margin-top:0}h1{margin-bottom:0;font-size:clamp(2rem,4vw,3.45rem);line-height:1.04;letter-spacing:0}h2{margin-bottom:0;font-size:1.18rem}.tool-layout{display:grid;grid-template-columns:minmax(310px,400px) minmax(0,1fr);gap:14px;align-items:stretch}.panel{min-height:590px;border:1px solid rgba(32,33,36,.1);border-radius:8px;background:#ffffffd6;box-shadow:0 18px 44px #2c35301a;padding:18px}.input-panel{display:grid;grid-template-rows:minmax(255px,1fr) auto;gap:16px}.file-input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}.drop-zone{display:grid;place-items:center;gap:8px;width:100%;min-height:255px;overflow:hidden;border:1px dashed #aeb8ad;border-radius:8px;background:#f9faf7;color:#4b554c;text-align:center;padding:18px}.drop-zone.dragging{border-color:#2f7d5a;background:#edf6ef}.drop-zone img,.image-preview img{display:block;max-width:100%;max-height:100%;object-fit:contain}.drop-zone img{width:100%;height:100%}.upload-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#2f7d5a;color:#fff;font-size:1.65rem;line-height:1}.drop-zone strong,.empty-state strong{font-size:1.02rem}.drop-zone small,.empty-state span{color:#727a73}.controls{display:grid;gap:13px}.field{display:grid;gap:8px;color:#505850;font-size:.92rem;font-weight:700}.target-input{display:grid;grid-template-columns:minmax(0,1fr) 48px;align-items:center;overflow:hidden;border:1px solid #d5d8d2;border-radius:8px;background:#fff}.target-input input{width:100%;border:0;border-radius:0;padding:0 12px;background:transparent}.target-input span{color:#6d746d;text-align:center}select{width:100%;padding:0 12px}.presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.presets button{padding:0 8px}.presets button.active{border-color:#2f7d5a;background:#e6f2e9;color:#14583b}.result-panel{display:grid;grid-template-rows:auto minmax(0,1fr);gap:14px}.result-head{justify-content:space-between}.empty-state,.progress-state{display:grid;place-items:center;min-height:490px;border:1px dashed #cfd5cc;border-radius:8px;color:#505850;text-align:center;padding:24px}.empty-state{align-content:center;gap:8px}.error-state{border-color:#d9a38e;background:#fff6f1;color:#853d24}.progress-state{gap:12px}.progress-ring{display:grid;place-items:center;width:86px;height:86px;border:8px solid #dfe7df;border-top-color:#2f7d5a;border-radius:50%;font-weight:800}.bar{width:min(320px,100%);height:8px;overflow:hidden;border-radius:999px;background:#dfe5dc}.bar span{display:block;height:100%;border-radius:inherit;background:#2f7d5a;transition:width .18s ease}.preview-grid{display:grid;grid-template-rows:minmax(300px,1fr) auto;gap:14px;min-height:0}.image-preview{display:grid;place-items:center;min-height:300px;overflow:hidden;border:1px solid #dfe2dc;border-radius:8px;background:linear-gradient(45deg,#f1f2ef 25%,transparent 25%),linear-gradient(-45deg,#f1f2ef 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f1f2ef 75%),linear-gradient(-45deg,transparent 75%,#f1f2ef 75%);background-color:#fff;background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0}.stats div{min-width:0;border:1px solid #e2e5df;border-radius:8px;background:#fbfcfa;padding:12px}.stats dt{color:#697168;font-size:.78rem;font-weight:700}.stats dd{margin:4px 0 0;overflow-wrap:anywhere;font-size:1.05rem;font-weight:800}.result-message{margin:12px 0 0;border-radius:8px;background:#edf6ef;color:#155c3e;padding:12px;line-height:1.6}.result-message.warning{background:#fff6f1;color:#853d24}@media(prefers-color-scheme:dark){:root{color:#f4f5f1;background:#161815}.app-shell{background:linear-gradient(180deg,#161815e0,#1d1f1cf5),linear-gradient(135deg,#4c90662b,#bc5b3a1c)}button,input,select,.panel,.target-input,.stats div{border-color:#ffffff1f;background:#232622e6;color:#f4f5f1}button.primary{border-color:#f4f5f1;background:#f4f5f1;color:#161815}.drop-zone,.image-preview,.empty-state{border-color:#ffffff29;background-color:#20231f;color:#f4f5f1}.drop-zone small,.empty-state span,.eyebrow,.stats dt,.target-input span{color:#b9c0b6}.presets button.active{background:#173d2d;color:#b9f0cf}.result-message{background:#173d2d;color:#c8f4d8}}@media(max-width:860px){.app-shell{padding:16px}.topbar{align-items:flex-start;flex-direction:column}.tool-layout{grid-template-columns:1fr}.panel,.empty-state,.progress-state{min-height:auto}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.app-shell{padding:12px}.top-actions,.presets{width:100%;grid-template-columns:1fr}.top-actions{display:grid;grid-template-columns:1fr 1fr}h1{font-size:2rem}.stats{grid-template-columns:1fr}}