/* v2.0.4.1 Responsive Workspace — additive, does not modify editor/canvas state */
:root{--ui-radius:10px;--ui-shadow:0 14px 38px rgba(1,10,24,.32)}
html,body{width:100%;max-width:100%;overflow:hidden}
.app{width:100%;max-width:100%;min-width:0;overflow:hidden}
.top{box-shadow:0 2px 12px #07132444;background:#0c1728!important;min-width:0!important}
.top .brand{display:inline-flex;align-items:center;gap:7px;margin-right:3px;min-width:0!important}
.top .brand .site-logo{width:auto;max-height:34px;min-width:0}
.top .brand .site-wordmark{white-space:nowrap;font-weight:700}
.top>input#filename{min-width:80px!important;max-width:240px!important;text-overflow:ellipsis}
.top #zoomLabel{white-space:nowrap;font-variant-numeric:tabular-nums}
.top .autosave-state{white-space:nowrap;max-width:155px;overflow:hidden;text-overflow:ellipsis}
.top button,.top .menu-drop summary{transition:background .15s,border-color .15s}
.layout>.left,.layout>.right{scrollbar-width:thin;overscroll-behavior:contain}
.left-tab-button{min-width:0;white-space:nowrap}
.left-tab-pane,.panel,.project-explorer{overflow-wrap:anywhere}
.shape-tool-host,.v183-shape-grid,.class-toolkit-grid,.uml-v2-grid{min-width:0}
.shape-tool-host>*,.v183-shape-grid>*,.class-toolkit-grid>*,.uml-v2-grid>*{min-width:0}
.right .field,.right .field input,.right .field textarea{max-width:100%}
.layout>.work{min-width:0!important;scrollbar-width:thin}
.sheets-bar{min-width:0;max-width:100%;overflow:hidden}
.sheets-strip{min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
.bottom{min-width:0;max-width:100%;overflow:hidden}
.bottom #status{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.site-metrics{min-width:0;max-width:100%;gap:7px}
.workspace-backdrop{display:none}
.responsive-inspector-btn{display:none}
@media(max-width:1550px){
 .top{flex-wrap:wrap!important;justify-content:flex-start;row-gap:6px;min-height:0!important}
 .top>.brand{margin-right:12px}
 .top>#filename{flex:1 1 170px!important}
 .top .workshop-menus{flex:none}
 .top #helpModalBtn{margin-left:auto}
 .layout{grid-template-columns:minmax(205px,min(var(--left-size,270px),26vw)) 6px minmax(0,1fr) 6px minmax(225px,min(var(--inspector-width,270px),25vw))!important}
 .bottom .dev-credit{max-width:240px;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:1100px){
 .top>.brand .site-wordmark{font-size:14px!important}
 .top>.brand .site-logo{max-height:29px}
 .top>button{padding:7px 9px!important}
 .layout{grid-template-columns:minmax(190px,min(var(--left-size,240px),28vw)) 5px minmax(0,1fr) 0 0!important}
 .layout>.right,.layout>.inspector-resizer{display:none!important}
 .layout>.work{grid-column:3!important}
 .responsive-inspector-btn{display:inline-flex;align-items:center;gap:5px}
 .bottom .site-metrics{padding:3px 6px;font-size:10px}
 .minimap{width:145px!important;height:105px!important;margin-top:-124px!important}
 .app.responsive-inspector-open .layout>.right{display:block!important;position:fixed!important;z-index:160!important;right:0;top:0;bottom:0;width:min(370px,90vw)!important;max-width:90vw!important;box-shadow:-18px 0 44px #0009;overflow:auto!important;padding:65px 14px 24px!important}
 .app.responsive-inspector-open .workspace-backdrop{display:block!important;position:fixed;inset:0;z-index:155;background:#0008}
}
@media(max-width:760px){
 .app{grid-template-rows:auto minmax(0,1fr) 43px 31px!important;height:100dvh!important}
 .top{padding:6px 8px!important;gap:5px!important;max-height:145px;overflow-y:auto!important;overflow-x:hidden!important;align-content:start}
 .top>.brand{flex:1 1 auto;order:0;margin:0}
 .top>.brand .site-wordmark{font-size:14px!important}
 .top .workshop-menus{order:2;flex:1 0 auto;max-width:100%;gap:3px}
 .top .menu-drop summary{padding:8px 8px;font-size:11px}
 .top #mobileBtn{display:inline-flex!important;order:1;align-items:center;gap:5px}
 .top #responsiveInspectorBtn{order:1;display:inline-flex}
 .top>#filename{order:3;flex:1 1 130px!important;max-width:none!important;min-width:80px!important}
 .top #selectBtn,.top #connectBtn,.top #zoomLabel,.top #autosaveState{order:3}
 .top #focusModeBtn,.top #panelsBtn,.top #minimapToggle,.top #helpModalBtn{order:4;font-size:11px}
 .top #helpModalBtn{margin-left:0}
 .top button{font-size:11px!important;padding:7px 9px!important}
 .top #panelsBtn{display:none}
 .layout,.app.hide-inspector .layout,.app.focus-mode .layout{grid-template-columns:minmax(0,1fr)!important;overflow:hidden!important}
 .layout>.sidebar-resizer,.layout>.inspector-resizer{display:none!important}
 .layout>.work,.app.focus-mode .layout>.work{grid-column:1!important;grid-row:1!important}
 .layout>.left{display:none!important}
 .app.responsive-sidebar-open:not(.focus-mode) .layout>.left{display:block!important;position:fixed!important;top:0;bottom:0;left:0;z-index:160!important;width:min(340px,88vw)!important;max-width:88vw!important;overflow:auto!important;padding-top:62px!important;box-shadow:18px 0 44px #0009}
 .app.responsive-sidebar-open .workspace-backdrop{display:block!important;position:fixed;inset:0;z-index:155;background:#0008}
 .app.responsive-inspector-open .layout>.right{top:0}
 .sheets-bar{min-height:43px;padding:4px 5px;gap:4px}
 .sheets-bar .sheet-tab{max-width:135px;padding:7px 8px}
 .sheets-bar .sheet-text{max-width:105px}
 .sheets-bar .sheet-count{display:none}
 .project-mini{max-width:110px;min-width:0;overflow:hidden}
 .project-mini button{overflow:hidden;text-overflow:ellipsis;max-width:100px}
 .bottom{height:31px;min-height:31px;flex-wrap:nowrap;padding:3px 7px;gap:5px}
 .bottom #status{display:none}
 .site-metrics{margin-right:auto;overflow:hidden;white-space:nowrap;flex-wrap:nowrap;padding:3px 5px}
 .site-metrics span:nth-child(2),.site-metrics small{display:none}
 .bottom .dev-credit{max-width:125px;font-size:9px}
 .minimap{width:105px!important;height:78px!important;margin:-97px 8px 8px auto!important;opacity:.86}
 .canvas-scroll-hint{display:none!important}
 .menu-drop .menu-entries{max-height:calc(100dvh - 160px);overflow:auto}
 .new-diagram-dialog,.layout-preview-dialog{max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - 30px)!important;overflow:auto}
}
@media(max-width:390px){
 .top .brand .site-wordmark{font-size:12px!important}
 .top #zoomLabel{font-size:11px}
 .top #autosaveState{display:none}
 .top .menu-drop summary{padding:7px 6px}
 .bottom .dev-credit{display:none}
}
@media(prefers-reduced-motion:reduce){.top button,.top .menu-drop summary{transition:none}}