*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;height:100%;width:100%}body{overflow:hidden;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#fff;color:#1f2937;overscroll-behavior:none;-webkit-user-select:none;user-select:none}[data-theme=dark] body{background:#1f2226}.tool-icon{display:block;width:calc(31px * var(--icon-scale, 1));height:calc(31px * var(--icon-scale, 1));margin:0 auto;object-fit:contain}.btn-icon{width:calc(29px * var(--icon-scale, 1));height:calc(29px * var(--icon-scale, 1));object-fit:contain;vertical-align:calc(-7px * var(--icon-scale, 1));margin-right:5px}.help-icon,.toolbar-svg{display:block;margin:0 auto}.help-icon{width:calc(29px * var(--icon-scale, 1));height:calc(29px * var(--icon-scale, 1))}.toolbar-svg{width:calc(26px * var(--icon-scale, 1));height:calc(26px * var(--icon-scale, 1))}.stage{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;touch-action:none}.stage[data-tool=pen]{cursor:crosshair}.stage[data-tool=eraser]{cursor:cell}.stage[data-tool=select]{cursor:default}.stage[data-tool=select][data-handle=nwse]{cursor:nwse-resize}.stage[data-tool=select][data-handle=nesw]{cursor:nesw-resize}.stage[data-tool=pan]{cursor:grab}.stage[data-tool=pan]:active{cursor:grabbing}.layer{position:absolute;top:0;right:0;bottom:0;left:0;display:block}.stage>.layer{pointer-events:none}.toolbar{--icon-scale: 1.1;position:fixed;top:12px;left:12px;right:12px;display:flex;align-items:stretch;gap:12px;padding:7.5px 10px;border-radius:15px;background:#ffffffeb;box-shadow:0 2px 12px #0f172a24;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:17.5px}.toolbar__side{display:flex;flex-wrap:wrap;align-items:center;align-content:center;gap:7.5px;min-width:0}.toolbar__side--left{flex:1 1 auto}.toolbar__side--right{flex:none;flex-direction:column;flex-wrap:nowrap;align-items:flex-end;justify-content:center}.toolbar__group{display:inline-flex;align-items:center;gap:7.5px}.toolbar__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:7.5px 18px}@media (max-width: 1079px){.toolbar__side--right{flex:0 1 auto}}.toolbar__partition{flex:none;width:2px;border-radius:1px;background:#cbd5e1}.toolbar button{min-width:42.5px;height:42.5px;padding:0 12.5px;border:1px solid #e2e8f0;border-radius:11px;background:#fff;font-size:18.75px;line-height:1;color:inherit;cursor:pointer}.toolbar button:hover{background:#f1f5f9}.toolbar button:active{background:#e2e8f0}.toolbar button:disabled{opacity:.4;cursor:default}.toolbar button.is-active{background:#2563eb;border-color:#2563eb;color:#fff}.toolbar button.is-active:hover{background:#1d4ed8}.toolbar__zoom{min-width:50px;text-align:center;font-variant-numeric:tabular-nums}.toolbar__sep{width:1px;height:27.5px;background:#e2e8f0}[data-theme=dark] .toolbar{background:#26292ef0;box-shadow:0 2px 12px #00000073;color:#e5e7eb}[data-theme=dark] .toolbar button:not(.is-active){background:#3a3f47;border-color:#4b515b;color:#e5e7eb}[data-theme=dark] .toolbar button:not(.is-active):hover{background:#474d56}[data-theme=dark] .toolbar button:not(.is-active):active{background:#545b66}[data-theme=dark] .toolbar__sep{background:#4b515b}[data-theme=dark] .toolbar__partition{background:#6b7280}[data-theme=dark] .swatch.is-active{border-color:#fff;box-shadow:0 0 0 2px #2b2f36 inset}.seg{display:inline-flex;gap:5px}.seg__btn{min-width:47.5px}.toolbar .seg__btn{font-size:calc(19.5px * var(--icon-scale, 1))}.seg__btn.is-active{background:#2563eb;border-color:#2563eb;color:#fff}.seg__btn.is-active:hover{background:#1d4ed8}.swatches{display:inline-flex;align-items:center;gap:6px}.swatch{width:30px;min-width:30px;height:30px;padding:0;border-radius:50%;border:2px solid rgba(15,23,42,.15);cursor:pointer}.swatch.is-active{border-color:#0f172a;box-shadow:0 0 0 2px #fff inset}.swatch--custom{position:relative;overflow:hidden;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.swatch--custom input{position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;opacity:0;cursor:pointer}.size{display:inline-flex;align-items:center;gap:10px}.size input[type=range]{width:138px}.size__field{display:inline-flex;align-items:baseline;gap:2px;color:#64748b}.size__input{width:52px;text-align:right;padding:2.5px 5px;border:1px solid rgba(15,23,42,.15);border-radius:7.5px;color:#0f172a;font:inherit;font-variant-numeric:tabular-nums}.size__unit{font-variant-numeric:tabular-nums}.connstatus{display:inline-flex;align-items:center;gap:7.5px;font-size:16.25px;white-space:nowrap}.connstatus__dot{width:10px;height:10px;border-radius:50%;background:#94a3b8}.connstatus--connected .connstatus__dot{background:#16a34a}.connstatus--connecting .connstatus__dot{background:#d97706}.connstatus--failed .connstatus__dot,.connstatus--disconnected .connstatus__dot{background:#dc2626}.conn-open{display:inline-flex;align-items:center}.perf-hud{position:fixed;right:12px;bottom:12px;z-index:90;width:200px;padding:10px 12px;border-radius:12px;background:#0f172adb;color:#e2e8f0;font-size:12px;box-shadow:0 2px 12px #0f172a4d;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.perf-hud__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.perf-hud__close{border:none;background:transparent;color:#94a3b8;font-size:16px;line-height:1;cursor:pointer;padding:0 2px}.perf-hud__close:hover{color:#fff}.perf-hud__grid{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:0 0 8px}.perf-hud__grid dt{color:#94a3b8}.perf-hud__grid dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}.perf-hud__seed{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-bottom:6px}.perf-hud__seed span{width:100%;color:#94a3b8}.perf-hud__seed button{flex:1;min-width:0;padding:3px 4px;border:1px solid rgba(148,163,184,.4);border-radius:7px;background:#94a3b81f;color:#e2e8f0;font-size:12px;cursor:pointer}.perf-hud__seed button:hover{background:#94a3b847}.perf-hud__hint{margin:0;color:#64748b;font-size:11px;line-height:1.35}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:16px;background:#0f172a73;z-index:100}.modal{width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#fff;border-radius:14px;box-shadow:0 12px 40px #0f172a4d;padding:16px 18px 18px}.modal__head{display:flex;align-items:center;gap:12px;margin-bottom:8px}.modal__title{margin:0;font-size:18px;flex:1}.modal__close{border:none;background:transparent;font-size:18px;line-height:1;cursor:pointer;color:#64748b;padding:4px 6px;border-radius:8px}.modal__close:hover{background:#f1f5f9}.conn-body{font-size:14px;color:#334155}.conn-hint{color:#64748b;margin:6px 0}.conn-ok{color:#15803d;font-weight:600;margin:8px 0}.conn-error{margin-top:10px;padding:8px 10px;border-radius:8px;background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}.pdf-actions{display:flex;align-items:center;gap:8px;margin:4px 0 10px}.pdf-actions .conn-hint{margin:0;flex:1}.pdf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;max-height:50vh;overflow:auto;padding:2px}.pdf-thumb{position:relative;display:flex;align-items:center;justify-content:center;min-height:96px;padding:4px;background:#f8fafc;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer}.pdf-thumb img{display:block;max-width:100%;max-height:130px}.pdf-thumb.is-selected{border-color:#2563eb;box-shadow:0 0 0 2px #2563eb40}.pdf-thumb__num{position:absolute;top:2px;left:4px;padding:0 4px;font-size:11px;color:#475569;background:#ffffffd9;border-radius:4px}.pdf-thumb__ph{color:#94a3b8;font-size:18px}.pdf-foot{display:flex;justify-content:flex-end;margin-top:12px}.modal button.pdf-import-btn{padding:8px 14px;font-weight:600;color:#fff;background:#2563eb;border:none;border-radius:8px;cursor:pointer}.modal button.pdf-import-btn:disabled{opacity:.5;cursor:default}.modal--confirm{width:min(420px,100%)}.confirm-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}.modal button.confirm-cancel{padding:8px 14px;color:#334155;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:8px;cursor:pointer}.modal button.confirm-cancel:hover{background:#e2e8f0}.modal button.confirm-danger{padding:8px 14px;font-weight:600;color:#fff;background:#dc2626;border:1px solid #dc2626;border-radius:8px;cursor:pointer}.modal button.confirm-danger:hover{background:#b91c1c;border-color:#b91c1c}.help-modal{width:min(640px,100%)}.help-body h3{margin:16px 0 6px;font-size:15px}.help-body p{margin:8px 0;line-height:1.5}.help-body ul{margin:6px 0;padding-left:20px}.help-body li{margin:4px 0;line-height:1.45}.help-credit{margin-top:18px;text-align:center;color:#64748b;font-style:italic}[data-theme=dark] .help-credit{color:#9aa5b1}.conn-choose{display:flex;gap:10px;margin-top:10px}.conn-bigbtn{flex:1;display:flex;flex-direction:column;gap:4px;text-align:left;padding:14px;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc;cursor:pointer}.conn-bigbtn:hover{border-color:#2563eb;background:#eff6ff}.conn-bigbtn strong{font-size:15px}.conn-bigbtn span{color:#64748b;font-size:13px}.conn-steps{margin:8px 0 0;padding-left:20px}.conn-steps>li{margin-bottom:16px}.conn-steprow{display:flex;align-items:center;justify-content:space-between;gap:10px}.conn-code{display:flex;gap:8px;align-items:flex-start;margin:8px 0}.conn-code textarea{flex:1;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;resize:vertical;padding:8px;border:1px solid #cbd5e1;border-radius:8px;word-break:break-all}.conn-actions{display:flex;justify-content:space-between;gap:10px;margin-top:12px}.modal button{min-height:34px;padding:0 12px;border:1px solid #cbd5e1;border-radius:9px;background:#fff;font-size:14px;cursor:pointer}.modal button:hover:not(:disabled){background:#f1f5f9}.modal button:disabled{opacity:.45;cursor:default}.modal button.is-primary{background:#2563eb;border-color:#2563eb;color:#fff}.modal button.is-primary:hover:not(:disabled){background:#1d4ed8}.conn-bigcode{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:44px;letter-spacing:10px;text-align:center;font-weight:700;color:#1e293b;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:12px;padding:18px 10px;margin:12px 0;text-transform:lowercase}.conn-codeinput{width:100%;box-sizing:border-box;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:30px;letter-spacing:8px;text-align:center;text-transform:lowercase;padding:12px;border:1px solid #cbd5e1;border-radius:10px;margin:12px 0}.conn-codeinput:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px #bfdbfe}.modal button.conn-link{background:none;border:none;min-height:auto;padding:4px 0;font-size:13px;color:#2563eb;text-decoration:underline}.modal button.conn-link:hover:not(:disabled){background:none;color:#1d4ed8}.modal button.conn-inline-btn{margin-left:10px;min-height:26px;padding:0 8px;font-size:12px}[data-theme=dark] .modal{background:#2a2e34;color:#e5e7eb;box-shadow:0 12px 40px #0000008c}[data-theme=dark] .modal__title{color:#f1f5f9}[data-theme=dark] .conn-body{color:#cbd5e1}[data-theme=dark] .conn-hint,[data-theme=dark] .conn-bigbtn span,[data-theme=dark] .pdf-thumb__num{color:#9aa5b1}[data-theme=dark] .modal__close{color:#cbd5e1}[data-theme=dark] .modal__close:hover{background:#3a3f47}[data-theme=dark] .modal button{background:#3a3f47;border-color:#4b515b;color:#e5e7eb}[data-theme=dark] .modal button:hover:not(:disabled){background:#474d56}[data-theme=dark] .modal button.is-primary,[data-theme=dark] .modal button.pdf-import-btn{background:#2563eb;border-color:#2563eb;color:#fff}[data-theme=dark] .modal button.confirm-danger{background:#dc2626;border-color:#dc2626;color:#fff}[data-theme=dark] .modal button.conn-link{background:none;color:#60a5fa}[data-theme=dark] .conn-bigbtn{background:#343a42;border-color:#4b515b}[data-theme=dark] .conn-bigbtn:hover{border-color:#2563eb;background:#2d3a4f}[data-theme=dark] .conn-bigcode{color:#f1f5f9;background:#1f2329;border-color:#4b515b}[data-theme=dark] .conn-codeinput,[data-theme=dark] .conn-code textarea{background:#1f2329;border-color:#4b515b;color:#e5e7eb}[data-theme=dark] .pdf-thumb{background:#343a42;border-color:#4b515b}[data-theme=dark] .conn-error{background:#3a1f22;border-color:#7f1d1d;color:#fca5a5}