@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{--bg: #f6f1e7;--bg-2: #eef3f0;--ink: #0b0f14;--ink-soft: #344049;--panel: rgba(255, 255, 255, .72);--panel-strong: #ffffff;--accent: #ff6b35;--accent-2: #2a9d8f;--accent-3: #f4d35e;--stroke: rgba(15, 23, 42, .1);--shadow-lg: 0 28px 70px rgba(15, 23, 42, .16);--shadow-sm: 0 12px 24px rgba(15, 23, 42, .12);--radius-lg: 24px;--radius-md: 18px;--radius-sm: 12px;--font-heading: "Space Grotesk", "Trebuchet MS", sans-serif;--font-body: "Manrope", "Trebuchet MS", sans-serif}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:var(--font-body);color:var(--ink);background:radial-gradient(circle at 15% 10%,rgba(255,107,53,.18),transparent 45%),radial-gradient(circle at 85% 5%,rgba(42,157,143,.2),transparent 50%),linear-gradient(120deg,#f7f2e6,#edf4f1 40%,#eef1f8);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;position:relative;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background-image:linear-gradient(120deg,#0f172a08,#0f172a00 50%),repeating-linear-gradient(0deg,rgba(15,23,42,.04) 0px,rgba(15,23,42,.04) 1px,transparent 1px,transparent 6px);pointer-events:none;z-index:0}#root{min-height:100vh;position:relative;z-index:1}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,select,textarea{font-family:var(--font-body)}input:focus,button:focus{outline:2px solid rgba(255,107,53,.4);outline-offset:2px}.app-shell{padding:32px 40px 48px;display:flex;flex-direction:column;gap:28px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;background:var(--panel);border-radius:var(--radius-lg);border:1px solid var(--stroke);box-shadow:var(--shadow-sm);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:14px}.brand-mark{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:conic-gradient(from 210deg,#ff6b35,#f4d35e,#2a9d8f,#ff6b35);color:#0b0f14;font-weight:700;letter-spacing:.08em;box-shadow:var(--shadow-sm)}.brand-text{display:flex;flex-direction:column;gap:2px}.brand-title{font-family:var(--font-heading);font-size:1rem;letter-spacing:.12em;text-transform:uppercase}.brand-sub{font-size:.82rem;color:var(--ink-soft)}.header-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.status-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:#2a9d8f1f;color:#1a5d56;font-size:.85rem;font-weight:600}.status-dot{width:8px;height:8px;border-radius:50%;background:#2a9d8f;box-shadow:0 0 0 4px #2a9d8f33}.hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:24px;align-items:stretch}.hero-copy{padding:28px 32px;border-radius:var(--radius-lg);background:var(--panel-strong);border:1px solid var(--stroke);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;gap:16px}.eyebrow{align-self:flex-start;padding:6px 12px;border-radius:999px;background:#ff6b3529;color:#9d3e1c;font-weight:600;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase}.hero-copy h1{font-family:var(--font-heading);font-size:clamp(2rem,3vw,3.2rem);margin:0;color:var(--ink);line-height:1.05}.hero-copy p{margin:0;color:var(--ink-soft);font-size:1rem;line-height:1.6}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-tags{display:flex;flex-wrap:wrap;gap:8px}.tag{padding:6px 12px;border-radius:999px;background:#0f172a0f;color:var(--ink-soft);font-size:.82rem;font-weight:600}.hero-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.metric-card{padding:18px;border-radius:var(--radius-md);background:var(--panel);border:1px solid var(--stroke);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:8px}.metric-label{color:var(--ink-soft);font-size:.85rem}.metric-value{font-family:var(--font-heading);font-size:1.8rem}.metric-trend{font-size:.85rem;color:var(--ink-soft)}.metric-trend.up{color:#1c6b56}.metric-trend.down{color:#b45309}.app-main{display:grid;grid-template-columns:minmax(240px,280px) minmax(0,1fr) minmax(240px,320px);gap:20px;align-items:start}.panel{background:var(--panel);border-radius:var(--radius-lg);border:1px solid var(--stroke);padding:20px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:16px}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.panel-title h2{margin:0;font-size:1.1rem;font-family:var(--font-heading)}.subtle{color:var(--ink-soft);font-size:.85rem}.left-panel{gap:14px}.search{display:grid;gap:6px;font-size:.85rem;color:var(--ink-soft)}.search input{border-radius:12px;border:1px solid var(--stroke);padding:10px 12px;background:#fff;font-size:.9rem}.workflow-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:14px;border:1px solid var(--stroke);background:#fff;box-shadow:0 10px 24px #0f172a14}.workflow-card.accent{border-color:#ff6b3566;background:#ff6b3514}.workflow-meta{display:flex;flex-direction:column;gap:4px}.workflow-title{font-weight:600}.workflow-sub{color:var(--ink-soft);font-size:.85rem}.chip{padding:6px 10px;border-radius:999px;background:#2a9d8f1f;color:#1b625b;font-size:.75rem;font-weight:600}.chip.ghost{background:#0f172a0f;color:var(--ink-soft)}.quick-actions{display:flex;gap:8px;flex-wrap:wrap}.canvas-panel{gap:14px}.canvas-actions{display:flex;gap:8px}.canvas-grid{position:relative;height:420px;border-radius:var(--radius-lg);background:linear-gradient(0deg,#ffffffeb,#ffffffeb),linear-gradient(90deg,rgba(15,23,42,.08) 1px,transparent 1px),linear-gradient(rgba(15,23,42,.08) 1px,transparent 1px);background-size:100% 100%,48px 48px,48px 48px;border:1px solid var(--stroke);overflow:hidden}.node{position:absolute;width:180px;padding:12px 14px;border-radius:16px;border:1px solid var(--stroke);background:#fff;box-shadow:0 16px 28px #0f172a1f;display:flex;flex-direction:column;gap:6px}.node-start{border-color:#ff6b3566}.node-mid{border-color:#2a9d8f66}.node-end{border-color:#f4d35eb3}.node-title{font-weight:600}.node-sub{font-size:.82rem;color:var(--ink-soft)}.node-chip{align-self:flex-start;padding:4px 8px;border-radius:999px;background:#0f172a0f;font-size:.7rem;font-weight:600;color:var(--ink-soft)}.n1{top:50px;left:40px}.n2{top:80px;left:260px}.n3{top:210px;left:260px}.n4{top:210px;left:520px}.connector{position:absolute;height:3px;border-radius:999px;background:linear-gradient(90deg,#2a9d8f,#ff6b35)}.connector:after{content:"";position:absolute;right:-6px;top:-4px;width:10px;height:10px;border-radius:2px;background:#ff6b35;transform:rotate(45deg)}.c1{width:200px;top:90px;left:210px}.c2{width:120px;top:160px;left:330px;transform:rotate(90deg);transform-origin:left}.c3{width:240px;top:250px;left:440px}.canvas-footer{display:flex;gap:8px;flex-wrap:wrap}.right-panel{gap:14px}.status{padding:6px 12px;border-radius:999px;font-size:.75rem;font-weight:600}.status.running{background:#ff6b3533;color:#9d3e1c}.execution-card{display:grid;gap:10px;padding:14px;border-radius:14px;border:1px solid var(--stroke);background:#fff}.execution-row{display:flex;justify-content:space-between;gap:12px;font-size:.85rem}.execution-row .label{color:var(--ink-soft)}.execution-row .value{font-weight:600;text-align:right}.log-title{font-weight:600;font-size:.95rem}.log-list{display:grid;gap:8px;padding:12px;border-radius:12px;border:1px solid var(--stroke);background:#fff;font-family:Courier New,Courier,monospace;font-size:.8rem}.log-line{display:grid;grid-template-columns:70px 1fr;gap:10px;color:#2c3a40}.log-line .time{color:#8b9aa3}.log-line.highlight{color:#1b625b;font-weight:600}.activity-panel{gap:14px}.activity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.activity-card{padding:16px;border-radius:14px;border:1px solid var(--stroke);background:#fff;display:grid;gap:6px}.activity-title{font-weight:600}.activity-sub{color:var(--ink-soft);font-size:.9rem}.activity-meta{color:#8b9aa3;font-size:.8rem}button{border:none;border-radius:999px;padding:10px 16px;font-size:.9rem;font-weight:600;cursor:pointer;background:transparent;color:var(--ink);transition:transform .2s ease,box-shadow .2s ease,background .2s ease}button.primary{background:var(--accent);color:#1c120c;box-shadow:0 16px 30px #ff6b354d}button.secondary{background:#fff;border:1px solid var(--stroke)}button.ghost{border:1px solid var(--stroke);background:#fff9}button.full{width:100%}button.small{padding:8px 12px;font-size:.8rem}button:hover{transform:translateY(-1px)}.reveal{opacity:0;transform:translateY(12px);animation:fadeUp .8s ease forwards}.delay-1{animation-delay:.1s}.delay-2{animation-delay:.2s}.delay-3{animation-delay:.3s}.delay-4{animation-delay:.4s}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}@media(max-width:1200px){.app-main{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.right-panel{grid-column:span 2}}@media(max-width:980px){.hero,.activity-grid{grid-template-columns:1fr}.canvas-grid{height:360px}}@media(max-width:860px){.app-main{grid-template-columns:1fr}}@media(max-width:640px){.app-shell{padding:20px}.app-header{flex-direction:column;align-items:flex-start}.header-actions{width:100%;justify-content:flex-start}}@media(prefers-reduced-motion:reduce){.reveal{animation:none;opacity:1;transform:none}button{transition:none}}
