.websocket-card-preview .websocket-card-connection span{background:#54ae79;border-radius:50%;flex:none;width:6px;height:6px}.term-card .websocket-card-preview{grid-template-columns:1fr}.websocket-card-preview .websocket-card-connection,.websocket-card-preview .websocket-card-message{background:#fff;border:1px solid #dbe3f3;border-radius:5px;align-items:center;gap:5px;min-width:0;padding:7px 8px;display:flex}.websocket-card-preview .websocket-card-connection b{color:#3d835f;font-size:9px}.websocket-card-preview .websocket-card-connection small{color:#7a86a0;font-family:var(--font-geist-mono), ui-monospace, monospace;text-overflow:ellipsis;white-space:nowrap;margin-left:auto;font-size:8px;overflow:hidden}.websocket-card-preview .websocket-card-message small{color:#7a86a0;font-size:8px}.websocket-card-preview .websocket-card-message span{color:#4f5f80;text-overflow:ellipsis;white-space:nowrap;margin-left:auto;font-size:9px;font-weight:750;overflow:hidden}.websocket-card-preview>p{grid-column:1/-1}.term-card .websocket-card-preview .websocket-card-compare{gap:7px;display:grid}.websocket-card-preview .websocket-card-lane{background:#fff;border:1px solid #dbe1ee;border-radius:6px;gap:4px;padding:7px 8px;display:grid}.websocket-card-preview .websocket-card-lane.is-ws{background:#f2f8fb;border-color:#c9dbe0}.websocket-card-preview .websocket-card-lane small{color:#6a7286;letter-spacing:.03em;text-transform:uppercase;font-size:8px;font-weight:800}.websocket-card-preview .websocket-card-lane b{color:#3a4252;font-size:9px;font-weight:750}.websocket-card-preview .websocket-card-pulses{align-items:center;gap:4px;display:flex}.websocket-card-preview .websocket-card-pulses>span{background:#fff;border:1px solid #dde2ec;border-radius:4px;gap:2px;padding:3px 4px;display:flex}.websocket-card-preview .websocket-card-pulses i{border-radius:3px;padding:2px 4px;font-size:8px;font-style:normal;font-weight:700;display:inline-block}.websocket-card-preview .websocket-card-pulses i:first-child{color:#1d4ed8;background:#eaf1fa}.websocket-card-preview .websocket-card-pulses i:last-child{color:#2f6b46;background:#e9f5ee}.websocket-card-preview .websocket-card-rail{background:#e7eef3;border-radius:4px;align-items:center;gap:3px;padding:4px 6px;display:flex}.websocket-card-preview .websocket-card-rail-bar{color:#fff;text-align:center;background:#3a4252;border-radius:3px;flex:auto;padding:3px 6px;font-size:8px;font-style:normal;font-weight:750;display:inline-block}.websocket-card-preview .websocket-card-rail-frame{border-radius:3px;padding:2px 4px;font-size:9px;font-style:normal;font-weight:800;display:inline-block}.websocket-card-preview .websocket-card-rail-frame.is-up{color:#fff;background:#3a6ea5}.websocket-card-preview .websocket-card-rail-frame.is-down{color:#fff;background:#b0822e}.websocket-card-preview .websocket-card-caption{color:#4f5666;margin:0;font-size:10px;line-height:1.5}.term-interactive-demo.websocket-demo{background:#fbfbfd;border-color:#e0e3ec}.websocket-controls{flex-wrap:wrap;align-items:center;gap:7px;display:flex}.term-interactive-demo.websocket-demo:not(.is-online) .websocket-controls button:not(.websocket-cta){display:none}.term-interactive-demo.websocket-demo button:hover:not(:disabled):not(.websocket-cta){color:#23262f;background:#f4f5f8;border-color:#4a5266}.term-interactive-demo.websocket-demo button:focus-visible{outline-offset:2px;outline:2px solid #3a4254}.term-interactive-demo.websocket-demo .websocket-cta{min-height:38px;font:inherit;justify-content:center;align-items:center;gap:6px;padding:9px 22px;font-size:14px;font-weight:750;transition:background-color .15s ease-out;display:inline-flex;color:#fff!important;background:#2c5f99!important;border:0!important;border-radius:8px!important}.term-interactive-demo.websocket-demo .websocket-cta:hover:not(:disabled){background:#214a79!important}.term-interactive-demo.websocket-demo .websocket-cta:focus-visible{outline-offset:2px;outline:3px solid #9ec7f7}.term-interactive-demo.websocket-demo .websocket-cta:disabled{opacity:.5;cursor:not-allowed}.websocket-conn-bar{border:1px solid #e0e3ec;border-radius:8px;flex-wrap:wrap;align-items:center;gap:8px;padding:9px 12px;display:flex}.websocket-conn-bar.is-online{background:#e9f5ee;border-color:#bcd9c6}.websocket-conn-bar.is-offline{background:#f1f2f5;border-color:#dfe2ea}.websocket-conn-phase{font-size:13px;font-weight:800}.websocket-conn-bar.is-online .websocket-conn-phase{color:#2f6b46}.websocket-conn-bar.is-offline .websocket-conn-phase{color:#5a6275}.websocket-conn-code{font-family:var(--font-geist-mono), ui-monospace, monospace;background:#fff;border-radius:4px;padding:3px 7px;font-size:12px;font-weight:700}.websocket-conn-bar.is-online .websocket-conn-code{color:#2f6b46}.websocket-conn-bar.is-offline .websocket-conn-code{color:#6a7286}.websocket-conn-id{color:#6a7286;font-family:var(--font-geist-mono), ui-monospace, monospace;background:#fff;border-radius:4px;margin-left:auto;padding:3px 7px;font-size:11px;font-weight:700}.websocket-frames{background:#1c2030;border-radius:9px;gap:4px;max-height:280px;margin:0;padding:11px;list-style:none;display:grid;overflow-y:auto}.websocket-frames-empty{color:#9aa3b8;font-size:12px;line-height:1.5}.websocket-frame{color:#e6e9f0;background:#252a3d;border-left:3px solid #3a4252;border-radius:4px;grid-template-columns:20px minmax(112px,auto) minmax(0,1fr);align-items:center;gap:7px;padding:6px 8px;font-size:12px;line-height:1.4;display:grid}.websocket-frame .websocket-frame-arrow{color:#9aa3b8;text-align:center;font-size:14px;font-style:normal;font-weight:800}.websocket-frame .websocket-frame-label{color:#c8cedd;font-size:11px;font-weight:700}.websocket-frame .websocket-frame-payload{color:#e6e9f0;font-family:var(--font-geist-mono), ui-monospace, monospace;text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}.websocket-frame.is-c2s{border-left-color:#5aa9ff}.websocket-frame.is-c2s .websocket-frame-arrow{color:#5aa9ff}.websocket-frame.is-s2c{border-left-color:#ffb84d}.websocket-frame.is-s2c .websocket-frame-arrow{color:#ffb84d}.websocket-frame.is-upgrade{background:#1f3a2d;border-left-color:#7ee29c}.websocket-frame.is-upgrade .websocket-frame-arrow{color:#7ee29c}.websocket-frame.is-upgrade .websocket-frame-payload{color:#b9e9c8}.websocket-frame.is-close{background:#3a2530;border-left-color:#ff8a8a}.websocket-frame.is-close .websocket-frame-arrow{color:#ff8a8a}.websocket-frame.is-close .websocket-frame-payload{color:#f3c4c4}.websocket-status{color:#4d5566;background:#fff;border-left:3px solid #c3c8d4;border-radius:5px;margin:0;padding:10px 12px;font-size:13px;line-height:1.55}.websocket-knowledge-list{gap:7px;margin:0;padding:0;list-style:none;display:grid}.websocket-knowledge-list li{color:#4d5566;background:#fff;border:1px solid #e0e3ec;border-radius:7px;padding:8px 11px;font-size:13px;line-height:1.55}.websocket-knowledge-list li b{color:#2a3142}.websocket-knowledge-list code{color:#2f6b46;font-family:var(--font-geist-mono), ui-monospace, monospace;background:#f0f2f6;border-radius:3px;padding:1px 5px;font-size:12px}.websocket-how-steps{counter-reset:ws-step;gap:7px;margin:0;padding:0;list-style:none;display:grid}.websocket-how-steps li{counter-increment:ws-step;color:#4d5566;background:#fff;border:1px solid #e0e3ec;border-radius:7px;grid-template-columns:24px minmax(0,1fr);align-items:start;gap:8px;padding:8px 11px;font-size:13px;line-height:1.55;display:grid}.websocket-how-steps li:before{color:#fff;content:counter(ws-step);background:#3a4252;border-radius:50%;place-content:center;width:22px;height:22px;font-size:12px;font-weight:800;display:inline-grid}.websocket-how-steps li b{color:#2a3142}.websocket-how-steps code{color:#2f6b46;font-family:var(--font-geist-mono), ui-monospace, monospace;background:#f0f2f6;border-radius:3px;padding:1px 5px;font-size:12px}.websocket-focus-note{color:#4d5566;background:#f4f5f8;border-left:3px solid #b8becc;border-radius:5px;margin:10px 0 0;padding:10px 12px;font-size:13px;line-height:1.55}.websocket-focus-note strong{color:#23262f}.websocket-focus-note code{color:#2f6b46;font-family:var(--font-geist-mono), ui-monospace, monospace;background:#fff;border-radius:3px;padding:1px 5px;font-size:12px}.websocket-examples-pair{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;display:grid}.websocket-example{background:#fff;border:1px solid #e0e3ec;border-radius:9px;gap:6px;padding:11px;display:grid}.websocket-example.is-good{background:#f3faf5;border-color:#bcd9c6}.websocket-example.is-bad{background:#fdf3f4;border-color:#e0c4c9}.websocket-example header{flex-wrap:wrap;align-items:center;gap:7px;display:flex}.websocket-example header small{border-radius:4px;padding:2px 7px;font-size:11px;font-weight:800}.websocket-example.is-good header small{color:#fff;background:#2f6b46}.websocket-example.is-bad header small{color:#fff;background:#8a3a4a}.websocket-example header b{color:#23262f;font-size:13px;font-weight:800}.websocket-example-wire{color:#e6e9f0;font-family:var(--font-geist-mono), ui-monospace, monospace;text-overflow:ellipsis;white-space:nowrap;background:#1c2030;border-radius:5px;padding:5px 8px;font-size:11px;overflow:hidden}.websocket-example p{color:#4d5566;margin:0;font-size:12px;line-height:1.55}.websocket-when-grid article{border-left:3px solid #3a6ea5}.websocket-when-grid article:nth-child(2){border-left-color:#b0822e}.websocket-when-grid article:nth-child(3){border-left-color:#2f6b46}@media (max-width:720px){.websocket-examples-pair{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.term-interactive-demo.websocket-demo .websocket-cta{transition:none}}