/* CyberFISH pipeline graphic (used on cyber-fish-ai.php and index.php); behaviour in assets/cyberfish-pipeline.js */
.pipe{position:relative;overflow:hidden;isolation:isolate;padding:20px 22px 18px;border-radius:22px;background:var(--panel);border:1px solid var(--line-2);box-shadow:var(--shadow-card)}
.pipe::before{content:"";position:absolute;z-index:-1;left:50%;top:55%;width:170%;aspect-ratio:1;transform:translate(-50%,-50%);background:conic-gradient(from 0deg,transparent 0 290deg,rgba(92,214,255,.11) 355deg,transparent 360deg);animation:sweep 7s linear infinite;pointer-events:none}
.pipe::after{content:"";position:absolute;z-index:-1;inset:0;background:repeating-radial-gradient(circle at 50% 55%,transparent 0 89px,rgba(92,214,255,.08) 90px 91px);pointer-events:none}
@keyframes sweep{to{transform:translate(-50%,-50%) rotate(360deg)}}
.pq{padding:10px 14px;border-radius:14px;border:1px solid var(--line-2);background:var(--bg)}
.pq span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--muted)}
.pq p{min-height:2.9em;margin-top:2px;color:var(--text);font-size:14.5px;font-weight:500;line-height:1.45}
.pq p::after{content:"";display:inline-block;width:7px;height:15px;margin-left:2px;vertical-align:-2px;background:var(--gold-ink);animation:blinkc 1s steps(1) infinite}
.psteps{position:relative;list-style:none;margin:14px 0 0;padding:0}
.psteps::before,.psteps::after{content:"";position:absolute;left:15px;top:16px;width:2px;background:var(--line-2)}
.psteps::before{bottom:16px}
.psteps::after{height:var(--fill,0px);background:linear-gradient(180deg,var(--gold),var(--peach));box-shadow:0 0 10px var(--gold);transition:height .55s cubic-bezier(.2,.8,.2,1)}
.psteps > li{position:relative;z-index:1;display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start;padding:5px 0;opacity:.42;transition:opacity .3s}
.psteps i{position:relative;z-index:1;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-family:var(--mono);font-size:12px;background:var(--panel);border:1px solid var(--line-2);color:var(--muted);transition:background .3s,border-color .3s,color .3s,box-shadow .3s}
.psteps b{display:block;padding-top:6px;color:var(--text);font-size:14px;line-height:1.25}
.psteps small{display:block;color:var(--muted);font-size:12.5px;line-height:1.4}
.psteps > li.on{opacity:1}
.psteps > li.on i{background:var(--gold);border-color:var(--gold);color:#141006;box-shadow:0 0 0 5px rgba(255,200,112,.22)}
.psteps > li.done{opacity:.9}
.psteps > li.done i{border-color:var(--gold-ink);color:var(--gold-ink)}
.branches{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.branches span{padding:4px 10px;border-radius:999px;border:1px solid var(--line-2);background:var(--tint-1);font-size:12px;color:var(--muted);transition:background .3s,border-color .3s,color .3s}
.branches span.pick{background:rgba(92,214,255,.16);border-color:var(--cyan);color:var(--text)}
.cost{display:inline-block;margin-top:4px;font-family:var(--mono);font-size:12.5px;font-weight:600;color:var(--green)}
.cost:empty{display:none}