.tcp-lab{border:1px solid var(--ide-border);background:var(--ide-chrome);font-family:var(--__sl-font-mono);font-size:var(--sl-text-sm);color:var(--ide-text);border-radius:.375rem;margin-block:1.5rem}.tcp-lab__header{border-bottom:1px solid var(--ide-border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1rem;padding:.625rem 1rem;display:flex}.tcp-lab__title{color:var(--ide-comment);margin:0}.tcp-lab__modes{border:0;align-items:center;gap:.25rem;margin:0;padding:0;display:flex}.tcp-lab__modes legend{float:left;font-size:var(--sl-text-xs);color:var(--ide-muted);margin-inline-end:.5rem;padding:0}.tcp-lab__mode{border:1px solid var(--ide-control);color:var(--ide-muted);cursor:pointer;border-radius:.25rem;padding:.25rem .75rem;position:relative}.tcp-lab__mode input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.tcp-lab__mode:has(input:checked){border-color:var(--ide-accent);background:var(--ide-accent-low);color:var(--ide-strong)}.tcp-lab__mode:has(input:focus-visible){outline:2px solid var(--ide-accent);outline-offset:2px}.tcp-lab__lanes{justify-content:space-between;gap:1rem;padding:.75rem 1rem 0;display:flex}.tcp-lab__lanes p{flex-direction:column;gap:.125rem;margin:0;display:flex}.tcp-lab__lanes p:last-child{text-align:end;align-items:flex-end}.tcp-lab__side{color:var(--ide-strong);font-weight:600}.tcp-lab__lanes code{color:var(--ide-keyword);background:0 0;padding:0}.tcp-lab__ladder{max-height:26rem;margin:.5rem 1rem 0;overflow-y:auto}.tcp-lab__rows{min-height:5rem;margin:0;padding:.25rem 0;list-style:none;position:relative}.tcp-lab__rows:before,.tcp-lab__rows:after{content:"";background:var(--ide-comment);width:2px;position:absolute;inset-block:0}.tcp-lab__rows:before{inset-inline-start:.25rem}.tcp-lab__rows:after{inset-inline-end:.25rem}.tcp-lab__row{padding:.5rem .75rem}.tcp-lab__arrow{justify-items:center;gap:.125rem;display:grid}.tcp-lab__label{text-align:center;color:var(--ide-strong)}.tcp-lab__index{color:var(--ide-muted)}.tcp-lab__tag,.tcp-lab__detail,.tcp-lab__fate{font-size:var(--sl-text-xs);color:var(--ide-muted)}.tcp-lab__line{border-top:2px solid;justify-self:stretch;height:0;margin-block:.25rem;position:relative}.tcp-lab__row--client .tcp-lab__line{color:var(--ide-info)}.tcp-lab__row--server .tcp-lab__line{color:var(--ide-string)}.tcp-lab__line:after{content:"";border-block:5px solid #0000;position:absolute;top:-6px}.tcp-lab__row--client .tcp-lab__line:after{border-inline-start:8px solid;inset-inline-end:-2px}.tcp-lab__row--server .tcp-lab__line:after{border-inline-end:8px solid;inset-inline-start:-2px}.tcp-lab__row--in-transit .tcp-lab__line{border-top-style:dashed}.tcp-lab__row--client.tcp-lab__row--in-transit .tcp-lab__line{margin-inline-end:30%}.tcp-lab__row--server.tcp-lab__row--in-transit .tcp-lab__line{margin-inline-start:30%}.tcp-lab__row--lost .tcp-lab__line{color:var(--ide-accent);border-top-style:dashed}.tcp-lab__row--client.tcp-lab__row--lost .tcp-lab__line{margin-inline-end:50%}.tcp-lab__row--server.tcp-lab__row--lost .tcp-lab__line{margin-inline-start:50%}.tcp-lab__row--lost .tcp-lab__line:after{content:"✕" / "";line-height:1;font-size:var(--sl-text-sm);border:0;top:-.65em}.tcp-lab__row--client.tcp-lab__row--lost .tcp-lab__line:after{inset-inline-end:-.6em}.tcp-lab__row--server.tcp-lab__row--lost .tcp-lab__line:after{inset-inline-start:-.6em}.tcp-lab__row--lost .tcp-lab__fate{color:var(--ide-accent)}.tcp-lab__change{font-size:var(--sl-text-xs);color:var(--ide-keyword);margin-top:.25rem;display:block}.tcp-lab__change--server{text-align:end}.tcp-lab__lose{border:1px solid var(--ide-accent);color:var(--ide-accent);font:inherit;font-size:var(--sl-text-xs);cursor:pointer;background:0 0;border-radius:.25rem;margin:.375rem auto 0;padding:.125rem .625rem;display:block}.tcp-lab__lose:hover{background:var(--ide-accent-low)}.tcp-lab__row--timeout{font-size:var(--sl-text-xs);color:var(--ide-comment)}.tcp-lab__row--timeout.tcp-lab__row--server{text-align:end}@media (prefers-reduced-motion:no-preference){.tcp-lab__row{animation:.15s ease-out tcp-lab-in}}@keyframes tcp-lab-in{0%{opacity:0}}.tcp-lab__app{border:1px solid var(--ide-border);background:var(--ide-bg);border-radius:.25rem;margin:.75rem 1rem 0;padding:.625rem .75rem}.tcp-lab__app-title{font-size:var(--sl-text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--ide-muted);margin:0 0 .25rem}.tcp-lab__app dl{gap:.25rem;margin:0;display:grid}.tcp-lab__app dl div{flex-wrap:wrap;gap:0 .75rem;display:flex}.tcp-lab__app dt{color:var(--ide-muted)}.tcp-lab__app dd{white-space:pre-wrap;color:var(--ide-strong);margin:0}.tcp-lab__narration{font-family:var(--sl-font);font-size:var(--sl-text-base);margin:.75rem 1rem 0;line-height:1.55}.tcp-lab__narration p{margin:0}.tcp-lab__narration .tcp-lab__done{color:var(--ide-string);margin-top:.5rem;font-weight:600}.tcp-lab__controls{flex-wrap:wrap;gap:.5rem;padding:.75rem 1rem;display:flex}.tcp-lab__controls button{border:1px solid var(--ide-border);background:var(--ide-bg);color:var(--ide-strong);font:inherit;cursor:pointer;border-radius:.25rem;padding:.375rem .875rem}.tcp-lab__controls .tcp-lab__next{border-color:var(--ide-accent);background:var(--ide-accent);color:var(--ide-on-accent)}.tcp-lab__controls .tcp-lab__next[aria-disabled=true]{opacity:.5;cursor:not-allowed}