:root{color:#1c2426;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#f6f4ef;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{border:0}.app-shell{flex-direction:column;min-height:100vh;display:flex}.topbar{color:#f8f5ed;background:#253331;border-bottom:1px solid #15211f;justify-content:space-between;align-items:center;gap:20px;min-height:76px;padding:14px 20px;display:flex}.topbar h1,.topbar p,.preview-header h2,.preview-header p{margin:0}.topbar h1{font-size:21px;font-weight:760;line-height:1.2}.topbar p{color:#cbd7d3;margin-top:5px;font-size:13px}.upload-button,.download-button,.clear-button,.mask-actions button,.display-toggles button,.segmented button,.tool-button{cursor:pointer;border-radius:6px;justify-content:center;align-items:center;gap:8px;min-height:38px;transition:background .14s,color .14s,border-color .14s;display:inline-flex}.upload-button{color:#1f2927;white-space:nowrap;background:#f7c65c;padding:0 14px;font-weight:720;position:relative}.upload-button input{opacity:0;cursor:pointer;position:absolute;inset:0}.workspace{flex:1;grid-template-columns:340px minmax(0,1fr);min-height:0;display:grid}.panel{background:#fbfaf6;border-right:1px solid #d2d5ce;padding:14px;overflow:auto}.panel-section{border-bottom:1px solid #e1e2dc;padding:14px 0}.panel-section:first-child{padding-top:0}.section-title{text-transform:uppercase;color:#52615d;align-items:center;gap:8px;margin-bottom:10px;font-size:13px;font-weight:760;display:flex}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.metric{background:#fff;border:1px solid #d9dcd5;border-radius:6px;min-height:58px;padding:9px 10px}.metric.active{border-color:#e8a631;box-shadow:inset 0 0 0 1px #e8a631}.metric span{color:#65706d;font-size:12px;display:block}.metric strong{margin-top:4px;font-size:22px;display:block}.segmented{background:#e8e8e1;border-radius:7px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:10px;padding:3px;display:grid}.segmented button{color:#59635f;background:0 0}.segmented button.active{color:#1d2a27;background:#fff;box-shadow:0 1px 2px #171e1c1f}.segmented button:disabled,.download-button:disabled,.clear-button:disabled,.mask-actions button:disabled{cursor:not-allowed;opacity:.45}.ref-search{color:#66706c;background:#fff;border:1px solid #d5d7d0;border-radius:6px;width:100%;min-height:36px;padding:8px 10px}.component-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;max-height:220px;margin-top:10px;display:grid;overflow:auto}.component-row{color:#263230;cursor:pointer;background:#eceee7;border-radius:6px;justify-content:space-between;align-items:center;gap:6px;min-height:34px;padding:5px 7px;display:flex}.component-row span{text-overflow:ellipsis;overflow:hidden}.component-row small{color:#69736f}.component-row.excluded{color:#812f1f;background:#f6d8cb}.tool-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;display:grid}.range-control{background:#fff;border:1px solid #d9dcd5;border-radius:6px;grid-template-columns:1fr auto;align-items:center;gap:8px;padding:10px;display:grid}.range-control span,.toggle-row span,.number-field span{color:#52615d;font-size:12px}.range-control strong{color:#1f2c29;font-size:13px}.range-control input{grid-column:1/-1;width:100%}.toggle-row{cursor:pointer;background:#eceee7;border-radius:6px;align-items:center;gap:8px;min-height:38px;margin-top:8px;padding:0 10px;display:flex}.toggle-row input{accent-color:#2b7d75;width:16px;height:16px}.number-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:8px;display:grid}.number-field{gap:5px;min-width:0;display:grid}.number-field div{background:#fff;border:1px solid #d7dad2;border-radius:6px;align-items:center;min-height:36px;display:flex;overflow:hidden}.number-field input{color:#263230;border:0;width:100%;min-width:0;height:34px;padding:0 6px}.number-field small{color:#6b7671;padding-right:6px;font-size:11px}.tool-button{color:#3c4946;background:#eceee7;flex-direction:column;gap:4px;min-width:0;min-height:56px}.tool-button span{font-size:11px}.tool-button.active{color:#fff;background:#2b7d75}.mask-actions,.display-toggles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px;display:grid}.mask-actions button,.display-toggles button,.clear-button{color:#374440;background:#eceee7}.display-toggles button.active{color:#16665c;background:#d9ece7}.mask-list{gap:6px;margin-top:10px;display:grid}.mask-row{color:#303b38;background:#f1f1eb;border-radius:6px;justify-content:space-between;align-items:center;gap:8px;min-height:34px;padding:5px 8px;display:flex}.mask-row button{color:#8c3d2e;cursor:pointer;background:#f7ded6;border-radius:5px;place-items:center;width:28px;height:28px;display:inline-grid}.clear-button,.download-button{width:100%;margin-top:10px}.download-button{color:#fff;background:#2b7d75;font-weight:740}.preview-panel{background:#f6f4ef;flex-direction:column;min-width:0;min-height:0;padding:16px;display:flex}.preview-header{justify-content:space-between;align-items:center;gap:14px;margin-bottom:10px;display:flex}.preview-header h2{font-size:19px;line-height:1.2}.preview-header p{color:#65706c;margin-top:4px;font-size:13px}.coordinate-chip{color:#52615d;white-space:nowrap;background:#fff;border:1px solid #d9dcd5;border-radius:6px;padding:7px 9px;font-size:12px}.error-banner,.warning-banner{border-radius:6px;gap:4px;margin-bottom:10px;padding:9px 10px;font-size:12px;display:grid}.error-banner{color:#8c2e1d;background:#fbe0d8}.warning-banner{color:#72500d;background:#fff0cf}.canvas-frame{background:#fff;border:1px solid #c9cec7;border-radius:8px;flex:1;min-height:380px;overflow:hidden}.preview-svg{cursor:crosshair;touch-action:none;width:100%;height:100%;display:block}.grid-lines line{stroke:#e9ebe5;stroke-width:.035px;vector-effect:non-scaling-stroke}.board-outline{fill:none;stroke:#263230;stroke-width:.18px;vector-effect:non-scaling-stroke}.pad{stroke-width:.08px;vector-effect:non-scaling-stroke}.output-pad{fill:#2b7d75;stroke:#155c54}.excluded-pad{fill:#e7886e;stroke:#9a3f2d;opacity:.5}.mask-shape,.mask-draft{fill:#f4bb4d47;stroke:#f0a51b;stroke-width:.15px;stroke-dasharray:.6 .35;vector-effect:non-scaling-stroke}.mask-draft{fill:#f4bb4d2e}.polygon-draft-line{fill:none;stroke:#f0a51b;stroke-width:.16px;stroke-dasharray:.6 .35;vector-effect:non-scaling-stroke}.polygon-point{fill:#f0a51b;stroke:#8c610e;stroke-width:.05px;vector-effect:non-scaling-stroke}@media (width<=920px){.workspace{grid-template-columns:1fr}.panel{border-bottom:1px solid #d2d5ce;border-right:0;max-height:46vh}.topbar{flex-direction:column;align-items:flex-start}.upload-button{width:100%}.canvas-frame{min-height:420px}}