:root{font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:#14263c;background:#edf2f8;font-size:14px}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:1px solid #d0dae5;border-radius:8px;background:#fff;padding:9px 12px;color:#253c54}button:hover{background:#e8f1fb}button.active,.primary{background:#1363d1;color:white;border-color:#1363d1}.primary:hover,button.active:hover{background:#0b4fae}.topbar{height:67px;background:white;display:flex;align-items:center;gap:18px;padding:0 18px;border-bottom:1px solid #dae3ed}.brand{display:flex;align-items:center;gap:8px;white-space:nowrap}.brandmark{background:#1363d1;color:white;border-radius:9px;padding:9px;font-weight:800;display:inline-block}.brand small{font-size:10px;color:#7b8ba0}.topbar>input{min-width:135px;max-width:340px;flex:1;border:1px solid #d9e1eb;padding:9px;border-radius:8px}.actions{display:flex;gap:6px;margin-left:auto}.workspace{height:calc(100dvh - 67px);display:grid;grid-template-columns:245px minmax(320px,1fr) 260px}.sidebar,.inspector{background:#fff;padding:16px;overflow:auto}.sidebar{border-right:1px solid #d8e1eb}.inspector{border-left:1px solid #d8e1eb}.sidebar h3,.inspector h3{margin:0 0 15px}.sidebar>input{width:100%;padding:10px;border:1px solid #cdd9e6;border-radius:8px;margin-bottom:15px}.lib-group{color:#8492a4;font-size:11px;font-weight:800;text-transform:uppercase;margin:17px 0 7px}.lib-item{display:flex;width:100%;align-items:center;gap:12px;text-align:left;border:0;border-radius:8px;padding:10px 8px}.lib-icon{background:#e9f2fc;color:#145ac0;border-radius:6px;padding:8px;min-width:40px;text-align:center;font-weight:800}.lib-item small{display:block;color:#7b8ba0;font-size:11px}.help{font-size:12px;line-height:1.5;color:#697a91;margin-top:30px;padding:12px;background:#f5f8fc;border-radius:10px}.workarea{min-width:0;display:flex;flex-direction:column}.toolbar{display:flex;gap:5px;align-items:center;padding:10px;background:#fafcfe;border-bottom:1px solid #dae3ed;flex-wrap:wrap}.toolbar button{padding:7px 9px;font-size:12px}.separator{width:1px;background:#d8e1ed;height:20px;margin:0 7px}#zoomLabel{min-width:44px;text-align:center;font-size:12px}#status{margin-left:auto;font-size:12px;color:#708399}.canvas-wrap{flex:1;overflow:hidden;padding:15px}#canvas{width:100%;height:100%;background:#fff;border:1px solid #dce5ef;border-radius:12px;touch-action:none;box-shadow:0 3px 14px #17355410}.footer{padding:8px 16px;font-size:11px;color:#697b90}.inspector label,.login-card label,.install label{display:block;color:#52647a;font-size:12px;margin:0 0 14px}.inspector input,.login-card input,.install input{width:100%;padding:10px;border-radius:7px;border:1px solid #cddae7;margin-top:5px}.inspector button{width:100%}.inspector hr{border:0;border-top:1px solid #e6edf5;margin:22px 0}.muted{color:#8593a4;font-size:12px;line-height:1.5}.modal{position:fixed;inset:0;background:#0c1a309c;display:flex;justify-content:center;align-items:center;z-index:20;padding:20px}.modal[hidden],#app[hidden]{display:none!important}.login-card,.dialog{background:#fff;padding:28px;border-radius:16px;box-shadow:0 24px 70px #0003}.login-card{width:360px}.login-card button{width:100%}.login-card h1{margin-bottom:6px}.login-card p{color:#708095}.error,.alert{color:#ba2937!important}.dialog{width:min(600px,96vw);max-height:80vh;overflow:auto}.dialog-header{display:flex;justify-content:space-between;align-items:center}.project-row{border-bottom:1px solid #e7edf3;padding:13px 0;display:flex;align-items:center;justify-content:space-between;gap:12px}.project-row span{display:block;font-size:11px;color:#8b98a8}.project-row button{margin-left:5px}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#17263c;color:white;padding:11px 18px;border-radius:10px;display:none;z-index:50}.stack{display:flex;flex-direction:column}.install{max-width:490px;background:white;margin:4vh auto;padding:36px;border-radius:16px;box-shadow:0 10px 35px #0001}.install h1{margin-top:0}.alert{padding:12px;background:#fff0f0;border-radius:8px;margin-bottom:15px}@media(max-width:1050px){.workspace{grid-template-columns:175px minmax(300px,1fr) 210px}.sidebar,.inspector{padding:10px}.brand small{display:none}.actions button{padding:7px}}@media(max-width:740px){.workspace{grid-template-columns:150px minmax(340px,1fr);overflow-x:auto}.inspector{display:none}.topbar{flex-wrap:wrap;height:auto;padding:8px}.topbar>input{max-width:180px}.actions{width:100%;overflow-x:auto}.workspace{height:calc(100dvh - 112px)}.toolbar{min-width:340px}.canvas-wrap{padding:5px}}
