:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;color:#292d28;background:#f5f5ef;font-synthesis:none;--green:#375640;--muted:#81867c;--line:#e0e3d8}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #9cbb78;outline-offset:3px}button:disabled{opacity:.35;cursor:default}header{height:87px;padding:0 5%;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:35px}.brand{font-family:Georgia,serif;font-size:42px;letter-spacing:-3px;font-weight:bold;color:#2d4131;text-decoration:none}.brand>span:first-child{font-style:italic}.brand-dot{font-size:12px;margin-left:5px;color:#a3b877;vertical-align:top;line-height:35px}.header-caption{font-size:12px;color:#85897e;letter-spacing:2px}.privacy{margin-left:auto;font-size:12px;color:#64705e;display:flex;align-items:center;gap:8px}.privacy i,.live-dot{width:6px;height:6px;border-radius:50%;background:#819766;display:inline-block}main{max-width:1480px;margin:auto;padding:45px 5% 0}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:33px}.eyebrow{font-size:10px;letter-spacing:2px;color:#838b7b;margin-bottom:15px}h1{font-size:36px;font-weight:500;letter-spacing:-1.4px;margin:0 0 12px}h1 em{font-style:normal;color:#7c8d68}p{line-height:1.7}.intro p{font-size:13px;color:#7e857a;margin:0}.primary{background:var(--green);color:white;padding:15px 24px;border-radius:7px;font-size:13px;transition:background .15s}.primary:hover{background:#253f2d}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 320px;border:1px solid #dce0d3;border-radius:12px;background:#fff;overflow:hidden;box-shadow:0 8px 35px #243b2710}.editor{min-width:0;display:flex;flex-direction:column;background:#fafbf7}.editor-toolbar{height:58px;background:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 22px;font-size:12px;border-bottom:1px solid var(--line)}.editor-toolbar>div:first-child{display:flex;align-items:center;gap:9px;min-width:0}#filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:250px}.toolbar-actions{display:flex;gap:12px}.toolbar-actions button{font-size:12px;color:#66705f;padding:6px}.toolbar-actions button[aria-pressed=false]{opacity:.5}.stage{position:relative;min-height:440px;flex:1;display:flex;align-items:center;justify-content:center;padding:35px 35px 44px;background-color:#e9ece3;background-image:radial-gradient(#bfc8b8 0.65px,transparent .65px);background-size:14px 14px;overflow:hidden}.canvas-wrap{position:relative;width:100%;max-width:780px;line-height:0;box-shadow:0 12px 28px #293a2720}canvas{width:100%;height:auto;display:block;touch-action:none}#overlay{position:absolute;inset:0;pointer-events:none}.stage-label,.dimensions{position:absolute;bottom:15px;font-size:9px;color:#7b8671;letter-spacing:1px}.stage-label{left:22px}.dimensions{right:22px}#drop-hint{display:none;position:absolute;inset:15px;border:2px dashed #617e4a;border-radius:8px;background:#eff5e9ed;align-items:center;justify-content:center;color:#375640;font-size:20px;z-index:3}.stage.dragging #drop-hint{display:flex}.editor-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 22px;font-size:11px;color:#79836e;border-top:1px solid var(--line);background:white}.editor-footer button{font-size:11px;padding:8px 12px;border:1px solid var(--line);border-radius:5px;color:#4f6048;white-space:nowrap}.notes{display:flex;justify-content:space-between;padding:21px 30px;color:#8b9481;font-size:10px;letter-spacing:.6px}aside{border-left:1px solid var(--line);padding:24px 23px}.panel-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}h2{font-size:16px;font-weight:600;margin:0}.panel-title>span{font-size:8px;letter-spacing:1px;color:#9aa38f}.mode-switch{background:#f0f2eb;padding:4px;display:flex;border-radius:7px}.mode-switch button{flex:1;font-size:12px;padding:10px 4px;border-radius:5px;color:#8a9181}.mode-switch .active{background:white;color:#375640;box-shadow:0 2px 5px #263d2510}.hint{font-size:11px;color:#8b9381;margin:12px 0 22px}.control-section{border-top:1px solid var(--line);padding-top:20px;margin-top:18px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}h3{margin:0;font-size:12px;font-weight:600}h3>span{font-size:10px;color:#9ca68f;margin-right:8px}.text-button{font-size:10px;color:#7c8a6e;padding:3px 0}.text-button:hover{color:#2e5033}.point-legend{display:flex;align-items:center;margin-bottom:20px;font-size:10px;color:#818e73}.point-legend>span{white-space:nowrap}.point-legend b{display:inline-flex;align-items:center;justify-content:center;border:1px solid #b8c6a7;width:20px;height:20px;border-radius:50%;margin-right:5px;font-size:9px;font-weight:400}.legend-line{border-top:1px dashed #cbd3c1;flex:1;margin:0 8px}.slider-label{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin:20px 0 10px}output{font-size:10px;background:#eff3e9;color:#61754c;padding:4px 7px;border-radius:4px;font-variant-numeric:tabular-nums}input[type=range]{width:100%;height:4px;accent-color:#657d4f;cursor:pointer;display:block;margin:12px 0 13px}.range-ends{display:flex;justify-content:space-between;font-size:9px;color:#9da491}.micro{font-size:10px;color:#9aa28e;line-height:1.7;margin:12px 0 0}.mask-controls{border-top:1px solid var(--line);padding-top:20px;margin-top:20px}.brush-tools{display:flex;gap:5px}.brush-tools button{font-size:10px;border:1px solid var(--line);padding:6px;border-radius:4px}.brush-tools .active{background:#eaf0df;border-color:#b1c397}.export-area{border-top:1px solid var(--line);margin-top:24px;padding-top:20px}.export-meta{display:flex;justify-content:space-between;font-size:9px;color:#919b85;margin-bottom:12px}.export-button{width:100%;display:flex;justify-content:space-between}.export-area .micro{text-align:center}footer{display:flex;align-items:center;justify-content:space-between;padding:24px 0;color:#919984;font-size:9px;letter-spacing:.5px}footer>span:last-child{font-size:8px;letter-spacing:1.5px}[hidden]{display:none!important}@media(min-width:1400px){.stage{min-height:550px}}@media(max-width:900px){main{padding:30px 22px 0}.workspace{grid-template-columns:minmax(0,1fr) 290px}.stage{padding:25px 20px 40px}.header-caption{display:none}aside{padding:22px 18px}.editor-footer{flex-direction:column;align-items:flex-start}.toolbar-actions span{display:none}}@media(max-width:700px){header{height:70px;padding:0 22px}.brand{font-size:35px}.privacy{font-size:10px}.intro{align-items:flex-start;gap:15px}h1{font-size:28px;line-height:1.4}.intro p{font-size:11px}.intro .primary{padding:12px;white-space:nowrap;margin-top:22px}.workspace{grid-template-columns:1fr}.stage{min-height:330px}.editor-footer{flex-direction:row;align-items:center}.editor-footer>span{max-width:55%;line-height:1.7}aside{border-left:0;border-top:1px solid var(--line);padding:24px}.notes{display:none}footer>span:last-child{display:none}#filename{max-width:185px}.panel-title>span{font-size:9px}}

