.diagrams{flex:1;display:flex;min-height:0;background:var(--sk-bg-primary);color:var(--sk-text-primary)}.diagrams__sidebar{width:232px;flex-shrink:0;display:flex;flex-direction:column;border-right:1px solid var(--sk-border);background:var(--sk-bg-secondary);overflow-y:auto}.diagrams__sidebar-head{display:flex;align-items:center;justify-content:space-between;padding:var(--sk-space-md) var(--sk-space-md) var(--sk-space-sm)}.diagrams__nav{display:flex;flex-direction:column;gap:var(--sk-space-md);padding:0 var(--sk-space-sm) var(--sk-space-lg)}.diagrams__group{display:flex;flex-direction:column;gap:var(--sk-space-2xs)}.diagrams__group-label{padding:0 var(--sk-space-sm);margin-bottom:var(--sk-space-2xs);font-size:var(--sk-font-size-xs);font-weight:var(--sk-font-weight-semibold, 600);letter-spacing:.06em;text-transform:uppercase;color:var(--sk-text-muted)}.diagrams__item{display:block;width:100%;text-align:left;padding:var(--sk-space-sm) var(--sk-space-sm);border:none;border-radius:var(--sk-radius-md);background:transparent;color:var(--sk-text-secondary);font-size:var(--sk-font-size-base);font-family:inherit;cursor:pointer;transition:background var(--sk-duration-fast) var(--sk-ease-default),color var(--sk-duration-fast) var(--sk-ease-default)}.diagrams__item:hover{background:var(--sk-bg-tertiary);color:var(--sk-text-primary)}.diagrams__item--active{background:var(--sk-accent-muted, var(--sk-bg-tertiary));color:var(--sk-accent);font-weight:var(--sk-font-weight-semibold, 600)}.diagrams__main{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}.diagrams__toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--sk-space-lg);padding:var(--sk-space-md) var(--sk-space-lg);border-bottom:1px solid var(--sk-border);background:var(--sk-bg-secondary)}.diagrams__title{display:flex;flex-direction:column;gap:var(--sk-space-2xs);min-width:0}.diagrams__desc{font-size:var(--sk-font-size-sm);color:var(--sk-text-muted)}.diagrams__layouts{display:flex;gap:var(--sk-space-2xs);flex-shrink:0}.diagrams__stage{position:relative;flex:1;min-height:0;display:flex}.diagrams__loading{flex:1;display:flex;align-items:center;justify-content:center;color:var(--sk-text-muted);font-size:var(--sk-font-size-sm)}.diagrams__canvas{position:relative;flex:1;min-height:0;display:flex;--sk-diagram-bg: var(--sk-bg-primary);--sk-diagram-grid-color: var(--sk-border-subtle);--sk-diagram-edge-stroke: var(--sk-text-muted);--sk-diagram-edge-label-color: var(--sk-text-secondary);--sk-diagram-node-label-color: var(--sk-text-primary);--sk-diagram-select-stroke: var(--sk-accent);--sk-diagram-hover-fill: var(--sk-bg-tertiary)}.diagrams__surface{flex:1;width:100%;height:100%}.diagrams__badge{position:absolute;top:var(--sk-space-sm);left:var(--sk-space-sm);padding:var(--sk-space-2xs) var(--sk-space-sm);border-radius:var(--sk-radius-sm);background:var(--sk-bg-elevated);border:1px solid var(--sk-border);color:var(--sk-text-muted);font-size:var(--sk-font-size-xs);font-family:var(--sk-font-mono);pointer-events:none}.diagrams__inspector{position:absolute;top:var(--sk-space-sm);right:var(--sk-space-sm);display:flex;align-items:center;gap:var(--sk-space-sm);padding:var(--sk-space-2xs) var(--sk-space-md);border-radius:var(--sk-radius-sm);background:var(--sk-bg-elevated);border:1px solid var(--sk-border);font-size:var(--sk-font-size-sm)}.diagrams__inspector-key{color:var(--sk-text-muted);font-size:var(--sk-font-size-xs);text-transform:uppercase;letter-spacing:.05em}.diagrams__inspector-val{color:var(--sk-text-primary);font-weight:var(--sk-font-weight-semibold, 600)}@media(max-width:720px){.diagrams__sidebar{width:180px}.diagrams__desc{display:none}}