.mockup-window{background:#fff;border:1px solid #0000001a;border-radius:14px;width:100%;overflow:hidden;box-shadow:0 1px 2px #0000000a,0 4px 12px -2px #00000014,0 12px 32px -4px #0000001f}.mockup-window__body{background:#fff;overflow:hidden}
.wflow{background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.wflow__canvas{background-color:#f8f9fb;background-image:radial-gradient(circle,#d1d5db .8px,#0000 .8px);background-size:18px 18px;justify-content:center;min-height:360px;padding:1.5rem 1.25rem;display:flex}.wflow__col{flex-direction:column;align-items:center;width:100%;max-width:300px;display:flex}.wflow__card{background:#fff;border:2px solid;border-radius:8px;width:100%;padding:.6rem .65rem .55rem;transition:box-shadow .15s;position:relative;box-shadow:0 2px 8px #00000012}.wflow__card:hover{box-shadow:0 4px 14px #00000021}.wflow__card--success{box-shadow:0 2px 10px #f59e0b2e}.wflow__card--chat{padding-bottom:.5rem}.wflow__card-step-badge{color:#fff;text-align:center;background:#3b82f6;border-radius:4px;min-width:38px;padding:.12rem .4rem;font-size:.44rem;font-weight:700;position:absolute;top:-10px;left:-6px;box-shadow:0 2px 4px #0000001f}.wflow__channel-tag{color:#334155;background:#fff;border:1px solid #e2e8f0;border-radius:4px;align-items:center;gap:2px;padding:.12rem .4rem;font-size:.44rem;font-weight:700;display:inline-flex;position:absolute;top:-10px;right:-6px;box-shadow:0 2px 4px #0000001a}.wflow__channel-tag-li{color:#0a66c2}.wflow__channel-tag-mail{color:#10b981}.wflow__channel-tag-plus{color:#94a3b8;margin:0 1px}.wflow__card-body{align-items:center;gap:.5rem;display:flex}.wflow__card-icon{border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;display:flex}.wflow__card-text{flex:1;min-width:0}.wflow__card-title{color:#1f2937;white-space:nowrap;text-overflow:ellipsis;margin-bottom:2px;font-size:.6rem;font-weight:700;display:block;overflow:hidden}.wflow__card-sub{color:#6b7280;white-space:nowrap;text-overflow:ellipsis;font-size:.5rem;display:block;overflow:hidden}.wflow__vconnector{flex-direction:column;align-items:center;display:flex}.wflow__vconn-line{background:#cbd5e1;flex-shrink:0;width:1.5px;height:10px}.wflow__vconn-badge{color:#64748b;white-space:nowrap;background:#fff;border:1px solid #e2e8f0;border-radius:100px;margin:2px 0;padding:.1rem .4rem;font-size:.46rem;font-weight:700;box-shadow:0 1px 3px #0000000f}.wflow__vconn-arrow{border-top:6px solid #94a3b8;border-left:4px solid #0000;border-right:4px solid #0000;flex-shrink:0;width:0;height:0}.wflow__card-paths{border-top:1px solid #9333ea1a;flex-wrap:wrap;align-items:center;gap:.3rem;margin-top:.45rem;padding-top:.4rem;display:flex}.wflow__path-label{color:#94a3b8;text-transform:uppercase;letter-spacing:.06em;margin-right:2px;font-size:.44rem;font-weight:700}.wflow__path-option{color:#64748b;white-space:nowrap;background:#f8fafc;border:1px solid #e2e8f0;border-radius:100px;padding:.12rem .45rem;font-size:.46rem;font-weight:600}.wflow__path-option--active{color:#7c3aed;background:#9333ea14;border-color:#d8b4fe}.wflow__path-option--like{color:#6366f1;background:#6366f112;border-color:#a5b4fc;font-weight:700}.wflow__path-option--time{color:#6366f1;background:#eef2ff;border-color:#c7d2fe}.wflow__path-divider{color:#94a3b8;font-size:.42rem;font-weight:500}.wflow__chat{border-top:1px solid #10b9811f;flex-direction:column;gap:4px;margin-top:.45rem;padding-top:.4rem;display:flex}.wflow__bubble{white-space:nowrap;text-overflow:ellipsis;border-radius:8px;max-width:85%;padding:.22rem .5rem;font-size:.48rem;font-weight:500;line-height:1.4;overflow:hidden}.wflow__bubble--recv{color:#334155;background:#f1f5f9;border-bottom-left-radius:2px;align-self:flex-start}.wflow__bubble--sent{color:#065f46;background:#10b9811a;border-bottom-right-radius:2px;align-self:flex-end}