:root{color:#1f2937;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#eef2ff;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html,body,#app{min-height:100vh;margin:0}body{background:linear-gradient(#eff6ff 0%,#f8fafc 100%)}button,input,textarea{font:inherit}button{color:#fff;cursor:pointer;background:#1677ff;border:0;border-radius:10px;padding:10px 14px;transition:transform .15s,opacity .15s,background .15s}button:hover{transform:translateY(-1px)}button:disabled{opacity:.45;cursor:not-allowed;transform:none}button.danger{background:#dc2626}input,textarea{color:#0f172a;background:#fff;border:1px solid #cbd5e1;border-radius:10px;width:100%;padding:10px 12px}input:focus,textarea:focus{border-color:#1677ff;outline:none;box-shadow:0 0 0 3px #1677ff1f}#app{padding:20px}.layout{grid-template-columns:320px minmax(0,1fr);gap:20px;min-height:calc(100vh - 40px);display:grid}.sidebar{flex-direction:column;gap:16px;display:flex}.panel,.canvas-wrap{background:#ffffffe6;border:1px solid #94a3b833;border-radius:18px;box-shadow:0 10px 30px #0f172a0f}.panel{padding:18px}.panel h1{margin:0 0 10px;font-size:24px}.panel p,.empty,.tips,.canvas-header{color:#475569}.panel-title{margin-bottom:12px;font-weight:700}.toolbar{grid-template-columns:1fr 1fr;gap:10px;display:grid}.toolbar.wide{grid-template-columns:1fr 1fr}.form{flex-direction:column;gap:14px;display:flex}.form label{flex-direction:column;gap:6px;display:flex}.form span{color:#334155;font-size:14px;font-weight:600}.tips,.empty{font-size:14px}.legend{color:#334155;gap:12px;font-size:14px;display:grid}.legend div{align-items:center;gap:10px;display:flex}.legend-line{border-top:2px solid #111827;width:30px;height:0}.legend-switch{border-top:2px solid #111827;width:30px;height:16px;position:relative}.legend-switch:after{content:"";transform-origin:0;border-top:2px solid #111827;width:12px;position:absolute;top:-7px;left:10px;transform:rotate(-38deg)}.legend-transformer{width:30px;height:18px;position:relative}.legend-transformer:before,.legend-transformer:after{content:"";background:#fff;border:2px solid #111827;border-radius:50%;width:14px;height:14px;position:absolute;top:0}.legend-transformer:before{left:2px}.legend-transformer:after{right:2px}.legend-anchor{background:#111827;border-radius:50%;width:10px;height:10px}.canvas-wrap{flex-direction:column;display:flex;position:relative;overflow:hidden}.canvas-header{border-bottom:1px solid #e2e8f0;justify-content:space-between;gap:16px;padding:16px 18px;font-size:14px;display:flex}.graph-canvas{flex:1;min-height:680px}.context-menu{z-index:20;background:#fffffffa;border:1px solid #dbeafe;border-radius:14px;gap:8px;min-width:210px;padding:10px;display:grid;position:absolute;box-shadow:0 12px 28px #0f172a24}.context-menu button{text-align:left;color:#1e293b;background:#f8fafc;justify-content:flex-start}.context-menu button:hover{background:#eff6ff}@media (width<=1024px){#app{padding:12px}.layout{grid-template-columns:1fr;min-height:auto}.toolbar,.toolbar.wide{grid-template-columns:1fr}.canvas-header{flex-direction:column}.graph-canvas{min-height:520px}}