:root{--flow-accent:#6d5dfc;--flow-accent-2:#14b8a6;--flow-bg:#edf1f7;--flow-card:#edf1f7;--flow-text:#26324a;--flow-muted:#69758c;--flow-danger:#c33d55;--flow-shadow:12px 12px 25px #cbd1dc,-12px -12px 25px #fff;--flow-inset:inset 4px 4px 9px #cbd1dc,inset -4px -4px 9px #fff}body{background:var(--flow-bg);color:var(--flow-text)}body.dark{--flow-bg:#202633;--flow-card:#202633;--flow-text:#edf1f7;--flow-muted:#aab4c7;--flow-shadow:10px 10px 22px #151922,-10px -10px 22px #2b3344;--flow-inset:inset 4px 4px 9px #151922,inset -4px -4px 9px #2b3344}.site-header nav a.active{color:var(--flow-accent)}.flow-shell{max-width:1480px;margin:auto;padding:42px 5vw 80px}.flow-hero{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-bottom:35px}.flow-kicker,.panel-title span,.run-head span{font-size:.72rem;letter-spacing:.18em;color:var(--flow-accent);font-weight:800}.flow-hero h1{font-size:clamp(2rem,4vw,3.7rem);margin:.35rem 0}.flow-hero p{color:var(--flow-muted);max-width:720px}.privacy-card{display:flex;align-items:center;gap:15px;max-width:360px;padding:20px 24px;border-radius:22px;box-shadow:var(--flow-shadow)}.privacy-card i{font-size:1.7rem;color:var(--flow-accent-2)}.privacy-card span,.storage-note{display:block;font-size:.82rem;color:var(--flow-muted);margin-top:4px}.flow-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:28px}.flow-library,.builder-panel,.run-panel{border-radius:28px;background:var(--flow-card);box-shadow:var(--flow-shadow)}.flow-library{padding:22px;height:max-content;position:sticky;top:95px}.panel-title,.builder-head,.run-head,.run-bar{display:flex;justify-content:space-between;align-items:center;gap:18px}.panel-title h2,.run-head h2{margin:.3rem 0}.flow-list{display:grid;gap:10px;margin:22px 0;max-height:55vh;overflow:auto;padding:3px}.flow-list button{border:0;text-align:left;padding:14px;border-radius:14px;background:transparent;color:inherit;cursor:pointer}.flow-list button:hover,.flow-list button.active{box-shadow:var(--flow-inset);color:var(--flow-accent)}.flow-list strong,.flow-list small{display:block}.flow-list small{color:var(--flow-muted);margin-top:4px}.empty-flows{color:var(--flow-muted);font-size:.9rem}.library-actions{display:flex;gap:10px}.builder-panel{padding:28px}.builder-head{align-items:flex-end;border-bottom:1px solid rgba(105,117,140,.17);padding-bottom:22px}.flow-identity{display:grid;grid-template-columns:auto minmax(180px,330px);gap:8px 12px;align-items:center}.flow-identity label{font-size:.76rem;font-weight:700;color:var(--flow-muted)}.flow-identity input,.step-card input,.step-card select,.run-input input,.run-input textarea,.run-input select{border:0;border-radius:12px;background:transparent;color:inherit;box-shadow:var(--flow-inset);padding:11px 13px;min-width:0}.builder-actions{display:flex;flex-wrap:wrap;gap:9px}.flow-message{min-height:24px;margin:14px 0;color:var(--flow-accent);font-size:.9rem}.flow-message.error{color:var(--flow-danger)}.step-list{display:grid;gap:20px}.step-card{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:18px;align-items:start;padding:22px;border-radius:22px;box-shadow:6px 6px 15px #cbd1dc,-6px -6px 15px #fff;position:relative}body.dark .step-card{box-shadow:6px 6px 15px #151922,-6px -6px 15px #2b3344}.step-number{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:var(--flow-accent);color:#fff;font-weight:800}.step-main{display:grid;gap:15px}.step-row{display:grid;grid-template-columns:minmax(180px,1.4fr) minmax(160px,1fr);gap:15px}.step-row label,.setting-field{display:grid;gap:7px;font-size:.78rem;font-weight:700;color:var(--flow-muted)}.step-settings{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:12px}.setting-field.check{display:flex;align-items:center;padding-top:23px}.setting-field.check input{min-width:auto;box-shadow:none}.step-route{padding:12px 14px;border-radius:12px;background:rgba(109,93,252,.08);color:var(--flow-muted);font-size:.83rem}.step-route strong{color:var(--flow-accent)}.step-controls{display:flex;gap:5px}.step-controls button{width:36px;height:36px}.add-step{width:100%;margin:20px 0;border:2px dashed rgba(109,93,252,.35);border-radius:18px;padding:18px;background:transparent;color:var(--flow-accent);cursor:pointer}.add-step span,.add-step small{display:block}.add-step span{font-weight:800;margin:5px}.add-step small{color:var(--flow-muted)}.run-bar{margin-top:26px;padding:22px;border-radius:20px;box-shadow:var(--flow-inset)}.run-bar span{display:block;color:var(--flow-muted);font-size:.85rem;margin-top:4px}.run-panel{margin-top:34px;padding:28px}.run-input{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:22px 0}.run-input label{display:grid;gap:7px;font-size:.8rem;font-weight:700}.run-input label:has(textarea){grid-column:1/-1}.run-input textarea{min-height:140px}.run-progress{height:8px;border-radius:8px;box-shadow:var(--flow-inset);overflow:hidden;margin:20px 0}.run-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--flow-accent),var(--flow-accent-2));transition:width .25s}.run-results{display:grid;gap:14px}.run-result{display:grid;grid-template-columns:38px 1fr auto;gap:14px;padding:18px;border-radius:16px;box-shadow:var(--flow-inset)}.run-result .status{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(20,184,166,.15);color:var(--flow-accent-2)}.run-result.failed .status{background:rgba(195,61,85,.12);color:var(--flow-danger)}.run-result pre{white-space:pre-wrap;word-break:break-word;max-height:180px;overflow:auto;margin:9px 0 0;color:var(--flow-muted)}.run-output-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.danger-text{color:var(--flow-danger)!important}@media(max-width:980px){.flow-layout{grid-template-columns:1fr}.flow-library{position:static}.flow-list{grid-template-columns:repeat(2,1fr);max-height:none}.builder-head{align-items:stretch;flex-direction:column}.builder-actions{justify-content:flex-start}.step-settings{grid-template-columns:repeat(2,1fr)}}@media(max-width:680px){.flow-shell{padding:26px 16px 60px}.flow-hero{align-items:stretch;flex-direction:column}.flow-list{grid-template-columns:1fr}.builder-panel,.run-panel{padding:18px;border-radius:20px}.flow-identity{grid-template-columns:1fr}.builder-actions>*{flex:1}.step-card{grid-template-columns:42px 1fr;padding:16px;gap:10px}.step-number{width:38px;height:38px}.step-controls{grid-column:2}.step-row,.step-settings,.run-input{grid-template-columns:1fr}.run-bar{align-items:stretch;flex-direction:column}.run-result{grid-template-columns:34px 1fr}.run-result>small{grid-column:2}}
