:root{color-scheme:light;--blue:#1778ee;--blue-dark:#0c5cc4;--light-blue:#eaf4ff;--ink:#182941;--muted:#64758b;--border:#e0e9f3;--bg:#f6f9fd;--white:#fff;--shadow:0 15px 45px rgba(23,52,91,.055);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-size:14px}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}a{color:inherit;text-decoration:none}a:hover{color:var(--blue)}:focus-visible{outline:3px solid #62b4ff!important;outline-offset:3px}.container{width:min(1360px,calc(100% - 52px));margin-inline:auto}.skip:not(:focus),.sr-only{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}.skip:focus{position:fixed;top:8px;left:8px;background:#fff;padding:12px;z-index:999}.site-header{background:#fff;border-bottom:1px solid var(--border)}.header-inner{min-height:72px;display:flex;align-items:center;gap:35px}.brand{display:flex;align-items:center;gap:5px;font-size:21px;font-weight:800;letter-spacing:-.8px;white-space:nowrap}.brand>span:last-child{color:var(--blue)}.brand-logo{display:inline-grid;place-items:center;background:var(--blue);color:#fff!important;width:33px;height:33px;border-radius:10px;margin-right:5px;font-weight:850;font-size:23px}.header-inner nav{display:flex;gap:13px;align-items:center;color:#6b7c91;font-size:12px}.crumb-separator{color:#a9b4c3}.header-trust{margin-left:auto;font-size:12px;color:#506b80;white-space:nowrap}.trust-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#20b780;margin-right:7px}.hero{padding:48px 0 32px}.eyebrow{color:#1575d9;font-size:11px;letter-spacing:2px;font-weight:800}.hero h1{font-size:clamp(33px,4vw,50px);letter-spacing:-2px;line-height:1.12;margin:14px 0}.hero h1 em{font-style:normal;color:var(--blue)}.hero p{max-width:670px;font-size:15px;line-height:1.8;color:#64748b;margin:0}.hero-flex{display:flex;justify-content:space-between;align-items:end;gap:20px}.hero-stats{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.hero-stats span,.tag{background:#eaf3ff;color:#2675bd;font-size:11px;border-radius:99px;padding:7px 11px;font-weight:650;white-space:nowrap}.workspace{background:#fff;border:1px solid var(--border);border-radius:19px;box-shadow:var(--shadow);overflow:hidden}.workspace-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 23px;border-bottom:1px solid var(--border)}.workspace-title{display:flex;align-items:center;gap:13px}.workspace-symbol{display:grid;place-items:center;background:#e9f3ff;border-radius:14px;font-size:28px;color:var(--blue);width:49px;height:49px}.workspace h2{font-size:19px;letter-spacing:-.5px;margin:0 0 4px}.action-panel p,.export-heading p,.workspace-title p{margin:0;color:var(--muted);font-size:12px}.apply-buttons,.bar-buttons,.empty-actions,.undo-row{display:flex;gap:8px;flex-wrap:wrap}.btn{border:1px solid transparent;border-radius:10px;padding:10px 15px;font-size:12px;font-weight:720;min-height:39px;transition:background .15s,box-shadow .15s}.btn.primary{background:var(--blue);color:#fff}.btn.primary:hover:not(:disabled){background:var(--blue-dark)}.btn.secondary{background:#f1f7ff;color:#1761ae;border-color:#cfe5ff}.btn.ghost{background:#fff;border-color:var(--border);color:#4e647a}.btn:hover:not(:disabled),.mini:hover:not(:disabled){box-shadow:0 3px 12px rgba(21,94,170,.1)}.btn.large{font-size:13px;padding:13px 19px}.editor-grid{display:grid;grid-template-columns:330px minmax(0,1fr);align-items:start}.sidebar{background:#fbfcff;padding:17px;border-right:1px solid var(--border);max-height:1120px;overflow:auto;scrollbar-width:thin}.panel{border:1px solid #e5ecf5;border-radius:13px;padding:16px;background:#fff;margin-bottom:12px}.panel-heading{display:flex;align-items:center;gap:8px;margin-bottom:16px}.panel-heading h3{font-size:13px;letter-spacing:-.2px;margin:0;flex:1}.step{font-size:10px;color:#1a84e8;background:#eaf4ff;border-radius:7px;font-weight:850;padding:6px}.tag{font-size:10px;padding:5px 8px}.mini{border:1px solid #dce7f2;background:#fff;color:#557089;padding:7px 9px;font-size:10px;border-radius:8px;font-weight:700}.dropzone{padding:23px 9px;border:1.5px dashed #bed5ed;background:#f8fbff;border-radius:12px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}.dropzone.active{border-color:#1978f0;background:#e8f4ff}.drop-art{font-size:25px;color:var(--blue);background:#e8f3ff;border-radius:12px;width:47px;height:47px;display:grid;place-items:center;margin-bottom:4px}.dropzone strong{font-size:12px}.dropzone p{margin:0;color:var(--muted);font-size:11px}.dropzone .btn{margin:6px 0}.dropzone small{color:#8290a0;font-size:10px}.file-info{padding:12px 0 0;display:flex;flex-direction:column;gap:5px;font-size:11px}.file-info strong{word-break:break-word}.file-info span{color:var(--muted)}.field-label{display:block;font-size:11px;font-weight:750;margin:0 0 7px}.select{width:100%;padding:10px;border:1px solid #dce5f1;background:#fff;border-radius:9px;color:var(--ink);font-size:12px}.hint{font-size:11px;line-height:1.65;color:#75869a;margin:10px 0 0}.range-group{padding:6px 0 12px}.range-group>div{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px}.range-group label{font-weight:650;font-size:11px}.range-group output{font-weight:750;color:var(--blue);font-size:11px}.range-group input{width:100%;accent-color:var(--blue)}.check{display:flex;align-items:flex-start;gap:9px;margin-top:10px;font-size:11px;font-weight:650;line-height:1.5}.check input{margin-top:1px;accent-color:var(--blue)}.check small{font-weight:400;color:#78899d;display:block}.tool-choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin-top:14px}.tool{border:1px solid #dce5f1;border-radius:9px;padding:9px 2px;background:#fff;color:#52667a;font-size:17px}.tool span{display:block;font-size:10px;margin-top:2px}.tool.selected{background:#edf6ff;border-color:#1a83e9;color:#096bc9}.undo-row{margin-top:12px;gap:5px}.undo-row .btn{flex:1;padding:7px 8px;font-size:10px;min-height:33px}.ai-panel{background:#f5faff}.ai-step{background:#e0ecff}.experimental{color:#7867ab;background:#efeaff}.ai-check{margin-top:0}.main-panel{min-width:0;padding:20px}.preview-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}.action-panel h3,.export-heading h3,.preview-top h3{margin:0;font-size:16px;letter-spacing:-.35px}.preview-top p{color:var(--muted);font-size:11px;margin:5px 0 0}.preview-controls{display:flex;gap:8px;align-items:center}.preview-controls label{font-size:11px;color:var(--muted)}.small-select{padding:6px;border:1px solid var(--border);border-radius:7px;background:#fff}.preview-scroll{background:#e9edf3;min-height:430px;max-height:680px;overflow:auto;border:1px solid #e2e7ee;border-radius:14px;display:flex;align-items:center;justify-content:center;background-image:linear-gradient(45deg,#edf1f6 25%,transparent 25%),linear-gradient(-45deg,#edf1f6 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#edf1f6 75%),linear-gradient(-45deg,transparent 75%,#edf1f6 75%);background-size:22px 22px;background-position:0 0,0 11px,11px -11px,-11px 0;background-color:#fff}.empty{max-width:370px;text-align:center;padding:35px 16px}.empty-picture{height:91px;display:flex;align-items:center;justify-content:center;color:#2c8df0;gap:6px;font-size:53px;filter:drop-shadow(0 4px 11px #c3e0ff)}.empty-picture span:nth-child(2){font-size:84px}.empty h3{font-size:18px;letter-spacing:-.45px;margin:11px 0}.empty p{font-size:12px;color:#718196;line-height:1.6;margin-bottom:18px}.empty-actions{justify-content:center}.stage{position:relative;flex-shrink:0;line-height:0;touch-action:pan-x pan-y;max-width:none}.stage canvas{display:block;width:100%;height:100%}.stage #original-canvas{position:absolute;inset:0}.stage #result-canvas{position:absolute;inset:0;clip-path:inset(0 0 0 50%)}.stage #draw-canvas{position:absolute;inset:0;cursor:crosshair;touch-action:none}.stage .split-line{position:absolute;top:0;bottom:0;width:2px;background:#fff;left:50%;box-shadow:0 0 3px #333;pointer-events:none;z-index:2}.split-line span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;color:var(--blue);border:2px solid var(--blue);width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:17px}.compare-row{display:flex;align-items:center;gap:12px;margin-top:12px;color:#71849a;font-weight:800;font-size:10px;letter-spacing:1px}.compare-row input{flex:1;accent-color:var(--blue)}.status-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 2px;color:#69819a;font-size:11px}.action-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#f2f8ff;border:1px solid #d8e9ff;padding:18px;border-radius:13px;margin:6px 0 13px}.action-panel h3{margin-bottom:6px}.export-panel{border:1px solid var(--border);padding:20px;border-radius:13px}.export-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.export-heading h3{margin-bottom:6px}.download-symbol{display:grid;place-items:center;width:37px;height:37px;border-radius:11px;background:#eaf4ff;color:#1273df;font-size:20px}.export-form{display:flex;gap:9px;align-items:end;flex-wrap:wrap;margin-top:16px}.export-form label{font-size:10px;font-weight:700;color:#5d7186;flex:1;min-width:120px}.export-form .select{display:block;margin-top:7px}.export-form button{min-height:37px}.tips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.tips article{border:1px solid #e6edf6;border-radius:11px;padding:16px}.tips span{font-size:20px;color:var(--blue)}.tips h4{font-size:12px;margin:10px 0 5px}.tips p{color:#6b7c91;font-size:11px;line-height:1.6;margin:0}.alert{padding:13px 17px;background:#fff6f3;color:#9c3925;border-top:1px solid #fbd8ce;font-size:12px}.faq{padding:65px 0 80px}.faq h2{font-size:clamp(24px,3vw,34px);letter-spacing:-1px}.faq-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.faq-grid article{background:#fff;border:1px solid var(--border);padding:20px;border-radius:13px}.faq h3{font-size:13px}.faq p{font-size:12px;line-height:1.8;color:#6e7d90}footer{border-top:1px solid var(--border);background:#fff}.footer-inner{padding:25px 0;display:flex;justify-content:space-between;align-items:center;gap:15px}.footer-inner p,.footer-inner>a:last-child{color:#6a7d90;font-size:12px}.processing{position:fixed;inset:0;z-index:20;background:rgba(13,32,62,.53);backdrop-filter:blur(7px);display:grid;place-items:center;padding:20px}.processing[hidden],[hidden]{display:none!important}.process-card{background:#fff;border-radius:20px;padding:37px;min-width:min(350px,100%);text-align:center;box-shadow:0 25px 80px #0b325a4d}.process-card h2{font-size:23px;margin:17px 0 7px;letter-spacing:-.5px}.process-card p{line-height:1.65;color:#75849a;font-size:12px;margin-bottom:21px}.spinner{height:46px;width:46px;border:4px solid #d9eaff;border-top-color:#1277ee;border-radius:50%;animation:spin .85s linear infinite;margin:auto}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#203b59;color:#fff;border-radius:12px;padding:12px 20px;z-index:30;box-shadow:0 8px 28px #132e4b3b;font-size:12px;max-width:90vw}@media(max-width:1060px){.editor-grid{grid-template-columns:296px minmax(0,1fr)}.sidebar{padding:11px}.main-panel{padding:14px}.tips{grid-template-columns:1fr}.preview-scroll{min-height:350px}.action-panel{flex-direction:column;align-items:stretch}}@media(max-width:760px){.container{width:min(100% - 24px,700px)}.hero{padding-top:28px}.hero-flex{display:block}.hero-stats{justify-content:start;margin-top:17px}.header-trust{display:none}.header-inner{gap:10px}.editor-grid{display:flex;flex-direction:column}.sidebar{max-height:none;width:100%;border-right:0;border-bottom:1px solid var(--border);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.panel{margin:0}.main-panel{width:100%}.preview-scroll{min-height:340px;max-height:560px}.faq-grid{grid-template-columns:repeat(2,1fr)}.workspace-bar{align-items:start;flex-direction:column}.bar-buttons{width:100%}.bar-buttons button{flex:1}}@media(max-width:520px){.brand{font-size:18px}.header-inner nav{font-size:10px}.header-inner{min-height:60px}.hero h1{letter-spacing:-1.2px}.hero-stats span{font-size:10px}.sidebar{grid-template-columns:1fr}.workspace{border-radius:14px}.workspace-bar{padding:14px}.main-panel{padding:11px}.preview-top{align-items:start;flex-direction:column}.preview-controls{width:100%;justify-content:space-between}.preview-scroll{min-height:300px}.export-form{align-items:stretch}.export-form label{min-width:125px}.export-form button{width:100%}.faq-grid{grid-template-columns:1fr}.footer-inner{flex-direction:column}.status-bar{flex-wrap:wrap}.action-panel{padding:14px}.apply-buttons button{flex:1}}@media(prefers-reduced-motion:reduce){*,::after,::before{scroll-behavior:auto!important;transition:none!important;animation-duration:NaNs!important}}.keyboard-paint{margin-top:12px;padding-top:10px;border-top:1px solid #e5edf7;color:#4d647d;font-size:11px}.keyboard-paint summary{cursor:pointer;font-weight:750;padding:7px 0}.point-fields{display:flex;gap:9px;margin:10px 0}.point-fields label{flex:1;min-width:0;font-weight:700}.point-fields input{display:block;width:100%;font:inherit;padding:8px;margin-top:6px;border:1px solid #cfdded;border-radius:8px;color:#263c55}.keyboard-paint .btn{width:100%}.keyboard-paint summary:focus-visible,.point-fields input:focus-visible{outline:3px solid #3d8efa;outline-offset:2px}.tone-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 14px;border:1px solid var(--border);border-radius:13px;padding:10px;margin:10px 0;background:#f8fbff}.tone-grid .range-group{margin:0;min-width:0}.tone-grid label{font-size:12px}.clone-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0}.clone-actions span{font-size:12px;color:var(--muted);line-height:1.4;flex:1 1 120px}#tool-clone.selected{background:#e9efff;border-color:#5a6fe4;color:#273f9b}.workspace-actions{flex-wrap:wrap}@media(max-width:680px){.tone-grid{grid-template-columns:1fr 1fr}.workspace-bar{flex-wrap:wrap;gap:10px}.workspace-actions{display:flex;flex-wrap:wrap;gap:6px}.workspace-actions .btn{max-width:100%}}