.wf-demo *{margin-top:0}.wf-demo ul{list-style:none;margin:0;padding:0}.wf-demo{font-family:ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:13px;color:#c5cad3;background:#1a1d23;border:1px solid #2e3340;border-radius:10px;overflow:hidden;margin:2rem 0;user-select:none}.wf-topbar{display:flex;align-items:center;justify-content:space-between;background:#13151a;padding:0 14px;height:44px;border-bottom:1px solid #2e3340}.wf-topbar-left{display:flex;align-items:center;gap:10px}.wf-logo{background:#4353ff;color:#fff;font-weight:700;font-size:14px;width:26px;height:26px;border-radius:5px;display:flex;align-items:center;justify-content:center}.wf-site-name{color:#8890a0;font-size:12px}.wf-topbar-right{display:flex;gap:8px}.wf-btn-ghost{background:transparent;border:1px solid #3a4050;color:#8890a0;border-radius:5px;padding:4px 10px;font-size:12px;cursor:not-allowed;opacity:.6}.wf-btn-publish{background:#4353ff;border:none;color:#fff;border-radius:5px;padding:4px 12px;font-size:12px;font-weight:600;cursor:not-allowed;opacity:.6}.wf-panels{display:grid;grid-template-columns:200px 1fr 240px;height:480px}.wf-panel{background:#1a1d23;border-right:1px solid #2e3340;overflow-y:auto}.wf-settings{border-right:none;border-left:1px solid #2e3340}.wf-panel-header{display:flex;align-items:center;gap:7px;padding:8px 12px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#6b7280;border-bottom:1px solid #2e3340;position:sticky;top:0;background:#1a1d23;z-index:1}.wf-panel-icon{font-size:13px}.wf-tree ul{padding-left:14px}.wf-node{display:flex;flex-wrap:wrap;align-items:center;column-gap:8px;row-gap:4px;padding:2px 4px;border-radius:4px;margin:1px 4px;cursor:pointer;transition:background .1s}.wf-node:hover{background:#252830}.wf-node.is-active{background:#2a3459;color:#7c9ef5}.wf-node>ul{flex-basis:100%;padding-left:4px}.wf-node-icon{font-size:11px;color:#8894ae;flex-shrink:0}.wf-node-label{font-size:12px}.wf-node-label--dim{color:#8894ae;font-style:italic}.wf-node--page>.wf-node-label{color:#a0a9bc;font-weight:600}.wf-node--highlight>.wf-node-label{color:#a8c4f5}.wf-node--state>.wf-node-label{color:#8894ae}.wf-canvas{background:#d0d5e3;overflow:auto;display:flex;flex-direction:column;align-items:stretch}.wf-canvas-label{text-align:center;font-size:10px;color:#454b5e;padding:6px 0 4px;letter-spacing:.05em;flex-shrink:0}.wf-canvas-inner{flex:1;display:flex;justify-content:center;align-items:flex-start;padding:24px 8px;overflow:auto}.wf-el{position:relative;cursor:pointer;border:1.5px solid transparent;border-radius:4px;transition:border-color .15s}.wf-el:hover>.wf-el-badge{opacity:1}.wf-el:hover{border-color:#4353ff66}.wf-el.is-active{border-color:#4353ff!important}.wf-el.is-active>.wf-el-badge{opacity:1;background:#4353ff;color:#fff}.wf-el-badge{position:absolute;top:-18px;left:0;background:#2d3555;color:#7c9ef5;font-size:10px;padding:1px 6px;border-radius:3px 3px 0 0;white-space:nowrap;opacity:0;transition:opacity .15s;pointer-events:none;z-index:10}.wf-el--form-block{background:#1e2230;border-color:#2e3340;padding:24px 12px 16px;width:100%;max-width:520px;border-radius:6px;display:flex;flex-direction:column;gap:10px}.wf-el--form{display:flex;flex-direction:column;gap:9px;padding:8px;background:#252935;border-radius:5px}.wf-el--field{display:flex;flex-direction:column;gap:4px;padding:4px 6px}.wf-el--field label{font-size:11px;color:#8890a0}.wf-el--field input,.wf-el--field textarea{background:#1a1d23;border:1px solid #3a4050;border-radius:4px;color:#c5cad3;padding:6px 8px;font-size:12px;width:100%;font-family:inherit;pointer-events:none;resize:none}.wf-el--error-div{padding:6px 8px;font-size:12px;color:#f97474;background:#2e1f1f;border-radius:4px;border:1px dashed #6b2e2e}.wf-el--submit{display:inline-flex;margin-right:auto;padding:4px 12px;border:1px solid #43b1ff;background-color:transparent;color:#fff;border-radius:5px;font-size:13px;font-weight:600;font-family:inherit;cursor:pointer;pointer-events:none}.wf-el--submit>.wf-el{pointer-events:auto}.wf-states-divider{display:flex;align-items:center;gap:8px;color:#454b5e;font-size:10px;letter-spacing:.04em;margin:2px 0}.wf-states-divider:before,.wf-states-divider:after{content:"";flex:1;height:1px;background:#2e3340}.wf-el--success-msg{padding:10px 12px;background:#1e2e23;border:1px dashed #2d6b3e;border-radius:4px;color:#5db87a;font-size:12px}.wf-el--error-msg{padding:10px 12px;background:#2e1f1f;border:1px dashed #6b2e2e;border-radius:4px;color:#f97474;font-size:12px}.wf-settings-body{padding:12px}.wf-settings-hint{color:#8894ae;font-size:12px;font-style:italic;line-height:1.5}.wf-setting-group{margin-bottom:18px}.wf-setting-group+.wf-setting-group{border-top:1px solid #2e3340;padding-top:14px}.wf-setting-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#6b7280;margin-bottom:10px}.wf-field-row{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.wf-field-row label{font-size:11px;color:#8890a0}.wf-field-row input[type=text],.wf-field-row select{background:#252935;border:1px solid #3a4050;border-radius:4px;color:#c5cad3;padding:5px 8px;font-size:12px;font-family:inherit;width:100%}.wf-tag{display:inline-block;background:#1e2a3a;color:#7cb3f5;border:1px solid #2d4a6e;border-radius:4px;padding:2px 7px;font-size:11px;font-family:ui-monospace,monospace;margin:2px 2px 2px 0}.wf-tag--green{background:#1a2e22;color:#5db87a;border-color:#2a5e3a}.wf-tag--orange{background:#2e2214;color:#f0a855;border-color:#6e4a1e}.wf-tag--red{background:#2e1a1a;color:#f97474;border-color:#6e2e2e}.wf-note{background:#1e2230;border-left:3px solid #4353ff;padding:8px 10px;border-radius:0 4px 4px 0;font-size:11px;color:#8890a0;line-height:1.5;margin-top:8px}.wf-note strong{color:#a8c4f5}.wf-note code{background:#252935;padding:1px 5px;border-radius:3px;font-family:ui-monospace,monospace;font-size:10px;color:#c5cad3}.wf-footer{background:#13151a;border-top:1px solid #2e3340;padding:7px 14px;text-align:center}.wf-footer-hint{font-size:11px;color:#454b5e}@media(max-width:720px){.wf-panels{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;height:auto}.wf-layers{border-right:none;border-bottom:1px solid #2e3340;max-height:200px}.wf-settings{border-left:none;border-top:1px solid #2e3340}.wf-canvas{min-height:300px}}