#callflow.flow-grid{grid-template-columns:minmax(0, var(--split,60fr)) 10px minmax(0, var(--right,40fr));align-items:stretch;min-width:0;min-height:320px}#callflow:fullscreen{padding:8px;height:100dvh!important}#callflow>.pane{height:100%;min-height:0;overflow:hidden}#callflow .flow-toolbar{white-space:nowrap;border-bottom:1px solid var(--color-border);flex-shrink:0;align-items:center;gap:4px;min-height:42px;padding:4px 8px;font-size:12px;display:flex}#callflow .flow-toolbar .tool-btn,#callflow .flow-toolbar .tool-group button{height:28px;padding:3px 6px;font-size:11px}#callflow .flow-toolbar .tool-group{gap:0}#callflow .flow-command-menu{z-index:45;border:1px solid var(--color-border);background:var(--card);white-space:normal;border-radius:7px;flex-direction:column;gap:6px;min-width:215px;padding:10px;display:flex;position:absolute;top:100%;right:0;box-shadow:0 4px 14px #0002}#callflow .diagram-scroll{flex:1;min-height:0}#callflow .diagram-head{height:32px}#callflow .lane-box{width:110px;height:24px;box-shadow:none;background:0 0;border:0;border-radius:0;justify-content:center;align-items:center;gap:5px;margin-left:29px;padding:0;display:flex;top:4px;left:0}#callflow .lane-box svg{width:14px;height:14px;margin:0}#callflow .lane-box b{font-size:13px;line-height:18px}#callflow .flow-footer{white-space:nowrap;flex-wrap:nowrap;flex-shrink:0;gap:8px;height:28px;padding:3px 10px;font-size:10px}#callflow .insp .pane-head{flex-shrink:0;height:36px;min-height:36px;padding:4px 10px}#callflow .insp-title{align-items:center;height:44px;min-height:44px;padding:5px 10px;overflow:hidden}#callflow .flow-tone-badge{text-transform:uppercase;border:1px solid;border-radius:999px;padding:1px 6px;font-size:9px;font-weight:700;display:inline-flex}#callflow .insp-title .font-mono{font-size:10px}#callflow .insp-tabs{flex-shrink:0;height:34px;padding:0 8px}#callflow .insp-tabs button{height:34px;padding:0 10px;font-size:12px}#callflow .insp-body{flex:1;min-height:0;padding:8px 10px}#callflow .height-handle{height:6px;min-height:6px}@media (width<=1100px){#callflow .splitter{display:flex}#callflow .flow-toolbar{overflow-x:auto}}@media (width<=650px){#callflow.flow-grid{grid-template-columns:minmax(0, var(--split,55fr)) 8px minmax(0, var(--right,45fr))}#callflow .insp-title .font-mono{font-size:9px}}#callflow .flow-toolbar{background:#fff;flex-wrap:wrap;gap:8px;min-height:42px;padding:5px 8px;overflow:visible}#callflow .flow-primary,#callflow .flow-display-controls{align-items:center;gap:6px;min-width:0;display:flex}#callflow .flow-primary{flex-wrap:wrap}#callflow .flow-display-controls{margin-left:auto}#callflow .flow-toolbar h2{white-space:nowrap;align-items:center;gap:6px;font-size:20px;display:flex}#callflow .flow-toolbar h2:before{content:none}#callflow .flow-toolbar .tool-btn,#callflow .flow-toolbar .tool-group button{height:32px;box-shadow:none;padding:4px 7px;font-size:12px}#callflow .flow-toolbar .tool-btn svg{width:14px;height:14px}#callflow .flow-toolbar button:focus-visible,#callflow .flow-toolbar summary:focus-visible,#callflow .flow-session-band summary:focus-visible{outline-offset:2px;outline:2px solid #ff7900}#callflow .flow-toolbar .flow-export-trigger{color:#b45309;background:#fff7ed;border-color:#ff7900}#callflow .flow-zoom{white-space:nowrap;align-items:center;gap:2px;display:flex}#callflow .flow-zoom span{text-align:center;font-variant-numeric:tabular-nums;min-width:44px;font-size:12px}#callflow .flow-zoom button{width:28px;padding:4px}#callflow .flow-command-menu{max-width:calc(100vw - 16px);box-shadow:0 2px 6px #0001}#callflow .flow-compact-toggle{align-items:center;gap:7px;padding-inline:4px;font-size:12px;font-weight:600;display:inline-flex}#callflow .flow-compact-toggle button{background:var(--input);border-radius:999px;width:38px;height:22px;transition:background .16s;position:relative}#callflow .flow-compact-toggle button[aria-checked=true]{background:var(--primary)}#callflow .flow-compact-toggle i{background:var(--card);width:16px;height:16px;box-shadow:var(--shadow-instrument);border-radius:999px;transition:transform .16s;position:absolute;top:3px;left:3px}#callflow .flow-compact-toggle button[aria-checked=true] i{transform:translate(16px)}#callflow .lane-box{margin-left:0;transform:translate(-50%)}#callflow .diagram-head{-webkit-backdrop-filter:none;backdrop-filter:none;z-index:3;border-bottom:1px solid var(--input);background:#fff;height:68px;position:sticky;top:0}#callflow .lane-box{align-items:flex-start;gap:5px;width:230px;max-width:calc(100% - 8px);height:58px;padding-top:6px;top:5px}#callflow .lane-box svg{flex-shrink:0;margin-top:2px}#callflow .participant-label{text-align:center;white-space:normal;overflow-wrap:anywhere;line-height:16px}#callflow .participant-label b{white-space:normal;font-size:12px;display:block}#callflow .participant-label span{font-size:11px;line-height:15px;display:block}#callflow .flow-event-facts{white-space:normal;overflow-wrap:anywhere;align-items:flex-start;gap:6px;font-size:12px;line-height:17px;display:flex}#callflow .flow-event-facts span{flex:1;min-width:0}#callflow .flow-facts-preview{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}#callflow .flow-event-facts button{color:#b45309;background:#fff7ed;border:1px solid #fed7aa;border-radius:3px;flex-shrink:0;padding:0 4px;font-size:10px}#callflow .flow-event-facts button:focus-visible{outline:2px solid #ff7900}#callflow.flow-grid{grid-template-columns:minmax(0, var(--split,65fr)) 10px minmax(0, var(--right,35fr));width:100%;max-width:none;position:relative}#callflow .payload-wrap{flex-direction:column;min-width:0;height:100%;min-height:0;display:flex;overflow:hidden}#callflow .payload-wrap .insp{flex-direction:column;flex:1;height:auto;min-height:0;display:flex}#callflow .payload-toggle{flex-shrink:0;align-self:flex-end;height:30px;margin-bottom:3px;font-size:12px}#callflow.payload-collapsed{grid-template-columns:minmax(0,1fr)}#callflow.payload-collapsed>.splitter,#callflow.payload-collapsed .insp{display:none}#callflow.payload-collapsed .payload-wrap{z-index:5;height:auto;position:absolute;bottom:32px;right:12px}#callflow .flow-row-title{white-space:normal;overflow-wrap:anywhere;text-align:center;background:var(--card);border-radius:3px;justify-content:center;align-items:center;gap:6px;font-size:15px;font-weight:600;line-height:20px;display:flex}#callflow .flow-details-column{background:var(--card);border-left:1px solid var(--input);justify-content:center;align-items:flex-start;height:100%;padding:8px 4px;display:flex}#callflow .flow-details-column button{color:#b45309;background:#fff7ed;border:1px solid #fed7aa;border-radius:4px;padding:5px 6px;font-size:12px}#callflow .flow-details-column button:focus-visible{outline-offset:2px;outline:2px solid #ff7900}#callflow .insp-title{align-items:flex-start;height:auto;min-height:64px}#callflow .insp-message-name{align-items:center;gap:10px;min-width:0;display:flex}#callflow .insp-message-name b{overflow-wrap:anywhere;min-width:0;font-size:18px;line-height:24px}#callflow .insp-title .proto-badge{display:inline-flex}#callflow .asn-search-field{border:1px solid var(--border);background:var(--card);border-radius:6px;flex:1;align-items:center;gap:8px;min-width:0;height:38px;padding-inline:11px;display:flex}#callflow .asn-search-field:focus-within{border-color:var(--primary)}#callflow .asn-search-field svg{width:16px;color:var(--muted-foreground)}#callflow .asn-search-field input{background:0 0;border:0;outline:0;flex:1;min-width:0;font-size:12px}#callflow .asn-copy{height:38px}#callflow .asn-node{line-height:25px}#callflow .insp-title .font-mono{white-space:normal;overflow-wrap:anywhere;font-size:12px}#callflow .insp-body{overflow-wrap:anywhere;overflow:auto}#callflow .flow-footer{white-space:normal;height:auto;min-height:32px;font-size:12px}@media (width<=850px){#callflow.flow-grid{grid-template-columns:minmax(0,1fr);height:auto!important}#callflow>.flow-pane{height:640px}#callflow>.splitter{display:none}#callflow .payload-wrap{height:640px}#callflow.payload-collapsed .payload-wrap{height:auto}}#callflow{--flow-sel:oklch(95% .035 245);--flow-fail:oklch(96% .03 20)}#callflow .flow-row-bg,#callflow .flow-row-alt{fill:var(--card)}#callflow .flow-row-sel{fill:var(--flow-sel)}#callflow .flow-row-fail{fill:var(--flow-fail)}#callflow .flow-row-sep{stroke:var(--border);stroke-width:1px}#callflow .flow-gutter-head{width:168px;color:var(--foreground);border-right:1px solid var(--border);align-items:center;padding:4px 0 4px 16px;font-size:11px;font-weight:600;display:grid;position:absolute;top:0;left:0}#callflow .flow-gutter-head span:last-child{text-align:right;padding-right:5px}#callflow .flow-gutter-head[data-density=compact]{width:156px;padding-top:2px;padding-bottom:2px;font-size:10px}#callflow .flow-gutter-divider{stroke:var(--border);stroke-opacity:.62;stroke-width:1px}#callflow .flow-row-title{text-align:center;white-space:nowrap;text-overflow:ellipsis;background:0 0;justify-content:center;align-items:center;gap:6px;font-size:15px;font-weight:600;line-height:20px;display:flex;overflow:hidden}#callflow .flow-event-facts{text-align:center;white-space:nowrap;text-overflow:ellipsis;justify-content:center;font-size:9.5px;line-height:13px;display:block;overflow:hidden}#callflow .flow-event-facts>span{text-overflow:ellipsis;display:block;overflow:hidden}#callflow .flow-event-facts>span>span{display:inline}#callflow .flow-toolbar h2,#callflow .insp-title h2,#callflow .insp-head h2{font-size:16px}#callflow .insp-message-name b{font-size:15px;line-height:20px}#callflow .insp-title{min-height:52px}#callflow .flow-row-title{font-size:15px;line-height:20px}#callflow .flow-event-facts{font-size:9.5px;line-height:13px}#callflow .participant-label b,#callflow .participant-label span{font-size:13px;line-height:16px}#callflow .flow-toolbar .tool-btn,#callflow .flow-toolbar .tool-group button{height:28px;font-size:12px}#callflow .asn-search-field,#callflow .flow-details-column button,#callflow pre,#callflow .asn-tree,#callflow code{font-size:12px}@media (width<=1440px){#callflow .flow-toolbar{gap:4px;padding-top:4px;padding-bottom:4px}#callflow .flow-toolbar .tool-btn,#callflow .flow-toolbar .tool-group button{padding:3px 6px}}#callflow .insp{flex-direction:column;display:flex}#callflow .insp .insp-body{flex:auto;min-height:0;overflow:auto}#callflow .flow-footer,#callflow .insp-footer{white-space:nowrap;border-top:1px solid var(--border);height:28px;min-height:28px;color:var(--muted-foreground);flex-shrink:0;align-items:center;padding:0 10px;font-size:11px;display:flex;overflow:hidden}#callflow .flow-lifeline{stroke:var(--border);stroke-width:1.5px}@keyframes etv-progress{0%{transform:translate(-100%)}to{transform:translate(300%)}}#callflow .flow-lifeline-top{stroke:var(--muted-foreground);stroke-opacity:.45;stroke-width:1.25px;stroke-dasharray:4 4;pointer-events:none}#callflow .flow-waiting-state{background:radial-gradient(ellipse at 50% 0%, color-mix(in srgb, var(--primary) 7%, transparent), transparent 68%), var(--card);place-items:center;min-height:100%;padding:28px clamp(16px,4vw,56px);display:grid}#callflow .flow-waiting-card{border:1px solid color-mix(in srgb, var(--primary) 18%, var(--border));background:color-mix(in srgb, var(--card) 96%, var(--primary));width:min(100%,820px);box-shadow:0 14px 38px color-mix(in srgb, var(--foreground) 7%, transparent);border-radius:16px;overflow:hidden}#callflow .flow-waiting-copy{align-items:flex-start;gap:16px;padding:clamp(20px,3vw,32px) clamp(20px,4vw,40px) 22px;display:flex}#callflow .flow-waiting-icon{border:1px solid color-mix(in srgb, var(--primary) 22%, var(--border));background:color-mix(in srgb, var(--primary) 9%, var(--card));width:44px;height:44px;color:var(--primary);border-radius:13px;flex:0 0 44px;place-items:center;display:grid}#callflow .flow-waiting-icon svg{width:21px;height:21px}#callflow .flow-waiting-eyebrow{color:var(--primary);letter-spacing:.11em;margin:0 0 5px;font-size:10px;font-weight:750}#callflow .flow-waiting-copy h3{color:var(--foreground);letter-spacing:-.02em;margin:0;font-size:clamp(17px,2vw,21px);font-weight:700}#callflow .flow-waiting-copy p:last-child{color:var(--muted-foreground);margin:6px 0 0;font-size:13px;line-height:1.55}#callflow .flow-waiting-participants{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:0 clamp(20px,4vw,40px) 24px;display:grid}#callflow .flow-waiting-participant{border:1px solid var(--border);background:var(--card);border-radius:11px;align-items:center;gap:10px;min-width:0;min-height:66px;padding:11px 13px;display:flex}#callflow .flow-waiting-node{background:color-mix(in srgb, var(--primary) 8%, var(--card));width:34px;height:34px;color:var(--primary);border-radius:9px;flex:0 0 34px;place-items:center;display:grid}#callflow .flow-waiting-node svg{width:17px;height:17px}#callflow .flow-waiting-participant b{overflow-wrap:anywhere;color:var(--foreground);font-size:12px;line-height:1.35;display:block}#callflow .flow-waiting-participant small{color:var(--muted-foreground);text-overflow:ellipsis;white-space:nowrap;font-family:ui-monospace,monospace;font-size:10px;display:block;overflow:hidden}#callflow .flow-waiting-footer{border-top:1px solid var(--border);background:color-mix(in srgb, var(--muted) 34%, var(--card));min-height:58px;color:var(--muted-foreground);justify-content:space-between;align-items:center;gap:12px;padding:10px clamp(20px,4vw,40px);font-size:11px;display:flex}#callflow .flow-waiting-open{border:1px solid var(--primary);background:var(--primary);min-height:36px;color:var(--primary-foreground);border-radius:9px;flex:none;justify-content:center;align-items:center;gap:7px;padding:0 13px;font-size:12px;font-weight:650;transition:background .14s,transform .14s;display:inline-flex}#callflow .flow-waiting-open:hover:not(:disabled){background:color-mix(in srgb, var(--primary) 88%, black)}#callflow .flow-waiting-open:active:not(:disabled){transform:translateY(1px)}#callflow .flow-waiting-open:focus-visible{outline:2px solid var(--primary);outline-offset:3px}#callflow .flow-waiting-open:disabled{cursor:not-allowed;opacity:.5}#callflow .flow-waiting-open svg{width:15px;height:15px}#callflow .flow-loading-state{text-align:left;justify-content:center;align-items:center;gap:16px;min-height:220px;padding:28px;display:flex}#callflow .flow-loading-spinner{border:3px solid color-mix(in srgb, var(--primary) 16%, var(--border));border-top-color:var(--primary);border-right-color:color-mix(in srgb, var(--primary) 55%, var(--border));border-radius:50%;flex:0 0 42px;width:42px;height:42px;animation:.82s linear infinite etv-flow-spinner;display:block;position:relative}#callflow .flow-loading-spinner:after{border:1px solid color-mix(in srgb, var(--primary) 18%, transparent);content:"";border-radius:50%;position:absolute;inset:7px}#callflow .flow-loading-copy{flex-direction:column;gap:4px;display:flex}#callflow .flow-loading-copy strong{color:var(--foreground);letter-spacing:-.01em;font-size:14px;font-weight:650}#callflow .flow-loading-copy small{color:var(--muted-foreground);font-size:12px;line-height:1.45}#callflow .flow-frame-state{border-bottom:1px solid var(--border);background:var(--card);min-height:300px;color:var(--muted-foreground);position:relative;overflow:hidden}#callflow .flow-frame-message{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:300px;padding:28px;display:flex}#callflow .flow-frame-message p{max-width:520px;margin:0;font-size:12px}#callflow .flow-loading-skeleton{align-content:start;min-height:300px;display:grid}#callflow .flow-skeleton-row{border-bottom:1px solid color-mix(in srgb, var(--border) 65%, transparent);grid-template-columns:156px minmax(360px,1fr);align-items:center;height:50px;display:grid;position:relative;overflow:hidden}#callflow .flow-skeleton-time,#callflow .flow-skeleton-label{z-index:1;background:color-mix(in srgb, var(--muted-foreground) 14%, var(--card));border-radius:999px;height:9px;display:block;position:relative}#callflow .flow-skeleton-time{width:82px;margin-left:16px}#callflow .flow-skeleton-arrow{background:color-mix(in srgb, var(--primary) 22%, var(--border));justify-self:center;width:clamp(150px,42%,430px);height:2px}#callflow .flow-skeleton-label{width:116px;position:absolute;top:11px;left:calc(50% - 58px)}#callflow .flow-skeleton-row:after{content:"";background:linear-gradient(100deg,#0000 20%,#ffffffa8 48%,#0000 76%);animation:1.35s ease-in-out infinite etv-flow-shimmer;position:absolute;inset:0;transform:translate(-100%)}@keyframes etv-flow-shimmer{to{transform:translate(100%)}}@keyframes etv-flow-spinner{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){#callflow .flow-loading-spinner{animation-duration:1.8s}#callflow .flow-skeleton-row:after{animation:none}}@media (width<=700px){#callflow .flow-waiting-state{padding:18px 12px}#callflow .flow-waiting-participants{gap:6px;padding-left:14px;padding-right:14px}#callflow .flow-waiting-participant{gap:6px;min-height:58px;padding:8px 7px}#callflow .flow-waiting-node{flex-basis:28px;width:28px;height:28px}#callflow .flow-waiting-footer{flex-direction:column;align-items:flex-start}#callflow .flow-waiting-open{align-self:flex-end}}#callflow .flow-payload-waiting{flex-direction:column;min-width:0;display:flex}#callflow .flow-payload-waiting-body{text-align:center;flex:1;align-content:center;justify-items:center;gap:12px;padding:28px;display:grid}#callflow .flow-payload-waiting-body b{color:var(--foreground);font-size:13px}#callflow .flow-payload-waiting-body p{max-width:300px;color:var(--muted-foreground);margin:0;font-size:12px;line-height:1.55}#callflow .flow-semantic-legends{border-top:1px solid var(--border);background:color-mix(in srgb, var(--muted) 35%, transparent);flex-wrap:wrap;gap:5px 18px;padding:6px 12px;font-size:10px;display:flex}#callflow .flow-semantic-legend{flex-wrap:wrap;align-items:center;gap:5px 10px;display:flex}#callflow .flow-semantic-legend>b{color:var(--foreground)}#callflow .flow-semantic-legend>span{white-space:nowrap;align-items:center;gap:4px;display:inline-flex}#callflow .flow-semantic-legend i{border-radius:999px;width:8px;height:8px}
