.flow-wrap{max-width:960px;margin:2.5rem auto;padding:0 1.5rem}.flow-wrap .kicker{color:var(--cyan);font-family:var(--mono);font-size:0.8rem;letter-spacing:1px;text-transform:uppercase}.flow-wrap h1{color:var(--white);font-size:2rem;margin:0.5rem 0 0.6rem}.flow-lead{color:var(--gray);line-height:1.7;max-width:72ch;margin-bottom:1.6rem}.flow-lead b{color:var(--white)}.flow-h2{color:var(--white);font-size:1.15rem;margin:0 0 0.7rem}.flow-demo{border:1px solid var(--border);border-radius:14px;background:var(--bg-card2);padding:1.1rem 1.2rem 1.3rem}.flow-actors{display:grid;grid-template-columns:1fr 1fr;gap:0.6rem;margin-bottom:0.4rem}.flow-actor{display:flex;align-items:center;gap:0.5rem;font-family:var(--mono);font-weight:700;font-size:0.9rem;padding:0.5rem 0.8rem;border-radius:9px;border:1px solid var(--border)}.flow-actor.a{color:var(--cyan);border-color:rgba(45,212,232,.4);background:rgba(45,212,232,.06)}.flow-actor.b{color:#a78bfa;border-color:rgba(167,139,250,.4);background:rgba(167,139,250,.06);justify-content:flex-end}.flow-lane{position:relative;margin:0.2rem 0 0;padding:0;list-style:none}.flow-lane::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:linear-gradient(180deg,rgba(45,212,232,.35),rgba(167,139,250,.35));transform:translateX(-50%)}.flow-msg{position:relative;margin:0.5rem 0}.flow-msg-head{display:flex;align-items:center;gap:0.5rem;width:calc(50% - 0.6rem);border:1px solid var(--border);border-radius:9px;padding:0.5rem 0.7rem;background:#0a0e14;font-family:var(--mono);font-size:0.82rem;color:var(--white)}.flow-msg.a .flow-msg-head{margin-right:auto;border-left:3px solid var(--cyan)}.flow-msg.b .flow-msg-head{margin-left:auto;border-right:3px solid #a78bfa;flex-direction:row-reverse;text-align:right}.flow-msg.both .flow-msg-head{margin:0 auto;width:calc(70% - 0.6rem);justify-content:center;border-left:3px solid #3ecf8e;border-right:3px solid #3ecf8e}.flow-msg.act .flow-msg-head{border-style:dashed}.flow-msg-head .flow-ic{font-weight:700}.flow-msg.a .flow-ic{color:var(--cyan)}.flow-msg.b .flow-ic{color:#a78bfa}.flow-msg .flow-lock{font-size:0.72rem;opacity:1}.flow-tag{font-family:var(--mono);font-size:0.6rem;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-dark);border:1px solid var(--border);border-radius:20px;padding:1px 6px}.flow-msg-num{font-family:var(--mono);font-size:0.68rem;color:var(--gray-dark)}.flow-msg-body{margin-top:0.5rem;border:1px solid var(--border);border-radius:10px;background:rgba(45,212,232,.04);padding:0.8rem 0.95rem}.flow-msg-body h3{font-family:var(--mono);font-size:0.92rem;color:var(--white);margin:0 0 0.4rem}.flow-msg-body p{color:#c3ccd6;font-size:0.9rem;line-height:1.6;margin:0}.flow-msg-body p b{color:var(--white)}.flow-sec{margin-top:0.55rem;display:flex;gap:0.5rem;align-items:flex-start;font-size:0.84rem;color:#dfe7ee;border-top:1px dashed var(--border);padding-top:0.5rem}.flow-sec .ico{flex:0 0 auto}.flow-controls{display:none}.flow-demo.js .flow-controls{display:flex;flex-wrap:wrap;gap:0.5rem;align-items:center;margin-top:1rem;padding-top:0.9rem;border-top:1px solid var(--border)}.flow-btn{font-family:var(--mono);font-size:0.82rem;padding:0.5rem 1rem;border-radius:8px;cursor:pointer;background:transparent;border:1px solid var(--border);color:var(--gray)}.flow-btn:hover:not([disabled]){border-color:var(--cyan);color:var(--cyan)}.flow-btn.primary{background:var(--cyan);border-color:var(--cyan);color:#04141a;font-weight:700}.flow-btn[disabled]{opacity:.45;cursor:not-allowed}.flow-counter{font-family:var(--mono);font-size:0.82rem;color:var(--gray);margin-left:auto}.flow-demo.js .flow-msg.past .flow-msg-body{display:none}.flow-demo.js .flow-msg.active .flow-msg-head{box-shadow:0 0 0 2px rgba(45,212,232,.35)}.flow-demo.js .flow-msg.active.b .flow-msg-head{box-shadow:0 0 0 2px rgba(167,139,250,.35)}.flow-demo.js .flow-msg.active .flow-msg-body{animation:flow-slide .18s ease-out}@keyframes flow-slide{from{transform:translateY(6px)}to{transform:translateY(0)}}.flow-note{color:var(--gray-dark);font-size:0.82rem;margin-top:0.7rem}.flow-concepts{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0.9rem;margin-top:1.8rem}.flow-card{border:1px solid var(--border);border-radius:12px;background:var(--bg-card2);padding:1rem 1.1rem}.flow-card h2{font-size:1rem;color:var(--white);margin:0 0 0.5rem;display:flex;gap:0.5rem;align-items:center}.flow-card p{color:var(--gray);font-size:0.88rem;line-height:1.6;margin:0}.flow-card p b{color:#c3ccd6}.flow-foot{margin-top:1.8rem;color:var(--gray-dark);font-size:0.8rem;line-height:1.6}.flow-foot a{color:var(--cyan);text-decoration:underline}@media (max-width:560px){.flow-msg-head,.flow-msg.both .flow-msg-head{width:auto}.flow-lane::before{display:none}}