*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root,[data-theme=dark]{--bg:#0f1117;--bg2:#1a1d27;--bg3:#252836;--border:#2e3347;--accent:#6c63ff;--accent2:#a78bfa;--accent-glow:#6c63ff59;--text:#e8eaf6;--text2:#9ea3b8;--text3:#5c6180;--success:#34d399;--warn:#fbbf24;--error:#f87171;--shadow:0 4px 24px #0006;--nav-bg:#0f1117f2;--card-hover:#6c63ff14;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=light]{--bg:#f3f4f8;--bg2:#fff;--bg3:#eaecf4;--border:#d8dce8;--accent:#6c63ff;--accent2:#5b52e0;--accent-glow:#6c63ff33;--text:#1a1d2e;--text2:#4a5068;--text3:#8d93ae;--success:#10b981;--warn:#f59e0b;--error:#ef4444;--shadow:0 4px 24px #0000001a;--nav-bg:#fffffff5;--card-hover:#6c63ff0d;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6;transition:background .2s,color .2s}a{color:inherit;text-decoration:none}button{cursor:pointer;border:none;outline:none;font-family:inherit}input,select,textarea{outline:none;font-family:inherit}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text3)}#app{min-height:100vh}.topnav{background:var(--nav-bg);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:100;align-items:center;gap:0;height:52px;padding:0 16px;display:flex;position:fixed;top:0;left:0;right:0}.main-content{margin-top:52px}.page-layout{grid-template-columns:256px 1fr;min-height:calc(100vh - 52px);display:grid}.ctrl-sidebar{background:var(--bg2);border-right:1px solid var(--border);scrollbar-width:thin;flex-direction:column;gap:12px;height:calc(100vh - 52px);padding:16px 14px;display:flex;position:sticky;top:52px;overflow-y:auto}.ctrl-sidebar::-webkit-scrollbar{width:4px}.tool-main{min-width:0;padding:16px 20px;overflow-x:hidden}.sidebar-tool-header{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:10px;padding-bottom:12px;display:flex}.sidebar-tool-icon{font-size:22px}.sidebar-tool-title{font-size:15px;font-weight:700}.sidebar-tool-desc{color:var(--text3);margin-top:1px;font-size:12px}.sidebar-divider{border:none;border-top:1px solid var(--border);flex-shrink:0;margin:0}.sidebar-actions{border-top:1px solid var(--border);flex-direction:column;flex-shrink:0;gap:7px;margin-top:auto;padding-top:12px;display:flex}.lightbox{z-index:9998;cursor:zoom-out;background:#000000e6;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.lightbox-wrap{cursor:default;flex-direction:column;align-items:center;gap:10px;max-width:92vw;display:flex;position:relative}.lightbox-wrap img{object-fit:contain;border-radius:8px;max-width:90vw;max-height:82vh}.lightbox-label{color:#fff9;font-size:13px}.lightbox-size{color:#fff6;font-size:12px}.lightbox-close{color:#fff;cursor:pointer;background:#ffffff26;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;font-size:14px;transition:background .15s;display:flex;position:absolute;top:-36px;right:-8px}.lightbox-close:hover{background:#ffffff4d}@media (width<=680px){.page-layout{grid-template-columns:1fr}.ctrl-sidebar{border-right:none;border-bottom:1px solid var(--border);height:auto;position:static}}@media (width<=640px){.topnav{padding:0 12px}}.btn{white-space:nowrap;border-radius:8px;align-items:center;gap:6px;padding:9px 18px;font-size:14px;font-weight:500;transition:all .15s;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{filter:brightness(1.1);box-shadow:0 0 16px var(--accent-glow)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;filter:none;box-shadow:none}.btn-ghost{background:var(--bg3);color:var(--text2);border:1px solid var(--border)}.btn-ghost:hover{background:var(--border);color:var(--text)}.btn-danger{color:var(--error);background:#ef44441f;border:1px solid #ef444440}.btn-danger:hover{background:#ef444438}.btn-sm{border-radius:6px;padding:6px 12px;font-size:13px}.btn-lg{border-radius:10px;padding:13px 28px;font-size:16px}.btn-icon{border-radius:6px;padding:7px}.card{background:var(--bg2);border:1px solid var(--border);border-radius:12px}.tag{border-radius:20px;padding:2px 10px;font-size:12px;font-weight:600;display:inline-block}.tag-free{color:var(--success);background:#34d39926}.drop-zone{border:2px dashed var(--border);text-align:center;cursor:pointer;background:var(--bg2);border-radius:12px;padding:48px 32px;transition:all .2s}.drop-zone:hover,.drop-zone.drag-over{border-color:var(--accent);background:var(--card-hover)}.drop-zone .drop-icon{margin-bottom:12px;font-size:48px}.drop-zone h3{color:var(--text);margin-bottom:6px;font-size:18px}.drop-zone p{color:var(--text2);font-size:14px}input[type=range]{-webkit-appearance:none;background:var(--bg3);border-radius:2px;width:100%;height:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);cursor:pointer;border-radius:50%;width:16px;height:16px;transition:transform .15s}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.form-group{flex-direction:column;gap:6px;display:flex}.form-label{color:var(--text2);font-size:13px;font-weight:500}.form-input{background:var(--bg3);border:1px solid var(--border);color:var(--text);border-radius:7px;width:100%;padding:8px 12px;font-size:14px;transition:border-color .2s}.form-input:focus{border-color:var(--accent)}.form-select{background:var(--bg3);border:1px solid var(--border);color:var(--text);appearance:none;cursor:pointer;border-radius:7px;width:100%;padding:8px 12px;font-size:14px}.chip-tabs{flex-wrap:wrap;gap:5px;display:flex}.chip{cursor:pointer;border:1px solid var(--border);color:var(--text2);background:var(--bg3);white-space:nowrap;border-radius:20px;padding:5px 13px;font-size:13px;font-weight:500;transition:all .15s}.chip.active{background:var(--accent);border-color:var(--accent);color:#fff}.chip:hover:not(.active){border-color:var(--text3);color:var(--text)}.toast-stack{z-index:9999;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:24px;right:24px}.toast{background:var(--bg2);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:10px;align-items:center;gap:10px;padding:12px 18px;font-size:14px;display:flex}.toast.success{color:var(--success);border-color:#34d39966}.toast.error{color:var(--error);border-color:#ef444466}.toast.info{color:var(--text)}.toast-enter-active,.toast-leave-active{transition:all .25s}.toast-enter-from,.toast-leave-to{opacity:0;transform:translateY(12px)}.tool-page{flex-direction:column;gap:20px;max-width:1400px;margin:0 auto;padding:24px;display:flex}.tool-header{align-items:center;gap:12px;display:flex}.tool-header .tool-icon{font-size:30px}.tool-header h1{font-size:22px;font-weight:700}.tool-header p{color:var(--text2);margin-top:2px;font-size:13px}.tool-header-actions{align-items:center;gap:8px;margin-left:auto;display:flex}.img-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;display:grid}.img-card{background:var(--bg2);border:1px solid var(--border);border-radius:10px;position:relative;overflow:hidden}.img-card img{object-fit:cover;width:100%;height:140px;display:block}.img-card-info{color:var(--text2);padding:9px 11px;font-size:12px}.img-card-name{color:var(--text);white-space:nowrap;text-overflow:ellipsis;margin-bottom:3px;font-weight:500;overflow:hidden}.img-card-badge{color:#000;background:#34d399e6;border-radius:8px;padding:2px 7px;font-size:11px;font-weight:700;position:absolute;top:7px;right:7px}.img-card-remove{color:#fff;cursor:pointer;opacity:0;background:#0000008c;border:none;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;font-size:12px;transition:opacity .15s;display:flex;position:absolute;top:7px;left:7px}.img-card:hover .img-card-remove{opacity:1}.progress-bar{background:var(--bg3);border-radius:2px;height:4px;overflow:hidden}.progress-fill{background:var(--accent);border-radius:2px;height:100%;transition:width .3s}