.generate-mask{width:100%;border:1px solid #b1c397;border-radius:5px;background:#eef3e6;padding:9px;font-size:11px;color:#446039;margin-bottom:10px}.selection-info{font-size:11px;line-height:1.8;padding:10px;background:#f2f5ec;border-radius:5px;color:#637750;margin:0 0 12px}.selection-info.empty{background:#fff3dd;color:#8b662a}
/* Keep the image near the controls when the precision panel grows taller. */
.editor{align-self:start}.stage{flex:none}

.brand{font-family:inherit;font-size:25px;letter-spacing:-1px}.preferences{margin-left:auto;display:flex;gap:8px;align-items:center}.preferences select,.preferences button{border:1px solid var(--line);background:transparent;color:inherit;border-radius:5px;padding:8px;font-size:11px}.privacy{margin-left:12px}.quick-guide{font-size:11px;line-height:1.9;background:#eff3e8;border:1px solid var(--line);padding:12px;border-radius:6px;margin-top:15px}.quick-guide strong{display:block;margin-bottom:4px}.quick-guide ol{padding-left:18px;margin:0}html[data-theme=dark]{color-scheme:dark;--line:#3b443b;--green:#58764c;background:#171d19;color:#e0e8db}html[data-theme=dark] .workspace,html[data-theme=dark] aside,html[data-theme=dark] .editor-toolbar,html[data-theme=dark] .editor-footer{background:#222b24}html[data-theme=dark] .editor{background:#1d251f}html[data-theme=dark] .stage{background-color:#30392e;background-image:radial-gradient(#495544 .65px,transparent .65px)}html[data-theme=dark] .mode-switch,html[data-theme=dark] .quick-guide,html[data-theme=dark] .selection-info,html[data-theme=dark] output{background:#303d2b;color:#c8dab7}html[data-theme=dark] .mode-switch .active,html[data-theme=dark] .generate-mask{background:#425537;color:#e0ecd5}html[data-theme=dark] .brand{color:#d9e5d1}html[data-theme=dark] .selection-info.empty{background:#4b3c25;color:#eed6a3}@media(max-width:1000px){.privacy{display:none}}@media(max-width:500px){.brand{font-size:20px}.preferences{gap:4px}.preferences select,.preferences button{padding:6px}}

.preset-label{font-size:11px;color:var(--muted);margin-bottom:10px}.presets{display:flex;gap:6px}.presets button{flex:1;border:1px solid var(--line);border-radius:6px;padding:10px 3px;font-size:12px}.presets small{display:block;font-size:9px;color:#89947d;margin-top:5px;white-space:nowrap}.presets button[aria-pressed=true]{background:#e9f0de;border-color:#7d9765;color:#375640}html[data-theme=dark] .presets button[aria-pressed=true]{background:#425537;color:#e0ecd5}
