:root{--bg:#f7f7fa;--paper:#fff;--ink:#25252f;--muted:#8a8a98;--sub:#656573;--line:#eaeaf0;--accent:#6b58d8;--accent-dark:#5845bf;--accent-soft:#f0edfc;--green:#66a88b;--radius:16px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;color:var(--ink);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);font-size:14px;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #b5a9f3;outline-offset:4px}button,select{touch-action:manipulation}button{border:0;background:none}[hidden]{display:none!important}.icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-definitions{width:0;height:0;position:absolute;overflow:hidden}.site-header{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(32px,calc((100vw - 1376px)/2));background:rgba(255,255,255,.75)}.brand{display:flex;align-items:center;gap:12px}.brand-mark{display:grid;place-items:center;width:34px;height:34px;background:var(--accent);color:white;border-radius:10px;box-shadow:0 3px 7px #6b58d818}.brand-mark .icon{width:26px;height:26px;stroke-width:1.5}.brand strong{font-size:22px;font-weight:650;letter-spacing:2px}.brand-divider{height:17px;width:1px;background:#dedee6;margin:0 4px}.brand-en{font-size:10px;font-weight:600;letter-spacing:2px;color:#777783}.local-badge{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--sub);background:#fff;border:1px solid var(--line);padding:7px 11px;border-radius:6px}.status-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--green);flex-shrink:0}main{max-width:1440px;margin:auto;padding:0 32px}.intro{padding:37px 0 29px;display:flex;justify-content:space-between;align-items:flex-end;gap:20px}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:600;color:var(--accent);margin:0 0 11px}h1{font-size:32px;letter-spacing:.5px;line-height:1.4;margin:0 0 9px;font-weight:650}.intro-copy{color:var(--sub);font-size:13px;margin:0;line-height:1.7}.workflow{display:flex;align-items:center;gap:15px;padding-bottom:5px;white-space:nowrap;color:var(--sub);font-size:11px}.workflow span{display:flex;align-items:center;gap:7px}.workflow b{font:500 10px ui-monospace,SFMono-Regular,monospace;background:#ececf3;border:1px solid #e6e6ee;border-radius:5px;width:23px;height:23px;display:grid;place-items:center;color:#8c8c9b}.workflow .icon{width:11px;height:11px;color:#bcbcc6}.workspace{display:grid;grid-template-columns:298px minmax(0,1fr);gap:22px;align-items:start}.controls{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 4px 14px #22223802;overflow:hidden}.control-section{padding:21px}.control-section+.control-section{border-top:1px solid var(--line)}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px;min-height:22px}.section-title h2{font-size:13px;font-weight:600;margin:0}.tiny-label{font:500 9px ui-monospace,monospace;letter-spacing:1.6px;color:#a0a0ac}.dropzone{border:1px dashed #d9d6e7;background:#faf9fd;position:relative;width:100%;height:187px;border-radius:10px;padding:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:border-color .2s,background .2s}.dropzone>img{height:100%;width:100%;object-fit:contain;border-radius:4px;mix-blend-mode:multiply}.drop-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;background:#f7f5f4e8;color:var(--accent-dark);opacity:0;transition:opacity .2s;font-size:12px}.dropzone:hover .drop-overlay,.dropzone:focus-visible .drop-overlay,.dropzone.dragover .drop-overlay{opacity:1}.dropzone.dragover{border-color:var(--accent);background:var(--accent-soft)}.sample-chip{position:absolute;right:9px;top:9px;border:1px solid #eeedf3;color:#95909f;background:#fffc;padding:4px 6px;border-radius:4px;font-size:9px;letter-spacing:.4px}.file-info{display:flex;align-items:center;gap:10px;margin:14px 0 16px;min-width:0}.file-info>.icon{width:16px;height:16px;color:#9993ac}.file-info>div{min-width:0}.file-info p{font-size:12px;font-weight:500;margin:0 0 3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}.file-info span{font:10px ui-monospace,monospace;color:#9897a5}.source-actions{display:flex;align-items:center;justify-content:space-between;gap:9px}.button{min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:7px;font-size:12px;font-weight:500;transition:background .15s,box-shadow .15s,transform .15s}.button:hover:not(:disabled){transform:translateY(-1px)}.secondary{background:#fff;border:1px solid #e1dfea;padding:0 14px;box-shadow:0 2px 2px #22223803}.secondary:hover{background:#f7f6fc;border-color:#c9c3e2}.button .icon{width:15px;height:15px}.text-button{font-size:11px;color:var(--accent);padding:7px 0}.text-button:hover{text-decoration:underline;text-underline-offset:3px}.file-help{color:#a1a0ad;font-size:10px;letter-spacing:.1px;margin:11px 0 0}.icon-button{display:grid;place-items:center;padding:3px;color:#a19cab;border-radius:4px}.icon-button:hover{color:var(--accent);background:var(--accent-soft)}.icon-button .icon{width:14px;height:14px}.field-label,.range-heading label{font-size:12px;color:#62616f}.select-wrap{position:relative}.select-wrap select{width:100%;appearance:none;background:#fff;border:1px solid #e7e5ee;border-radius:7px;color:#575361;padding:10px 32px 10px 11px;font-size:11px;cursor:pointer;min-height:38px}.select-wrap>.icon{position:absolute;right:12px;top:50%;transform:translateY(-50%) rotate(90deg);width:12px;height:12px;pointer-events:none;color:#95909e}.field-label+.select-wrap{margin-top:9px}.range-heading{margin-top:21px;display:flex;align-items:center;justify-content:space-between}.range-heading output{color:#635e75;font:11px ui-monospace,SFMono-Regular,monospace;background:#f7f6fa;border:1px solid #eeecf3;border-radius:4px;min-width:42px;text-align:center;padding:4px 6px}.range-heading output span{color:#a49caf;font-size:9px}input[type=range]{width:100%;height:20px;margin:10px 0 0;appearance:none;background:transparent;cursor:pointer;--range-fill:27%}input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:3px;background:linear-gradient(to right,var(--accent) var(--range-fill),#eae7f2 var(--range-fill))}input[type=range]::-webkit-slider-thumb{appearance:none;width:13px;height:13px;background:#fff;border:2.5px solid var(--accent);border-radius:50%;margin-top:-4.5px;box-shadow:0 1px 4px #6b58d82b}input[type=range]::-moz-range-track{height:4px;border-radius:3px;background:#eae7f2}input[type=range]::-moz-range-progress{height:4px;background:var(--accent)}input[type=range]::-moz-range-thumb{width:9px;height:9px;background:#fff;border:2px solid var(--accent);border-radius:50%}.range-labels{display:flex;justify-content:space-between;font-size:10px;color:#aaa5b3;margin-top:2px}details{margin-top:19px;border-top:1px solid #f0eef5;padding-top:2px}summary{cursor:pointer;list-style:none;font-size:11px;color:#87818e;padding:13px 0;display:flex;align-items:center;justify-content:space-between}summary::-webkit-details-marker{display:none}summary>.icon{width:12px;height:12px;transform:rotate(90deg);transition:transform .15s}details[open] summary>.icon{transform:rotate(-90deg)}.advanced-content{padding-bottom:14px}.advanced-content .range-heading{margin-top:7px}.setting-hint{font-size:10px;line-height:1.6;color:#a19aa9;margin:5px 0 13px}.switch-row{display:flex;align-items:center;gap:10px;position:relative;cursor:pointer;font-size:12px;color:#62616f;margin-top:19px}.switch-row>span:first-child{flex:1}.switch-row input{position:absolute;right:0;opacity:0;width:32px;height:20px}.switch{width:29px;height:17px;border-radius:10px;background:#ddd9e6;transition:background .15s;position:relative}.switch:after{content:"";width:13px;height:13px;border-radius:50%;position:absolute;top:2px;left:2px;background:white;box-shadow:0 1px 3px #0002;transition:transform .15s}.switch-row input:checked+.switch{background:var(--accent)}.switch-row input:checked+.switch:after{transform:translateX(12px)}.switch-row input:focus-visible+.switch{outline:3px solid #b5a9f3;outline-offset:3px}.generate-button{width:100%;min-height:43px;margin-top:4px;font-size:12px;gap:9px}.primary{color:white;background:var(--accent);box-shadow:0 3px 6px #6b58d81c}.primary:hover:not(:disabled){background:var(--accent-dark);box-shadow:0 4px 9px #6b58d830}.button-arrow{margin-left:auto;font-size:16px;opacity:.7}.generate-button>.icon{margin-left:12px}.generate-button>.button-arrow{margin-right:10px}.local-note{font-size:10px;display:flex;align-items:center;justify-content:center;gap:5px;color:#a09aaa;margin:12px 0 0}.local-note>.icon{width:11px;height:11px}.error-message{font-size:11px;line-height:1.7;color:#ad4545;background:#fff3f1;border:1px solid #f7dcd5;border-radius:6px;padding:10px;margin:0 0 12px}.result-panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);min-width:0;overflow:hidden;box-shadow:0 4px 14px #22223802}.result-toolbar{min-height:67px;display:flex;align-items:center;justify-content:space-between;padding:12px 22px;gap:10px;border-bottom:1px solid var(--line)}.tabs{display:flex;gap:3px;padding:3px;background:#f3f3f7;border:1px solid #eeeeF4;border-radius:8px}.tab{display:flex;align-items:center;gap:6px;border-radius:5px;padding:8px 13px;font-size:11px;white-space:nowrap;color:#8d8798;min-height:32px}.tab .icon{width:14px;height:14px}.tab.active{color:#61517d;background:#fff;box-shadow:0 1px 4px #36304c12;font-weight:500}.tab:hover:not(.active){color:#61517d;background:#eceaf3}.result-badge{display:flex;align-items:center;gap:6px;color:#9891a0;font-size:10px;white-space:nowrap}.result-badge.dirty{color:#b18b3e}.result-badge.dirty .status-dot{background:#d1ab58}.preview-panel{position:relative;height:567px;background-color:#fafafd;background-image:radial-gradient(#dad7e5 .65px,transparent .65px);background-size:12px 12px;display:flex;flex-direction:column}.canvas-caption{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 6px;z-index:1;flex-shrink:0}.canvas-caption>span{font:9px ui-monospace,SFMono-Regular,monospace;letter-spacing:.5px;color:#9992a2}.background-toggle{display:flex;align-items:center;gap:6px;font-size:10px;color:#9b94a4;border-radius:5px;padding:5px;background:#fafafd}.background-toggle[aria-pressed=true]{background:var(--accent-soft);color:var(--accent)}.checker-swatch{width:12px;height:12px;background-color:white;background-image:conic-gradient(#d3cedf 25%,transparent 0 50%,#d3cedf 0 75%,transparent 0);background-size:6px 6px;border:1px solid #ccc6d7;border-radius:2px}.canvas-scroll{flex:1;min-height:0;min-width:0;display:flex;overflow:auto;padding:16px 24px 18px}.artboard{flex-shrink:0;margin:auto;background:#fff;box-shadow:0 2px 10px #35304409,0 0 0 1px #eeedf3;width:370px;height:426px}.artboard img{display:block;width:100%;height:100%;object-fit:contain}.preview-panel.transparent .artboard{background-color:white;background-image:conic-gradient(#e9e6ee 25%,transparent 0 50%,#e9e6ee 0 75%,transparent 0);background-size:16px 16px}.canvas-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 20px 14px;flex-shrink:0}.canvas-bottom>span{font:9px ui-monospace,SFMono-Regular,monospace;color:#a29aaa;letter-spacing:.3px}.zoom-controls{display:flex;align-items:center;padding:2px;border:1px solid #e5e1ec;border-radius:5px;background:#fff;box-shadow:0 1px 2px #29223403}.zoom-controls button{width:25px;height:23px;display:grid;place-items:center;border-radius:3px;font-size:17px;color:#8b8297}.zoom-controls button:hover{background:var(--accent-soft);color:var(--accent)}.zoom-controls button .icon{width:11px;height:11px}.zoom-controls>span#zoom-value{font:10px ui-monospace,monospace;color:#887e94;text-align:center;min-width:45px}.zoom-separator{width:1px;height:12px;background:#e8e3ed;margin:0 2px}.comparison{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:10px 24px 20px;gap:17px}.comparison figure{margin:0;min-width:0;display:flex;flex-direction:column;min-height:0}.comparison figcaption{text-align:center;font-size:10px;color:#9b92a5;margin:0 0 9px}.comparison img{width:100%;min-height:0;flex:1;object-fit:contain;background:white;border:1px solid #f0edf3;border-radius:3px}.empty-state{position:absolute;inset:60px 20px 60px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#fafafd}.empty-icon{width:58px;height:58px;display:grid;place-items:center;border:1px solid #e8e1f2;background:#f4f0fb;border-radius:17px;color:#a597c5}.empty-icon .icon{width:29px;height:29px;stroke-width:1.2}.empty-state h3,.processing-card h3{font-size:16px;font-weight:500;margin:19px 0 7px}.empty-state p,.processing-card p{font-size:12px;color:#9d93a8;line-height:1.8;text-align:center;margin:0}.processing-state{position:absolute;inset:0;background:#fafafde8;backdrop-filter:blur(7px);z-index:5;display:grid;place-items:center}.processing-card{text-align:center;padding:20px}.processing-card .text-button{margin-top:17px}.spinner{display:block;width:34px;height:34px;border:2px solid #e7e1f4;border-top-color:var(--accent);border-radius:50%;margin:auto;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.download-bar{padding:19px 22px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid var(--line);min-height:85px}.result-summary{display:flex;align-items:center;gap:10px;min-width:0}.summary-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#f6f4fb;color:#a295bc;flex-shrink:0}.result-summary strong{font-size:11px;font-weight:500;line-height:1.6}.result-summary p{font-size:10px;color:#a29aa9;margin:3px 0 0;line-height:1.6}.download-actions{display:flex;gap:8px;align-items:center;flex-shrink:0}.download-actions select{font-size:10px;min-width:110px;padding:11px 24px 11px 10px}.download-actions .select-wrap>.icon{right:8px;width:10px;height:10px}.download-button{background:#2e2a3b;color:#fff;padding:0 15px;min-height:38px;white-space:nowrap;font-size:11px}.download-button:hover:not(:disabled){background:#4b405f}.download-button>.icon{width:13px;height:13px}.page-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 1px 26px;font-size:10px;color:#a8a2b1;line-height:1.6}.page-footer p{margin:0;display:flex;align-items:center;gap:7px}.footer-dot{width:4px;height:4px;background:#b9b1c8;border-radius:50%}.footer-brand{font:8px ui-monospace,monospace;letter-spacing:.6px;color:#b9b2c1;margin-left:16px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#2e293d;color:white;padding:12px 20px;border-radius:9px;box-shadow:0 5px 22px #20182f26;font-size:12px;z-index:20;max-width:calc(100vw - 32px);text-align:center;line-height:1.6}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1500px){.intro{padding-top:44px;padding-bottom:34px}.preview-panel{height:608px}.dropzone{height:217px}.control-section{padding:23px}.workspace{grid-template-columns:316px minmax(0,1fr)}}
@media(max-width:1100px){.workflow{display:none}.workspace{grid-template-columns:270px minmax(0,1fr);gap:18px}.control-section{padding:18px}.result-toolbar{padding:12px 15px}.tab{padding:8px 10px}.download-bar{padding:17px;flex-wrap:wrap}.result-summary{flex:1;min-width:180px}.download-actions{margin-left:auto}.preview-panel{height:555px}.footer-brand{display:inline}}
@media(max-width:760px){.site-header{height:66px;padding:0 20px}.brand{gap:10px}.brand strong{font-size:20px}.brand-en{font-size:9px;letter-spacing:1.5px}.brand-divider{margin:0 1px}.brand-mark{width:31px;height:31px;border-radius:9px}.local-badge{font-size:10px;padding:6px 8px}main{padding:0 18px}.intro{padding:28px 2px 23px}h1{font-size:28px}.eyebrow{font-size:9px;letter-spacing:1.4px}.intro-copy{font-size:12px}.workspace{display:flex;flex-direction:column;gap:18px}.controls,.result-panel{width:100%}.controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.control-section{padding:17px}.control-section+.control-section{border-top:0;border-left:1px solid var(--line)}.source-actions{flex-wrap:wrap;justify-content:flex-start;gap:5px 15px}.dropzone{height:168px}.file-info p{max-width:100%;font-size:11px}.file-info span{font-size:9px}.file-help{font-size:9px;line-height:1.7}.file-info{gap:6px}.file-info>.icon{display:none}.section-title{margin-bottom:13px}.range-heading{margin-top:18px}.generate-button{font-size:11px;gap:6px;min-height:42px}.generate-button>.icon{margin-left:3px;width:13px;height:13px}.generate-button>.button-arrow{display:none}.local-note{font-size:9px}.preview-panel{height:565px}.result-toolbar{min-height:64px}.page-footer{flex-direction:column;align-items:flex-start;gap:6px;padding:20px 2px}.result-panel{scroll-margin-top:15px}}
@media(max-width:440px){.site-header{padding:0 16px}.brand-en{font-size:8px;letter-spacing:1px}.local-badge{border:0;background:none;padding:0;font-size:9px}.brand-divider{display:none}.brand{gap:9px}main{padding:0 14px}.intro{padding-top:24px}h1{font-size:26px}.controls{display:block}.control-section{padding:18px}.control-section+.control-section{border-left:0;border-top:1px solid var(--line)}.source-section{display:grid;grid-template-columns:112px minmax(0,1fr);column-gap:16px}.source-section .section-title{grid-column:1/-1}.dropzone{height:136px;grid-column:1;grid-row:2/5;padding:7px}.sample-chip{font-size:8px;right:5px;top:5px;padding:2px 4px}.file-info{grid-column:2;margin:7px 0 8px;align-self:start}.source-actions{grid-column:2;display:flex;flex-direction:column;align-items:flex-start;gap:0}.source-actions .button{min-height:33px;font-size:11px;padding:0 12px}.source-actions .text-button{font-size:10px;padding:8px 0}.file-help{grid-column:2;margin:3px 0 0;max-width:180px}.drop-overlay{flex-direction:column;font-size:9px}.settings-section{display:grid;grid-template-columns:1fr 1fr;column-gap:18px}.settings-section>.section-title{grid-column:1/-1}.settings-section>.field-label{grid-column:1;grid-row:2;align-self:center}.settings-section>.select-wrap{grid-column:1;grid-row:3;margin-top:8px}.settings-section>.range-heading{grid-column:2;grid-row:2;margin:0}.settings-section>input[type=range]{grid-column:2;grid-row:3;margin-top:14px}.settings-section>.range-labels{grid-column:2;grid-row:3;align-self:end;margin-bottom:-1px;font-size:9px}.settings-section>details,.settings-section>.generate-button,.settings-section>.local-note,.settings-section>.error-message{grid-column:1/-1}.settings-section>details{margin-top:18px}.settings-section .select-wrap select{font-size:10px;padding-left:8px}.generate-button{min-height:43px;font-size:12px}.generate-button>.icon{width:15px;height:15px}.generate-button>.button-arrow{display:block}.generate-button>.icon{margin-left:11px}.local-note{font-size:10px}.result-toolbar{padding:11px 10px;gap:5px}.tabs{gap:1px}.tab{padding:7px 8px;font-size:10px;gap:4px}.tab .icon{width:12px;height:12px}.result-badge{font-size:9px;gap:4px}.preview-panel{height:468px}.canvas-caption{padding:12px 13px 5px}.canvas-caption>span{font-size:8px}.background-toggle{font-size:9px;gap:4px}.canvas-scroll{padding:13px 16px}.canvas-bottom{padding:9px 13px 12px}.comparison{padding:10px 12px;gap:9px}.download-bar{padding:16px;gap:13px}.result-summary{width:100%}.download-actions{width:100%;margin:0}.download-actions .select-wrap{flex:1}.download-actions select{font-size:11px}.download-button{flex:1;font-size:12px}.empty-state p{font-size:11px;max-width:230px}.intro-copy{font-size:11px}.range-labels{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition:none!important;scroll-behavior:auto!important}}

.result-view-actions{display:flex;align-items:center;gap:10px}
#preview-format{min-height:26px;padding:4px 23px 4px 9px;font-size:10px}
#preview-format-control>.icon{right:7px;width:10px;height:10px}
.canvas-caption{flex-wrap:wrap;gap:4px 8px}
.canvas-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;margin-left:auto}
.canvas-actions .icon,#points-toggle .icon{width:13px;height:13px}
.artboard{position:relative}
.compare-artboard{position:relative;flex:1;min-height:0;overflow:hidden;background:white;border:1px solid #f0edf3;border-radius:3px}
.compare-artboard #compare-result{display:block;height:100%;border:0}
.vector-points{position:absolute;inset:0;width:100%;height:100%;fill:none;overflow:visible;pointer-events:none}
.artboard .overlay-original,.artboard.overlay #result-image{position:absolute;inset:0;object-fit:fill}

.artboard.swipe{--compare-position:50%}
.artboard.swipe #result-image,.artboard.swipe .vector-points{clip-path:inset(0 0 0 var(--compare-position))}
.compare-wipe{position:absolute;inset:0;z-index:1;--compare-handle-size:32px}
#compare-position{display:block;width:calc(100% + var(--compare-handle-size));height:100%;margin:0 calc(var(--compare-handle-size) / -2);padding:0;opacity:0;cursor:ew-resize;touch-action:pan-y}
#compare-position::-webkit-slider-runnable-track{height:100%}
#compare-position::-webkit-slider-thumb{width:var(--compare-handle-size);height:100%;margin:0;border:0}
#compare-position::-moz-range-track{height:100%}
#compare-position::-moz-range-thumb{width:var(--compare-handle-size);height:100%;border:0}
.compare-divider{position:absolute;top:0;bottom:0;left:var(--compare-position);width:2px;transform:translateX(-50%);background:white;box-shadow:0 0 3px #24203199;pointer-events:none}
.compare-divider .icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--compare-handle-size);height:var(--compare-handle-size);padding:7px;border:1px solid #e5e1ec;border-radius:50%;background:white;color:var(--accent-dark);box-shadow:0 1px 5px #24203140}
#compare-position:focus-visible+.compare-divider .icon{outline:3px solid #b5a9f3;outline-offset:3px}

/* Global simplification extends the existing controls and preview layers. */
.simplification-settings{grid-column:1/-1;margin-top:18px;padding-top:1px;border-top:1px solid var(--line)}
.simplification-settings .range-heading{margin-top:15px}
.simplification-settings .switch-row{margin-top:13px;font-size:11px}
.simplification-settings .setting-hint{margin-top:7px;margin-bottom:8px}
.simplification-stats{margin-top:5px;font-size:11px;line-height:1.6;color:#6c5b8c}
.simplification-stats strong{font-weight:600}.simplification-stats small{display:block;font-size:10px;color:#92849f}
.artboard .contour-reference{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}
.artboard.contour-mode #result-image{position:absolute;inset:0;object-fit:fill}
.canvas-actions{flex-wrap:wrap;min-width:0;max-width:100%}
@media(max-width:440px){.canvas-actions{gap:3px}.canvas-caption{align-items:flex-start}.canvas-caption>span{width:100%}.canvas-actions{margin-left:0;width:100%;justify-content:flex-end}.simplification-settings .range-labels{margin-bottom:0}}

.ai-option{display:flex;align-items:flex-start;gap:10px;margin-top:18px;padding:14px;border:1px solid #ded9ec;border-radius:12px;background:#faf8ff;cursor:pointer}
.ai-option input{margin-top:3px;accent-color:#6943c7;flex:none}.ai-option strong{font-size:14px}.ai-option small{display:block;margin-top:5px;color:#777184;font-size:12px;line-height:1.6}
.ai-preview{padding:20px;min-width:0}.ai-preview-image{display:flex;justify-content:center;align-items:center;min-height:300px;height:min(55vh,560px);background:#f5f4f8;border-radius:12px;overflow:hidden}.ai-preview-image img{max-width:100%;max-height:100%;object-fit:contain}.ai-preview-actions{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 2px 0}.ai-preview-actions p{margin:5px 0 0;color:#777184;font-size:13px;line-height:1.5}.ai-buttons{display:flex;gap:10px;flex-wrap:wrap}.ai-buttons .button{white-space:nowrap}@media(max-width:760px){.ai-preview{padding:14px}.ai-preview-image{height:45vh;min-height:240px}.ai-preview-actions{align-items:stretch;flex-direction:column}.ai-buttons .button{flex:1}}

.ai-preview{flex:1;min-height:0;display:flex;flex-direction:column}.ai-preview-image{flex:1;min-height:0;height:auto}.ai-preview-actions{padding:18px 20px;border-top:1px solid var(--line)}.ai-buttons .primary{padding:0 16px;min-height:42px}.ai-buttons .secondary{min-height:42px}@media(max-width:760px){.ai-preview-actions{padding:16px}.ai-buttons .button{min-width:0}.source-section .ai-option{grid-column:1/-1}}

.ai-generate{width:100%;margin-top:10px;min-height:40px;border-color:#bdb0e9;color:#5d43a6;font-weight:600}.ai-generate:not(:disabled):hover{background:#f1edfc}.ai-generate:disabled{color:#92909d;background:#f4f3f6;border-color:#e6e4ea;opacity:1}.source-section .ai-generate{grid-column:1/-1}#swipe-toggle{border:1px solid #c5b9e2;border-radius:7px;padding:7px 10px;background:#fff;color:#5e4993;box-shadow:0 1px 3px #2d1d4a12}#swipe-toggle:hover:not(:disabled){background:#f2eefd;border-color:#9681c5}#swipe-toggle[aria-pressed=true]{background:#eee8fc;border-color:#8f78c4;color:#503697}.ai-buttons{justify-content:flex-end}

@media(max-width:440px){.settings-section>.ai-feature{grid-column:1/-1}}

.control-column{min-width:0}.ai-card{margin-top:16px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 4px 14px #22223802;padding:21px}.ai-card .section-title{margin-bottom:8px}.ai-energy,.ai-hint{font-size:11px;line-height:1.6;color:var(--sub);margin:0}.ai-hint{margin-top:10px}.ai-card .ai-generate{margin-top:12px}@media(max-width:760px){.control-column{width:100%}.ai-card{padding:17px}}

.ai-energy{display:flex;align-items:center;gap:3px}.energy-icon{width:15px;height:15px;fill:#e9aa09;flex-shrink:0}

.anchor-slider{display:flex;align-items:center;gap:10px;margin-top:10px}.anchor-slider span{font-size:10px;color:#87818e;white-space:nowrap}.anchor-slider input[type=range]{flex:1;min-width:0;margin:0}

.error-message { white-space: pre-line; }