/* Fluxworks demo additions for the 30k per month Cold Email System dashboard */
.fw-back{color:var(--cyan);text-decoration:none;font-size:12px;font-weight:700;letter-spacing:.04em}.fw-back:hover{text-decoration:underline}
.automation{padding:90px 0 0}
.n8n-board{border:1px solid var(--line);border-radius:18px;background:rgba(10,26,38,.78);box-shadow:var(--shadow);overflow:hidden}
.n8n-canvas-head{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line);background:rgba(4,20,31,.6);font-size:11px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.n8n-dot{width:9px;height:9px;border-radius:50%;background:#2c4a5c;display:inline-block}.n8n-dot:nth-child(1){background:#ff7f73}.n8n-dot:nth-child(2){background:var(--amber)}.n8n-dot:nth-child(3){background:var(--lime)}
.n8n-title{margin-left:10px}.n8n-title em{font-style:normal;color:var(--cyan)}
.n8n-replay{margin-left:auto;background:transparent;border:1px solid var(--line);color:var(--paper);border-radius:999px;padding:5px 12px;font:inherit;font-size:10px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.n8n-replay:hover{border-color:var(--cyan);color:var(--cyan)}
.n8n-rail{list-style:none;margin:0;padding:26px 22px 14px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 34px;position:relative;background-image:radial-gradient(rgba(104,215,232,.12) 1px,transparent 1px);background-size:22px 22px}
.n8n-node{position:relative;border:1px solid var(--line);border-radius:14px;padding:14px 14px 16px;background:rgba(16,42,61,.92);min-height:150px;transition:border-color .3s,box-shadow .3s,transform .3s}
.n8n-node.n8n-trigger{border-top-left-radius:26px;border-bottom-left-radius:26px}
.n8n-node.n8n-gate{border-color:rgba(255,127,115,.35)}
.n8n-node strong{display:block;font:500 15px Georgia,serif;margin:10px 0 6px}
.n8n-node small{display:block;color:var(--muted);font-size:10.5px;line-height:1.5}
.n8n-head{display:flex;align-items:center;gap:8px}
.n8n-badge{font:700 10px/1 Inter,system-ui,sans-serif;color:var(--ink);background:var(--cyan);border-radius:6px;padding:4px 6px}
.n8n-gate .n8n-badge{background:var(--red)}
.n8n-kind{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.n8n-state{margin-left:auto;width:9px;height:9px;border-radius:50%;border:1px solid #4e7387;background:transparent}
.n8n-node.done .n8n-state{background:var(--lime);border-color:var(--lime);box-shadow:0 0 10px var(--lime)}
.n8n-node.n8n-gate.done .n8n-state{background:var(--amber);border-color:var(--amber);box-shadow:0 0 10px var(--amber)}
.n8n-node.active{border-color:var(--cyan);box-shadow:0 0 0 1px rgba(104,215,232,.35),0 18px 40px rgba(0,0,0,.35);transform:translateY(-3px)}
.n8n-node.active .n8n-state{background:var(--cyan);border-color:var(--cyan);animation:n8n-blink .7s ease-in-out infinite alternate}
/* connectors */
.n8n-node:not(:last-child)::after{content:"";position:absolute;top:50%;right:-34px;width:34px;height:2px;background:linear-gradient(90deg,#2c4a5c,#3b5f74);transform:translateY(-50%)}
.n8n-node:nth-child(4n)::after{display:none}
.n8n-node:not(:last-child)::before{content:"";position:absolute;top:50%;right:-34px;width:34px;height:2px;transform:translateY(-50%);background:linear-gradient(90deg,transparent,var(--cyan));opacity:0;z-index:2}
.n8n-node.active:not(:nth-child(4n))::before{opacity:1;animation:n8n-flow 1.1s linear infinite}
.n8n-node.active:not(:nth-child(4n)) ~ .n8n-node::before{opacity:0}
.n8n-log{display:flex;gap:14px;align-items:baseline;padding:14px 22px;border-top:1px solid var(--line);background:rgba(4,20,31,.55);font:12px/1.5 "IBM Plex Mono",ui-monospace,Menlo,monospace;color:#bfd0d8;min-height:48px}
.n8n-log-k{color:var(--cyan);font-size:9px;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;font-family:Inter,system-ui,sans-serif}
.n8n-note{color:var(--muted);font-size:11px;margin:0;padding:10px 22px 18px}
@keyframes n8n-flow{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes n8n-blink{from{opacity:.4}to{opacity:1}}
@media(max-width:1050px){.n8n-rail{grid-template-columns:repeat(2,minmax(0,1fr))}.n8n-node:nth-child(4n)::after,.n8n-node:nth-child(4n)::before{display:block}.n8n-node:nth-child(2n)::after,.n8n-node:nth-child(2n)::before{display:none}.n8n-node.active:not(:nth-child(2n))::before{opacity:1;animation:n8n-flow 1.1s linear infinite}.n8n-node.active:nth-child(2n)::before{opacity:0;animation:none}}
@media(max-width:650px){.automation{padding-top:65px}.n8n-rail{grid-template-columns:1fr;gap:22px;padding:18px 14px 8px}.n8n-node::after,.n8n-node::before{display:none!important}.n8n-node{min-height:0}.n8n-canvas-head{flex-wrap:wrap}.n8n-title{width:100%;margin:6px 0 0}.n8n-replay{margin-left:0}}
@media(prefers-reduced-motion:reduce){.n8n-node,.n8n-node::before,.n8n-node .n8n-state{animation:none!important;transition:none!important}.n8n-node.active{transform:none}}
/* long product name in the top bar */
.brand-mark{font-size:13px;letter-spacing:-.02em}
.brand strong{letter-spacing:.08em;font-size:12px;line-height:1.25;max-width:280px}
@media(max-width:650px){.topbar{height:auto;min-height:70px;flex-wrap:wrap;align-items:center;padding:10px 4vw;gap:8px 18px}.brand{flex:1 1 auto;min-width:0}.brand strong{font-size:10px;letter-spacing:.06em;max-width:none}.topbar-meta{flex:0 0 100%;justify-content:space-between;gap:12px}}
