:root{--color-page-bg: #fff;--color-panel-bg: #f4f4f4;--color-text: #000;--color-border: #ccc;--color-btn-bg: #007bff;--color-btn-hover: #0056b3;--color-btn-disabled: gray;--color-highlight: yellow;--color-node-fill: lightgray;--color-node-stroke: black;--color-link-stroke: #ccc;--font-sans: sans-serif;--font-mono: monospace;--font-size-base: 14px;--font-size-btn: 18px;--space-xs: 10px;--space-sm: 12px;--space-md: 20px;--space-lg: 50px;--btn-height: 50px;--btn-radius: 8px;--sidebar-width: 300px;--toggle-spacing: var(--space-md);--box-shadow: 0 1px 3px rgba(0,0,0,.2);--scrollbar-thumb-bg: var(--color-border)}.dark{--color-page-bg: #222;--color-panel-bg: #333;--color-text: #eee;--color-border: #555;--color-btn-bg: #1a73e8;--color-btn-hover: #1669c1;--color-btn-disabled: #555;--color-highlight: #444;--color-node-fill: #444;--color-node-stroke: #eee;--color-link-stroke: #555;--scrollbar-thumb-bg: var(--color-border)}html,body,#root{width:100%;height:100%;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--color-page-bg);color:var(--color-text)}.container{display:flex;width:100%;height:100%;position:relative}.resize-handle{width:10px;background:var(--color-border);cursor:col-resize;transition:background .2s;flex-shrink:0}.resize-handle:hover,.resize-handle:active{background:var(--color-btn-bg)}.input-container{display:flex;flex-direction:column;height:100%;padding:0;background-color:var(--color-panel-bg);box-sizing:border-box;overflow:hidden}.right-pane{display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden;height:100%}.resizable-container{display:flex;width:100%;height:100%;overflow:hidden}.right-pane{flex:2;display:flex;flex-direction:column;box-sizing:border-box}.step-info-container{width:100%;align-self:stretch;box-sizing:border-box;padding:var(--space-xs) var(--space-md);border-bottom:1px solid var(--color-border);background-color:var(--color-page-bg);color:var(--color-text);min-height:40px;overflow:auto}.step-info-header{display:flex;justify-content:space-between;align-items:center}.scroll-container{flex:1;overflow:auto;padding:var(--space-md);box-sizing:border-box;cursor:grab;display:flex;justify-content:center}.tree-wrapper{margin:0 auto;min-width:min-content;position:relative}.button-container{display:flex;padding:var(--space-xs);justify-content:space-around;margin-top:var(--space-xs);gap:var(--space-md)}.button-container button{flex:1;max-width:150px;height:var(--btn-height);font-size:var(--font-size-btn);padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--btn-radius);background-color:var(--color-btn-bg);color:var(--color-text);cursor:pointer;text-align:center;transition:background-color .2s}.button-container button:hover:not(:disabled){background-color:var(--color-btn-hover)}.button-container button:disabled{background-color:var(--color-btn-disabled)!important;color:var(--color-text)!important;cursor:not-allowed;opacity:.6}.code-header{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;padding:var(--space-xs) var(--space-md);border-bottom:1px solid var(--color-border);background:var(--color-page-bg);font-family:var(--font-sans);color:var(--color-text)}.logo{height:2.7rem}.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--space-xs) var(--space-sm);border:1px solid var(--color-border);border-radius:.375rem;background-color:var(--color-panel-bg);cursor:pointer;font-size:var(--font-size-base);transition:border-color .2s;text-align:center;color:var(--color-text)}.select:hover{border-color:var(--color-text)}.select:disabled{background-color:#f0f0f0;color:#999;cursor:not-allowed;border-color:#ddd;opacity:.7}.editor-area{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}.hidden-tag-deco{cursor:pointer}.hidden-tag-deco:hover{background-color:#ffeb3b99}.selected-tag-deco{background-color:#007bff4d}.node rect{fill:var(--color-node-fill)}.link{fill:none;stroke:var(--color-link-stroke);stroke-width:2px}g.node circle.highlighted,g.node rect.highlighted,g.node polygon.highlighted{stroke:#00678a!important;stroke-width:8px!important}.toggle-button{position:fixed;top:var(--space-xs);right:var(--toggle-spacing);z-index:1200;width:var(--btn-height);height:var(--btn-height);background-color:var(--color-panel-bg);border-radius:var(--btn-radius);transition:right 225ms cubic-bezier(.4,0,.6,1)}.toggle-button:hover{background-color:var(--color-btn-hover)}.sidebar{width:var(--sidebar-width);flex-shrink:0}html.dark .MuiDrawer-root .MuiDrawer-paper{background-color:var(--color-panel-bg)!important;color:var(--color-text)!important}.sidebar .MuiDrawer-paper{height:100vh!important;border-left:1px solid var(--color-border);background-color:var(--color-panel-bg)!important;color:var(--color-text)!important;overflow-x:hidden}.sidebar-content{padding:var(--space-md);height:100%;display:flex;flex-direction:column}.sidebar-tabs{margin-bottom:var(--space-md)}.sidebar-list{flex:1;overflow:auto}.sidebar-list::-webkit-scrollbar{width:6px}.sidebar-list::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb-bg);border-radius:3px}.sidebar-item{display:flex;margin-bottom:var(--space-xs);padding:var(--space-md);background-color:var(--color-page-bg);border-radius:var(--btn-radius);box-shadow:var(--box-shadow);transition:box-shadow .2s}.sidebar-item:hover{box-shadow:0 2px 6px #0000004d}.sidebar-left,.sidebar-right{flex:1;color:var(--color-text)}.sidebar-right{font-weight:700}.reified-tooltip{background:var(--color-panel-bg);border:1px solid var(--color-border);padding:var(--space-xs);font-family:var(--font-mono);font-size:var(--font-size-base);max-width:300px;box-shadow:var(--box-shadow);border-radius:var(--btn-radius);white-space:pre-wrap;color:var(--color-text)}.toggle-switch{position:relative;display:inline-block;width:50px;height:24px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-switch .slider{position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--color-btn-disabled);border-radius:24px;transition:background-color .2s}.toggle-switch .slider:before{position:absolute;content:"";height:20px;width:20px;left:2px;bottom:2px;background-color:var(--color-page-bg);transition:transform .2s;border-radius:50%}.toggle-switch input:checked+.slider{background-color:var(--color-btn-bg)}.toggle-switch input:checked+.slider:before{transform:translate(26px)}.custom-alert{display:flex;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:1000;justify-content:center;align-items:center}.custom-alert-content{background-color:var(--color-page-bg);padding:var(--space-md);border-radius:var(--btn-radius);box-shadow:var(--box-shadow);max-width:400px;width:90%;text-align:left;font-family:var(--font-sans);border:1px solid var(--color-border)}.custom-alert-message{color:var(--color-text);margin-bottom:var(--space-md);font-size:var(--font-size-base);white-space:pre-wrap}.custom-alert-button{background-color:var(--color-btn-bg);color:var(--color-text);border:none;padding:var(--space-sm) var(--space-md);border-radius:var(--btn-radius);cursor:pointer;font-size:var(--font-size-btn);transition:background-color .2s}.custom-alert-button:hover{background-color:var(--color-btn-hover)}.dark .custom-alert-content{background-color:var(--color-page-bg);border-color:var(--color-border)}.dark .custom-alert-message{color:var(--color-text)}.dark .custom-alert-button{background-color:var(--color-btn-bg);color:var(--color-text)}.dark .custom-alert-button:hover{background-color:var(--color-btn-hover)}