/* Compact desktop workspace: the drawing owns the available space. */
.topbar{height:42px;min-height:42px;flex:none;padding:4px 10px;gap:16px;flex-wrap:nowrap}
.brand{min-width:142px;font-size:17px;gap:6px}.brand svg{width:25px;height:25px}.brand small{display:none}
.document-meta{max-width:360px;display:flex;align-items:center;gap:10px}.document-meta input{font-size:13px;width:160px}.document-meta>span{font-size:10px;white-space:nowrap}
.file-actions{gap:4px;width:auto}.file-actions button{font-size:12px;padding:5px 8px}
.toolbar{height:38px;min-height:38px;flex:none;padding:3px 8px;gap:5px;overflow-y:hidden;scrollbar-width:none}.toolbar::-webkit-scrollbar{display:none}
.toolgroup{gap:1px;flex:none}.toolbar .tool{padding:3px 6px;gap:4px;font-size:12px;min-height:28px;flex:none}.toolbar .tool span{font-size:18px;width:20px;line-height:20px}
.history{padding-left:5px}.history button{font-size:20px;padding:0 7px}.toolbar-end button{font-size:12px;padding:4px 7px}.toolbar-end>button:last-child{width:25px;height:25px}
.workspace{position:relative;grid-template-columns:180px minmax(0,1fr) 210px;min-width:0}
body.library-collapsed .workspace{grid-template-columns:0 minmax(0,1fr) 210px}
body.inspector-collapsed .workspace{grid-template-columns:180px minmax(0,1fr) 0}
body.library-collapsed.inspector-collapsed .workspace,body.focus-mode .workspace{grid-template-columns:0 minmax(0,1fr) 0}
.library{padding:10px 8px 0;min-width:0;grid-column:1;grid-row:1}.inspector{display:block;padding:10px;min-width:0;grid-column:3;grid-row:1}
.drawing-area{grid-column:2;grid-row:1}.panel-heading{margin-bottom:8px}.panel-heading h2{font-size:12px}
body.library-collapsed .library,body.inspector-collapsed .inspector,body.focus-mode .panel{display:none}
.library select{font-size:12px;padding:5px 6px;min-height:29px;flex:none}.library #symbol-group{margin-top:5px}
.search{margin:5px 0 8px;padding:6px;font-size:12px;flex:none}.symbols{gap:5px;min-height:60px;grid-template-columns:repeat(2,minmax(0,1fr));scrollbar-width:thin}
.symbol-card{height:60px;padding:6px;gap:0;justify-content:center}.symbol-card svg{width:100%;height:100%;max-width:68px;flex:none}
.library .full{margin:5px 0;padding:5px 1px;font-size:11px;white-space:normal;flex:none}.library-note,.library-bottom{display:none}.library .count{display:block}
.library-caption{font-size:10px;color:var(--muted);line-height:1.5;padding:6px 0 0;flex:none}.library-caption a{color:var(--muted)}
.canvas-heading{height:30px;min-height:30px;flex:none;padding:0 6px;gap:8px;font-size:11px}.canvas-heading strong{max-width:200px;min-width:0;font-size:11px}
.canvas-heading button,.canvas-heading #demo,.canvas-heading #inspector-toggle{font-size:11px;padding:3px 6px;margin:0;min-height:25px}
.workspace-actions{display:flex;gap:3px;align-items:center;margin-left:auto;flex:none}
#library-toggle,#inspector-toggle,#focus-toggle{display:block;color:var(--muted)}
#library-toggle[aria-expanded=true],#inspector-toggle[aria-expanded=true],#focus-toggle[aria-pressed=true]{color:var(--accent);background:var(--accent-bg)}
#viewport{min-height:0}#canvas{position:absolute;inset:0;width:100%;height:100%}
.commandbar{height:23px;min-height:23px;flex:none;padding:2px 8px;font-size:11px;gap:5px}.commandbar #hint{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shortcut{display:none}.prompt-arrow{font-size:17px}
.statusbar{height:25px;min-height:25px;flex:none;padding:0 8px;gap:12px;font-size:11px}.statusbar output{min-width:135px}.status-toggles{height:23px;gap:3px}.status-toggles button{font-size:11px;padding:1px 6px}
.view-controls{right:10px;bottom:10px}.view-controls button{font-size:12px;padding:4px 9px}
.property-empty{font-size:12px;padding:10px 0 14px}#properties label{font-size:11px;margin-bottom:7px}#properties input,#properties select{font-size:12px;padding:6px;margin-top:3px}.property-row{gap:7px}
.layer-heading{padding-top:12px;margin-top:10px}.layer-row{min-height:29px;margin:1px -3px;padding:1px 3px}.layer-name{font-size:12px}.settings{margin-top:14px;padding-top:12px;gap:8px}.settings input,.settings select{font-size:12px;padding:6px}
body.focus-mode .topbar,body.focus-mode .commandbar,body.focus-mode .statusbar{display:none}
body.focus-mode .canvas-heading strong,body.focus-mode #demo{display:none}
#toast{bottom:42px}
@media(max-width:1100px){.document-meta>span{display:none}.toolbar .tool{font-size:0;gap:0;padding:3px 7px}.toolbar .tool span{font-size:19px}.key{display:none}}
@media(max-width:800px){
 .workspace,body.library-collapsed .workspace,body.inspector-collapsed .workspace,body.library-collapsed.inspector-collapsed .workspace{grid-template-columns:minmax(0,1fr)}
 .drawing-area{grid-column:1}.library,.inspector,body.inspector-open .inspector{position:absolute;top:30px;bottom:0;z-index:8;width:210px;box-shadow:0 8px 24px #0007;display:flex}
 .library{left:0}.inspector,body.inspector-open .inspector{right:0;display:block}.canvas-heading strong{display:none}.workspace-actions{gap:1px}.canvas-heading #demo{display:none}
 .document-meta input{width:100%;min-width:70px}.topbar{gap:8px}.brand{min-width:auto;font-size:15px}.brand svg{display:none}.file-actions button{font-size:11px;padding:5px}.status-label,.version{display:none}
}
@media(max-width:520px){.brand{display:none}.document-meta{min-width:55px}.statusbar{gap:5px}.statusbar output{min-width:100px;font-size:10px}.statusbar #entity-count{display:none}.canvas-heading button,.canvas-heading #inspector-toggle{font-size:10px;padding:3px 4px}.toolbar-end{padding-right:4px}.library .count{display:block}}

.symbol-info{font-size:11px;color:var(--muted);line-height:1.6;margin:8px 0;overflow-wrap:anywhere}
.library #symbol-group[hidden]{display:none}
