*,:after,:before{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f1117;--surface:#1a1d27;--surface-2:#242736;--border:#2e3347;--accent:#6d8fff;--accent-2:#a78bfa;--text:#e2e4ed;--text-muted:#6b7280;--port-in:#34d399;--port-out:#f472b6;--port-inout:#fbbf24;--node-bg:#1e2235;--node-border:#3b4163;--handle-size:10px}#__next,body,html{height:100%;width:100%;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,system-ui,sans-serif;font-size:13px;line-height:1.5}.app-header{height:44px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 16px;gap:12px;flex-shrink:0;z-index:10}.app-header__logo{font-size:15px;font-weight:700;color:var(--accent);letter-spacing:-.02em}.app-header__tag{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);background:var(--surface-2);border:1px solid var(--border);border-radius:4px;padding:2px 6px}.app-header__error{font-size:11px;color:#f87171}.split-pane{display:flex;flex:1 1;min-height:0;overflow:hidden}.split-pane__left{flex:0 0 50%;display:flex;flex-direction:column;border-right:1px solid var(--border);overflow:hidden}.split-pane__divider{width:4px;background:var(--border);cursor:col-resize;flex-shrink:0;transition:background .15s}.split-pane__divider:hover{background:var(--accent)}.split-pane__right{flex:1 1;min-width:0;overflow:hidden}.pane-label{height:32px;background:var(--surface);border-bottom:1px solid var(--border);padding:0 12px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);flex-shrink:0}.pane-label,.sysml-node{display:flex;align-items:center}.sysml-node{background:var(--node-bg);border:1.5px solid var(--node-border);border-radius:8px;min-width:140px;min-height:60px;flex-direction:column;justify-content:center;padding:10px 20px;position:relative;box-shadow:0 4px 24px rgba(0,0,0,.35);transition:border-color .15s,box-shadow .15s}.sysml-node.selected,.sysml-node:hover{border-color:var(--accent);box-shadow:0 0 0 2px rgba(109,143,255,.25),0 4px 24px rgba(0,0,0,.45)}.sysml-node__type-badge{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}.sysml-node__name{font-size:13px;font-weight:600;color:var(--text)}.sysml-node__typename{font-size:10px;color:var(--text-muted);margin-top:2px}.sysml-node__attrs{align-self:stretch;margin-top:6px;padding-top:5px;border-top:1px solid var(--border)}.sysml-node__attr-row{font-size:10px;line-height:16px;white-space:nowrap;text-align:left;padding:0 2px}.sysml-node__attr-row--inherited{opacity:.55}.sysml-node__attr-inherited-marker{font-size:7px;color:var(--text-muted);vertical-align:middle;margin-right:1px;line-height:1}.sysml-node__attr-name--derived{color:#2dd4bf}.sysml-node__attr-sigma{font-size:9px;font-weight:700;color:#2dd4bf;margin-right:1px;vertical-align:middle;line-height:1}.sysml-node__attr-name{color:var(--accent);font-weight:600}.sysml-node__attr-type{color:var(--text-muted)}.sysml-node__attr-value{color:var(--accent-2)}.port-label{position:absolute;font-size:9px;color:var(--text-muted);white-space:nowrap;pointer-events:none}.port-label--in{left:14px}.port-label--out{right:14px}.react-flow__background{background:var(--bg)!important}.react-flow__edge-path{stroke:var(--accent)!important;stroke-width:1.5}.react-flow__edge.selected .react-flow__edge-path{stroke:var(--accent-2)!important;stroke-width:2}.react-flow__arrowhead{fill:var(--accent)!important}.react-flow__handle{border:2px solid var(--node-bg)!important;width:var(--handle-size)!important;height:var(--handle-size)!important;border-radius:50%!important}.react-flow__handle-left{background:var(--port-in)!important}.react-flow__handle-right{background:var(--port-out)!important}.react-flow__controls{background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:0 2px 12px rgba(0,0,0,.4)!important}.react-flow__controls-button{background:var(--surface)!important;border-bottom:1px solid var(--border)!important;color:var(--text-muted)!important;fill:var(--text-muted)!important}.react-flow__controls-button:hover{background:var(--surface-2)!important;fill:var(--text)!important}.react-flow__minimap{background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:8px!important}.sysml-group-node{background:rgba(26,29,39,.65);border:1.5px dashed var(--accent);border-radius:10px;position:relative;box-shadow:0 0 0 1px rgba(109,143,255,.08),0 6px 32px rgba(0,0,0,.4);transition:border-color .15s,box-shadow .15s;overflow:visible}.sysml-group-node.selected,.sysml-group-node:hover{border-color:var(--accent-2);box-shadow:0 0 0 2px rgba(167,139,250,.2),0 6px 32px rgba(0,0,0,.5)}.sysml-group-node__header{position:absolute;top:0;left:0;right:0;height:36px;display:flex;align-items:center;gap:6px;padding:0 12px;background:rgba(36,39,54,.9);border-bottom:1px solid rgba(109,143,255,.2);border-radius:8px 8px 0 0;pointer-events:none}.sysml-group-node__badge{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}.sysml-group-node__name{font-size:12px;font-weight:600;color:var(--text)}.sysml-group-node__type{font-size:10px;color:var(--text-muted)}.sysml-group-node__attrs{position:absolute;top:36px;left:0;right:0;padding:4px 12px;background:rgba(26,29,39,.75);border-bottom:1px dashed rgba(109,143,255,.2);pointer-events:none}.sysml-def-node{background:var(--node-bg);border:1.5px dashed #f59e0b;border-radius:8px;min-width:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px 20px;position:relative;box-shadow:0 0 0 1px rgba(245,158,11,.1),0 4px 24px rgba(0,0,0,.35);transition:border-color .15s,box-shadow .15s}.sysml-def-node.selected,.sysml-def-node:hover{border-color:#fbbf24;box-shadow:0 0 0 2px rgba(245,158,11,.25),0 4px 24px rgba(0,0,0,.45)}.sysml-def-node__stereotype{font-size:9px;font-weight:600;letter-spacing:.06em;color:#f59e0b;margin-bottom:2px;font-style:italic}.sysml-def-node__name{font-size:13px;font-weight:600;color:var(--text)}.app-header__about-btn{margin-left:auto;background:none;border:none;color:var(--text-muted);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;padding:4px 8px;border-radius:4px;transition:color .15s,background .15s}.app-header__about-btn:hover{color:var(--text);background:var(--surface-2)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}.about-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:100;display:flex;align-items:center;justify-content:center;animation:fadeIn .15s ease}.about-modal{background:var(--surface);border:1px solid var(--border);border-radius:10px;width:480px;max-width:calc(100vw - 48px);padding:28px 32px;box-shadow:0 8px 40px rgba(0,0,0,.5);position:relative;animation:slideUp .2s cubic-bezier(.16,1,.3,1)}.about-modal__header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:4px}.about-modal__title{font-size:18px;font-weight:700;color:var(--accent);letter-spacing:-.02em}.about-modal__close{background:none;border:none;color:var(--text-muted);font-size:20px;line-height:1;cursor:pointer;padding:0 2px;transition:color .15s}.about-modal__close:hover{color:var(--text)}.about-modal__desc{font-size:13px;line-height:1.7;color:var(--text);margin:16px 0}.about-modal__features{list-style:none;padding:0;margin:0 0 24px}.about-modal__feature{font-size:12px;line-height:1.9;color:var(--text-muted);padding-left:16px;position:relative}.about-modal__feature:before{content:"→";color:var(--accent);position:absolute;left:0}.about-modal__footer{border-top:1px solid var(--border);padding-top:14px;font-size:11px;color:var(--text-muted)}.diagram-placeholder{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-muted);font-size:13px}