@font-face{font-family:Drawing;src:url('assets/Oswald.ttf') format('truetype');font-display:block}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}body{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#283b38;background:#f7f8f7;font-size:13px}button,input,select,textarea{font:inherit}button{cursor:pointer;transition:background .15s,transform .15s;border:0}button:hover{background:#e8eeeb}button:active{transform:translateY(1px)}button:disabled{opacity:.35;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #2f8b78;outline-offset:2px}input,select,textarea{border:1px solid #dce2df;border-radius:5px;padding:9px 10px;background:white;color:#283b38;min-width:0;width:100%}textarea{resize:vertical;line-height:1.6}input[type=checkbox]{width:auto;accent-color:#226a5e}kbd{color:#98a6a0;font-size:11px}h1,h2,h3,p{margin:0}h1,h2{font-size:16px;font-weight:600;letter-spacing:-.3px}h3{font-size:13px} .topbar{height:70px;background:#fff;border-bottom:1px solid #dfe5e2;display:flex;align-items:center;padding:0 24px;gap:23px}.brand{display:flex;align-items:center;gap:10px;flex-shrink:0;font-size:12px;font-weight:750;letter-spacing:1.3px}.brandmark{background:#27665c;width:33px;height:33px;color:white;border-radius:8px;display:grid;place-items:center;font-size:24px;font-weight:400}.brand-sub{display:block;font-size:9px;letter-spacing:2px;font-weight:500;color:#81928a;margin-top:3px}.divider{height:26px;width:1px;background:#e1e7e3}.project-title{background:transparent;font-weight:550;padding:8px 0;text-align:left;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-title span{padding-left:14px;color:#8b9b94}.save-state{font-size:11px;color:#7b8e83;white-space:nowrap}.top-actions{margin-left:auto;display:flex;gap:10px;align-items:center}.button{padding:10px 14px;border:1px solid #dae2dd;background:#fff;color:#374b43;border-radius:6px;font-weight:550;white-space:nowrap}.button span{margin-right:6px}.button.primary{background:#266b5d;color:#fff;border-color:#266b5d;box-shadow:0 2px 3px #174c3210}.button.primary:hover{background:#1c594c}.quiet{background:transparent;color:#697e73;padding:10px;font-size:12px}.workspace{display:grid;grid-template-columns:224px minmax(0,1fr) 290px;height:calc(100% - 70px)}.library,.inspector{background:#fff;overflow:auto;scrollbar-width:thin;position:relative}.library{border-right:1px solid #e0e6e2;padding:24px 17px 16px;display:flex;flex-direction:column}.panel-heading{display:flex;justify-content:space-between;align-items:center}.eyebrow{display:block;font-size:9px;letter-spacing:1.4px;font-weight:650;color:#91a098;margin-bottom:9px}.panel-copy{font-size:11px;color:#8a9791;line-height:1.7;margin:14px 0 18px}.search{border:1px solid #e0e6e2;border-radius:5px;display:flex;align-items:center;padding-left:10px;background:#fbfcfb}.search span{font-size:21px;color:#9ca8a2}.search input{border:0;background:transparent;font-size:11px;padding:10px}.symbol-category{font-size:10px;text-transform:uppercase;letter-spacing:1.1px;color:#8c9a92;margin:23px 0 10px}.symbol-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.symbol-card{background:#fff;border:1px solid #e1e7e3;border-radius:6px;min-height:85px;padding:10px 3px 7px;color:#667b71;cursor:grab}.symbol-card:hover{border-color:#91b5a5;background:#f4f9f6;transform:translateY(-1px)}.symbol-card svg{width:100%;height:41px;pointer-events:none;display:block;margin-bottom:6px}.symbol-card span{font-size:10px;line-height:1.1}.symbol-card.active{border-color:#347d66;background:#edf6ef}.library-foot{margin-top:auto;padding-top:30px}.source-badge{font-size:8px;letter-spacing:.8px;border:1px solid #d9e6dd;color:#8eab96;border-radius:3px;padding:3px 5px}.library-foot strong{display:block;font-size:11px;margin:13px 0 7px;color:#7c9084;font-weight:500}.library-foot p{font-size:10px;line-height:1.6;color:#98a59d}.text-button{background:transparent;color:#4f7e69;font-size:10px;padding:10px 0}.main{display:flex;flex-direction:column;min-width:0}.toolbar{height:53px;display:flex;gap:4px;align-items:center;padding:0 16px;border-bottom:1px solid #dee5e0;background:#fff;flex-shrink:0}.toolgroup{display:flex;gap:3px}.tool{background:transparent;color:#667c70;width:31px;height:31px;border-radius:4px;font-size:18px;display:inline-flex;align-items:center;justify-content:center}.tool.active{background:#e8f1ec;color:#28654f}.tool-wide{width:64px;font-size:11px;gap:5px}.tool-wide span{font-size:18px}.toolbar-rule{height:19px;width:1px;background:#e3e8e4;margin:0 8px}.toolbar-spacer{flex:1}.snap-control{display:flex;align-items:center;gap:5px;font-size:11px;color:#7a8d80}.sheet-label{font-size:10px;color:#91a294;white-space:nowrap}.canvas-wrap{position:relative;flex:1;min-height:0;background:#edf0ed;background-image:radial-gradient(#b9cbb970 .65px,transparent .65px);background-size:13px 13px;overflow:hidden}.canvas-caption{position:absolute;top:22px;left:27px;font-size:8px;letter-spacing:1.2px;color:#94a59a;display:flex;align-items:center;gap:7px;pointer-events:none}.canvas-caption>span:last-child{margin-left:12px;padding-left:15px;border-left:1px solid #cbd5cc;letter-spacing:.5px}.green-dot{width:5px;height:5px;background:#84a493;border-radius:50%}#canvas{width:100%;height:100%;touch-action:none;outline:none;user-select:none}#drawing [data-id]{cursor:move}#drawing [data-id]:hover{filter:drop-shadow(0 0 .5px #1e8b70)}#canvas[data-tool=pipe],#canvas[data-tool=text],#canvas[data-tool=place]{cursor:crosshair}#canvas[data-tool=pan]{cursor:grab}#canvas[data-tool=pan]:active{cursor:grabbing}.canvas-hint{position:absolute;bottom:24px;left:25px;max-width:400px;background:#fffffff0;border:1px solid #dfe8df;border-radius:7px;padding:14px 34px 14px 15px;box-shadow:0 3px 9px #19342108;font-size:10px;color:#91a194;line-height:1.65}.canvas-hint b{display:block;color:#54725e;font-weight:550;margin-bottom:3px;font-size:11px}.canvas-hint button{position:absolute;right:8px;top:8px;background:transparent;color:#a0ada3}.zoom-bar{position:absolute;bottom:24px;right:23px;display:flex;align-items:center;gap:3px;border:1px solid #dae2db;border-radius:6px;padding:5px;background:#fff;box-shadow:0 2px 4px #16382408}.zoom-bar button{background:transparent;height:26px;min-width:27px;color:#718579;font-size:12px;border-radius:3px}.zoom-bar span{font-size:10px;color:#819085;padding:0 6px}.zoom-bar span:empty{width:1px;background:#e3e9e2;height:14px;padding:0;margin:0 3px}.statusbar{display:flex;justify-content:space-between;padding:9px 18px;font-size:9px;color:#8c9b91;border-top:1px solid #dee6df;background:#f9faf8;gap:12px;min-height:31px}.inspector{border-left:1px solid #dfe5e1;padding-top:24px}.inspector>.panel-heading{padding:0 20px 20px}.detail-tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #e4e8e5;padding:0 12px}.detail-tabs button{font-size:11px;color:#8a9990;background:transparent;padding:12px 0;border-bottom:2px solid transparent}.detail-tabs button.active{color:#2d6c56;border-bottom-color:#3b8267}.form-section{padding:21px 20px;border-bottom:1px solid #e7ece7}.form-section h3{font-size:11px;font-weight:600;letter-spacing:.2px;margin-bottom:16px;color:#6d8475}.field{display:block;margin-bottom:14px}.field:last-child{margin-bottom:0}.field>span{display:block;font-size:10px;color:#8a9c8e;margin-bottom:6px}.field input,.field select,.field textarea{font-size:11px;line-height:1.4}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-help{font-size:10px;color:#92a197;line-height:1.7}.selected-banner{display:flex;justify-content:space-between;align-items:center;padding:17px 20px;background:#edf5ef;border-bottom:1px solid #dce9df}.selected-banner span{font-size:10px;color:#7c9886}.selected-banner b{display:block;font-size:12px;font-weight:550;margin-top:4px}.action-row{display:flex;gap:7px;margin-bottom:15px}.action-row button{flex:1;font-size:10px;padding:8px}.danger{color:#b65e54}.empty-selection{text-align:center;padding:40px 22px;color:#8b9e90;font-size:12px;line-height:1.7}.empty-selection div{font-size:25px;color:#adc0af;margin-bottom:10px}.dropdown{position:absolute;right:135px;top:61px;background:white;border:1px solid #dce5dd;border-radius:8px;box-shadow:0 8px 30px #193b2420;min-width:265px;padding:7px;z-index:50}.dropdown button{display:flex;justify-content:space-between;gap:20px;padding:12px 10px;background:white;border-radius:4px;width:100%;text-align:left;font-size:12px}.dropdown button:hover{background:#eef4ee}.dropdown hr{border:0;border-top:1px solid #e6ece6;margin:5px}.toast{position:fixed;bottom:47px;left:50%;transform:translate(-50%,12px);opacity:0;pointer-events:none;padding:12px 20px;background:#244d3f;color:#fff;border-radius:7px;font-size:12px;z-index:100;transition:.2s;max-width:90vw}.toast.visible{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid #d6e0d8;border-radius:13px;max-width:540px;width:calc(100% - 30px);padding:32px;box-shadow:0 20px 80px #203c2930;color:#365341}dialog::backdrop{background:#1c342744;backdrop-filter:blur(3px)}dialog h2{font-size:25px;line-height:1.3;margin-bottom:25px;max-width:380px}dialog ol{padding-left:22px;margin-bottom:24px}dialog li{padding-left:8px;margin-bottom:18px;font-size:12px}dialog p{font-size:11px;line-height:1.7;color:#8c9b8f;margin-top:5px}.dialog-close:not(.button){position:absolute;right:15px;top:12px;font-size:22px;color:#849889;background:transparent}.guide-note{font-size:11px;line-height:1.7;background:#f0f5ef;padding:14px;border-radius:5px;color:#819883}.shortcut-row{font-size:9px;color:#8b9e8f;margin:15px 0 22px}.mobile-toggle,.mobile-close{display:none}.icon-button{background:transparent;font-size:20px;color:#8da494}.small-note{padding:16px 20px;color:#93a798;font-size:10px;line-height:1.7}.no-results{padding:25px 0;color:#8a9e8d;font-size:12px}@media(min-width:1600px){.workspace{grid-template-columns:242px minmax(0,1fr) 306px}.library{padding-left:23px;padding-right:23px}}@media(max-width:1200px){.workspace{grid-template-columns:190px minmax(0,1fr) 255px}.topbar{padding:0 17px;gap:15px}.save-state{display:none}.quiet{display:none}.library{padding:20px 13px}.inspector{padding-top:20px}.canvas-hint{max-width:255px;bottom:67px;left:18px}.sheet-label{display:none}}@media(max-width:1000px){.workspace{grid-template-columns:185px minmax(0,1fr)}.inspector{display:none;position:absolute;right:0;top:70px;bottom:0;width:290px;z-index:20;box-shadow:-10px 0 30px #173e2420}.inspector.open{display:block}#show-details{display:block}.inspector .mobile-close{display:block}}@media(max-width:700px){.topbar{height:60px;padding:0 12px;gap:10px}.brand{font-size:10px;gap:7px}.brandmark{width:27px;height:27px;font-size:21px}.brand-sub{font-size:7px}.topbar .divider,.project-title{display:none}.top-actions{gap:6px}.button{font-size:11px;padding:9px 10px}.workspace{height:calc(100% - 60px);grid-template-columns:1fr}.library{display:none;position:absolute;top:60px;bottom:0;left:0;width:235px;z-index:20;box-shadow:10px 0 30px #173e2420}.library.open{display:flex}.mobile-toggle,.mobile-close{display:block}.inspector{top:60px}.toolbar{padding:0 8px;gap:1px;height:49px}.toolbar-rule{margin:0 4px}.snap-control{display:none}.tool{width:29px}.tool-wide{width:46px}.tool-wide span{display:none}.canvas-caption{top:15px;left:17px;font-size:7px}.canvas-hint{max-width:240px;left:15px;bottom:70px}.zoom-bar{right:15px;bottom:20px}.statusbar{font-size:8px;padding:9px 10px}#object-count{display:none}.dropdown{right:12px;top:56px}.form-section{padding:18px}.topbar .primary span{display:none}dialog{padding:25px}.library-foot{padding-top:24px}}

/* Keep the canvas within its grid track at every viewport size. */
.workspace{grid-template-rows:minmax(0,1fr);overflow:hidden}.main{min-height:0;overflow:hidden}.canvas-wrap{height:0}#canvas{position:absolute;inset:0;display:block}[hidden]{display:none!important}