:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#203d32;background:#f5f5ef;font-synthesis:none;--bg:#f5f5ef;--surface:#fafbf6;--panel:#fff;--ink:#203d32;--muted:#69786d;--line:#d9ded4;--green:#18513b;--tint:#eaf0e7;--button-text:#fff;--error:#a5302c;color-scheme:light}html[data-theme=dark]{--bg:#141c18;--surface:#1c2821;--panel:#202d25;--ink:#e4eee5;--muted:#a4b4a6;--line:#384a3e;--green:#9bc9ac;--tint:#293e30;--button-text:#14271c;--error:#ffaaa2;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);min-height:100svh;display:flex;flex-direction:column}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--green);outline-offset:4px}button,input,select{color:var(--ink)}[hidden]{display:none!important}.site-header{max-width:1240px;width:100%;margin:0 auto;padding:30px 44px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;font-weight:650;font-size:20px;letter-spacing:-.6px}.brand:hover{text-decoration:none}.brand img{object-fit:contain}.brand-section{font-size:12px;font-weight:500;color:var(--muted);letter-spacing:.8px;display:block;margin-top:2px}nav{display:flex;align-items:center;gap:26px;font-size:14px}.icon-button{border:1px solid var(--line);background:transparent;width:36px;height:36px;border-radius:50%;font-size:22px;line-height:1}main{width:100%;max-width:1136px;margin:48px auto 64px;padding:0 32px;flex:1}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px}h1{font-size:36px;font-weight:650;letter-spacing:-1.4px;line-height:1.15;margin:0}.local-note{font-size:12px;color:var(--muted);white-space:nowrap}.local-note span{color:var(--green);font-size:9px;margin-right:6px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 340px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--panel)}.image-panel{min-width:0;background:var(--surface);padding:22px;display:flex;flex-direction:column}.dropzone{min-height:448px;flex:1;border:1.5px dashed var(--line);border-radius:12px;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:background .15s,border-color .15s}.dropzone.dragging,.image-panel.dragging{background:var(--tint);border-color:var(--green)}.empty-icon{height:72px;width:72px;color:var(--muted);margin-bottom:25px;opacity:.65}.empty-icon svg{width:100%;height:100%}.primary{display:flex;align-items:center;justify-content:center;gap:20px;min-height:48px;border:0;border-radius:9px;background:var(--green);color:var(--button-text);padding:12px 22px;font-weight:600;font-size:14px;text-decoration:none}.primary:hover{filter:brightness(.94);text-decoration:none}.primary span{font-size:20px;font-weight:400}.drop-label{margin-top:14px;font-size:14px;color:var(--muted)}.formats{margin-top:42px;font-size:12px;letter-spacing:.4px;color:var(--muted)}.settings{padding:28px;border-left:1px solid var(--line)}.field{margin-bottom:26px}label{display:block;font-size:13px;font-weight:600;margin-bottom:9px}input[type=number],select{width:100%;height:46px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 12px;min-width:0}input[type=number]{appearance:textfield;-moz-appearance:textfield}input::-webkit-inner-spin-button{appearance:none}.size-input{display:flex;border:1px solid var(--line);border-radius:8px}.size-input input{border:0;width:100%;font-size:20px;background:transparent}.size-input select{width:76px;flex-shrink:0;border:0;border-left:1px solid var(--line);border-radius:0 8px 8px 0;background:transparent}.presets{display:flex;gap:6px;margin-top:9px}.presets button{flex:1;background:transparent;border:1px solid var(--line);border-radius:6px;padding:7px 3px;font-size:11px;white-space:nowrap}.presets button[aria-pressed=true]{background:var(--tint);border-color:var(--green);color:var(--green)}.dimensions{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:17px 0;margin-bottom:21px}summary{font-size:13px;font-weight:600;cursor:pointer}summary span{float:right;color:var(--muted);font-weight:400;font-size:12px}.dimension-fields{display:flex;gap:12px;margin-top:18px}.dimension-fields>div{min-width:0;flex:1}.pixel-input{position:relative}.pixel-input input{padding-right:30px}.pixel-input span{position:absolute;right:12px;top:15px;color:var(--muted);font-size:12px}.field-note{font-size:12px;color:var(--muted);line-height:1.5;margin:8px 0 0}.check-label{display:flex;align-items:center;gap:9px;font-weight:400;font-size:12px;line-height:1.5}.check-label input{width:16px;height:16px;accent-color:var(--green);flex-shrink:0}.action-area{margin-top:25px}.action-area .primary{width:100%}.text-button{border:0;background:none;padding:8px;color:var(--green);font-size:12px}#cancel{display:block;margin:8px auto 0}#status{font-size:12px;line-height:1.6;margin-top:10px;color:var(--muted)}#status:empty{display:none}#error{font-size:13px;line-height:1.6;color:var(--error);margin-top:12px}.preview-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.preview-tabs{background:var(--tint);padding:3px;border-radius:8px;display:flex;gap:3px}.preview-tabs button{border:0;border-radius:6px;background:none;font-size:12px;padding:7px 12px}.preview-tabs button[aria-pressed=true]{background:var(--panel);box-shadow:0 1px 3px #0000000a}.preview-stage{height:340px;display:flex;align-items:center;justify-content:center;background:repeating-conic-gradient(var(--panel) 0% 25%,var(--tint) 0% 50%) 0/20px 20px;border:1px solid var(--line);border-radius:8px;overflow:hidden}.preview-stage img{max-width:100%;max-height:100%;object-fit:contain}.image-meta{display:flex;flex-direction:column;gap:6px;margin-top:17px;font-size:12px;color:var(--muted)}#filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;color:var(--ink)}.download-area{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}.result-size{display:flex;align-items:center;justify-content:space-between;gap:10px}.result-size strong{font-size:25px;font-weight:600;letter-spacing:-.7px}.result-size span{font-size:12px;color:var(--green)}.download{margin-top:16px}footer{max-width:1240px;width:100%;margin:0 auto;padding:25px 44px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:12px}footer nav{font-size:12px;gap:22px}.legal{max-width:720px;margin-top:40px}.legal h1{margin-bottom:12px}.legal h2{font-size:18px;margin:32px 0 10px}.legal p{font-size:15px;line-height:1.75;color:var(--muted)}.legal a{text-decoration:underline;color:var(--green)}@media(prefers-reduced-motion:reduce){*{transition:none!important}}@media(max-width:760px){.site-header{padding:22px}.site-header nav{gap:15px}.brand{font-size:18px}.brand img{width:36px;height:36px}main{margin:24px auto 32px;padding:0 18px}.page-heading{align-items:flex-start;flex-direction:column;gap:10px;margin-bottom:20px}h1{font-size:30px}.workspace{grid-template-columns:1fr;border-radius:15px}.image-panel{padding:16px}.dropzone{min-height:260px}.empty-icon{width:55px;height:55px;margin-bottom:18px}.formats{margin-top:24px}.settings{border-left:0;border-top:1px solid var(--line);padding:22px}.preview-stage{height:280px}.presets button{font-size:12px;padding:9px}.field{margin-bottom:22px}footer{padding:22px;flex-wrap:wrap;gap:18px}footer nav{gap:20px}}
