.kx{--kx-accent: var(--accent, #5B8CFF);--kx-annotation: var(--annotation, #3DDC97);--kx-surface: var(--surface, #121417);--kx-surface-2: var(--surface-2, #1A1D21);--kx-text: var(--text, #EDEEF0);--kx-text-2: var(--text-2, #9A9FA6);--kx-border: var(--border, rgba(255, 255, 255, .08));--kx-warn: var(--warn, #E8B44B);--kx-err: var(--err, #E5645A);--kx-stage-bg: var(--stage-bg, #000);--kx-font-mono: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);--kx-track: var(--track, #9AA3B2);--kx-c1: var(--cat-1, #3DDC97);--kx-c2: var(--cat-2, #5B8CFF);--kx-c3: var(--cat-3, #E8B44B);--kx-c4: var(--cat-4, #E5645A);--kx-c5: var(--cat-5, #C08CFF);--kx-c6: var(--cat-6, #40C8E0);display:flex;flex-direction:column;gap:8px;padding:8px;border:1px solid var(--kx-border);border-radius:10px;background:var(--kx-surface);color:var(--kx-text);font:400 13px/1.5 var(--font-sans, system-ui, sans-serif);contain:layout paint}:root[data-theme=light] .kx{--kx-accent: var(--accent, #3D6FE8);--kx-annotation: var(--annotation, #1FA870);--kx-surface: var(--surface, #FFF);--kx-surface-2: var(--surface-2, #F1F1EE);--kx-text: var(--text, #17181A);--kx-text-2: var(--text-2, #5D6167);--kx-border: var(--border, rgba(0, 0, 0, .1));--kx-err: var(--err, #D03B2F);--kx-track: var(--track, #8A9099);--kx-c1: var(--cat-1, #12946A);--kx-c2: var(--cat-2, #3D6FE8);--kx-c3: var(--cat-3, #B47816);--kx-c4: var(--cat-4, #D03B2F);--kx-c5: var(--cat-5, #8A4FD8);--kx-c6: var(--cat-6, #0D8CA8)}@media(prefers-color-scheme:light){:root:not([data-theme]) .kx{--kx-accent: var(--accent, #3D6FE8);--kx-annotation: var(--annotation, #1FA870);--kx-surface: var(--surface, #FFF);--kx-surface-2: var(--surface-2, #F1F1EE);--kx-text: var(--text, #17181A);--kx-text-2: var(--text-2, #5D6167);--kx-border: var(--border, rgba(0, 0, 0, .1));--kx-err: var(--err, #D03B2F);--kx-track: var(--track, #8A9099);--kx-c1: var(--cat-1, #12946A);--kx-c2: var(--cat-2, #3D6FE8);--kx-c3: var(--cat-3, #B47816);--kx-c4: var(--cat-4, #D03B2F);--kx-c5: var(--cat-5, #8A4FD8);--kx-c6: var(--cat-6, #0D8CA8)}}.kx [hidden]{display:none!important}.kx :focus-visible{outline:2px solid var(--kx-accent);outline-offset:2px;border-radius:4px}.kx-stage{position:relative;aspect-ratio:16 / 9;overflow:hidden;border-radius:6px;background:var(--kx-stage-bg);cursor:pointer}.kx-stage.kx-hit{cursor:crosshair}.kx-video,.kx-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.kx-video{object-fit:contain}.kx-canvas{pointer-events:none;transition:opacity .15s ease-out}.kx[data-mode=raw] .kx-canvas{opacity:0}.kx-cover{position:absolute;inset:0;display:grid;place-items:center;border:0;padding:0;background:transparent;color:var(--kx-text);cursor:pointer}.kx[data-state=live] .kx-cover{display:none}.kx-cover-btn{display:grid;place-items:center;width:56px;height:56px;border:1px solid var(--kx-border);border-radius:50%;background:var(--kx-surface);transition:transform .15s ease-out}.kx-cover-btn svg{width:22px;height:22px;fill:currentColor}.kx-cover:hover .kx-cover-btn{transform:scale(1.06)}.kx-tl{position:relative;display:flex;flex-direction:column;gap:3px;padding:2px 0 0;cursor:pointer;touch-action:none}.kx-tl-row{position:relative;border-radius:3px}.kx-tl-row>i{position:absolute;top:0;bottom:0;display:block;overflow:hidden}.kx-tl-steps{height:18px}.kx-tl-segs{height:10px}.kx-tl-contact{height:4px}.kx-tl-vis{height:10px}.kx-tl-words{height:4px}.kx-tl-scrub{height:4px;background:var(--kx-border)}.kx-tl-fill{display:block;height:100%;width:0;border-radius:3px;background:var(--kx-accent)}.kx-step{border:1px solid var(--kx-border);border-radius:3px;background:var(--kx-surface-2);transition:border-color .15s ease-out}.kx-step.alt{background:color-mix(in srgb,var(--kx-surface-2) 60%,transparent)}.kx-step.on{border-color:var(--kx-accent)}.kx-step-label{display:block;padding:0 5px;font:10px/17px var(--kx-font-mono);color:var(--kx-text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kx-step.on .kx-step-label{color:var(--kx-text)}.kx-seg{border-radius:2px;background:var(--kx-c, var(--kx-annotation));opacity:.45;transition:opacity .15s ease-out}.kx-seg.on{opacity:1}.kx-ct{border-radius:2px;background:var(--kx-warn)}.kx-vs{border-radius:2px;background:var(--kx-c, var(--kx-annotation));opacity:.5;transition:opacity .15s ease-out}.kx-vs.on{opacity:1}.kx-tl:hover .kx-vs{opacity:.75}.kx-tl:hover .kx-vs.on{opacity:1}.kx-wd,.kx-sp{border-radius:2px;background:var(--kx-annotation);opacity:.55;transition:opacity .15s ease-out}.kx-tl:hover .kx-wd,.kx-tl:hover .kx-sp{opacity:.8}.kx-cursor{position:absolute;top:0;bottom:0;width:1px;margin-left:-.5px;background:var(--kx-text);pointer-events:none}.kx-tip{position:absolute;bottom:calc(100% + 6px);transform:translate(-50%);z-index:2;padding:3px 7px;border:1px solid var(--kx-border);border-radius:5px;background:var(--kx-surface-2);color:var(--kx-text);font:11px/1.4 var(--kx-font-mono);white-space:nowrap;pointer-events:none}.kx[data-mode=raw] .kx-tl-steps,.kx[data-mode=raw] .kx-tl-segs,.kx[data-mode=raw] .kx-tl-contact,.kx[data-mode=raw] .kx-tl-vis,.kx[data-mode=raw] .kx-tl-words,.kx[data-mode=raw] .kx-status,.kx[data-mode=raw] .kx-vis,.kx[data-mode=raw] .kx-gates,.kx[data-mode=raw] .kx-legend,.kx[data-mode=raw] .kx-asr{visibility:hidden}.kx[data-steps=off] .kx-tl-steps,.kx[data-segs=off] .kx-tl-segs,.kx[data-contact=off] .kx-tl-contact,.kx[data-vseg=off] .kx-tl-vis,.kx[data-words=off] .kx-tl-words,.kx[data-vis=off] .kx-vis,.kx[data-gates=off] .kx-gates,.kx[data-legend=off] .kx-legend,.kx[data-asr=off] .kx-asr,.kx[data-kind=th] .kx-dot,.kx[data-kind=th] .kx-verb,.kx[data-kind=th] .kx-tax,.kx[data-kind=ego] .kx-vis,.kx[data-kind=ego] .kx-gates,.kx[data-kind=ego] .kx-emo,.kx[data-kind=ego] .kx-lang,.kx[data-kind=ego] .kx-vbe,.kx[data-kind=motion] .kx-dot,.kx[data-kind=motion] .kx-vis,.kx[data-kind=motion] .kx-gates,.kx[data-kind=motion] .kx-emo,.kx[data-kind=motion] .kx-asr,.kx[data-chrome=off] .kx-tl,.kx[data-chrome=off] .kx-bar,.kx[data-chrome=off] .kx-legend,.kx[data-chrome=off] .kx-asr{display:none}.kx[data-chrome=off]{border:0;padding:0;background:transparent}.kx-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.kx-grow{flex:1 1 auto}.kx-icon{display:grid;place-items:center;width:28px;height:28px;padding:0;border:1px solid var(--kx-border);border-radius:6px;background:transparent;color:var(--kx-text);cursor:pointer;transition:background-color .15s ease-out}.kx-icon:hover{background:var(--kx-surface-2)}.kx-icon svg{width:16px;height:16px;fill:currentColor}.kx-time{font:12px/1 var(--kx-font-mono);font-variant-numeric:tabular-nums;color:var(--kx-text-2)}.kx-mode{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 10px;border:1px solid var(--kx-border);border-radius:999px;background:transparent;color:var(--kx-text-2);font:11px/1 var(--kx-font-mono);letter-spacing:.02em;cursor:pointer;transition:color .15s ease-out,border-color .15s ease-out}.kx-mode-dot{width:8px;height:8px;border:1px solid var(--kx-text-2);border-radius:50%;transition:background-color .15s ease-out,border-color .15s ease-out}.kx-mode[aria-checked=true]{color:var(--kx-text);border-color:color-mix(in srgb,var(--kx-annotation) 45%,var(--kx-border))}.kx-mode[aria-checked=true] .kx-mode-dot{background:var(--kx-annotation);border-color:var(--kx-annotation)}.kx-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:20px}.kx-dot{display:inline-flex;align-items:center;gap:6px;font:11px/1 var(--kx-font-mono);color:var(--kx-text-2)}.kx-dot:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--kx-border);transition:background-color .15s ease-out}.kx-dot.on{color:var(--kx-text)}.kx-dot.on:before{background:var(--kx-annotation);box-shadow:0 0 7px var(--kx-annotation)}.kx-chip{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border:1px solid var(--kx-border);border-radius:999px;background:transparent;color:var(--kx-text);font:11px/1.5 var(--kx-font-mono)}.kx-tax{color:var(--kx-text-2)}.kx-legend{display:flex;flex-wrap:wrap;gap:6px;min-height:20px}.kx-legend-chip{cursor:pointer;transition:opacity .15s ease-out}.kx-legend-chip[aria-pressed=false]{opacity:.4}.kx-swatch{width:8px;height:8px;border-radius:2px;background:var(--kx-c, var(--kx-annotation))}.kx-legend-chip[aria-pressed=false] .kx-swatch{background:transparent;box-shadow:inset 0 0 0 1px var(--kx-c, var(--kx-annotation))}.kx-trk-chip{color:var(--kx-text-2)}.kx-trk-chip[aria-pressed=true]{color:var(--kx-text);border-color:color-mix(in srgb,var(--kx-track) 55%,var(--kx-border))}.kx-trk-chip[aria-pressed] .kx-swatch{background:transparent;border:1px dashed var(--kx-track);box-shadow:none}.kx-trk-chip[data-trk=raw][aria-pressed] .kx-swatch{border:1px solid color-mix(in srgb,var(--kx-annotation) 45%,transparent);background:color-mix(in srgb,var(--kx-annotation) 25%,transparent)}.kx-asr{margin:0;min-height:20px;color:var(--kx-text-2);font-size:13px}.kx-w{transition:color .1s ease-out}.kx-w.on{color:var(--kx-annotation);font-weight:600}.kx-vis{display:flex;align-items:center;gap:12px;min-height:30px;overflow:hidden}.kx-vis-cur{display:inline-flex;align-items:baseline;gap:7px;flex:0 0 auto;min-width:92px}.kx-vis-ipa{font:600 22px/1.1 var(--kx-font-mono);color:var(--kx-annotation)}.kx-vis-class{font:11px/1 var(--kx-font-mono);color:var(--kx-text-2);letter-spacing:.04em}.kx-vis-ribbon{display:flex;align-items:center;gap:4px;overflow:hidden;flex:1 1 auto}.kx-vis-p{flex:0 0 auto;min-width:20px;padding:2px 4px;border-radius:4px;background:var(--kx-surface-2);color:var(--kx-text-2);font:12px/1.3 var(--kx-font-mono);text-align:center;transition:color .1s ease-out,background-color .1s ease-out}.kx-vis-p.on{background:color-mix(in srgb,var(--kx-annotation) 22%,transparent);color:var(--kx-annotation)}.kx-emo{color:var(--kx-text)}.kx-lang{color:var(--kx-text-2);text-transform:uppercase}.kx-vbe{color:var(--kx-text-2)}.kx-gates{font:11px/1.5 var(--kx-font-mono)}.kx-gates-sum{display:inline-flex;align-items:center;gap:6px;width:fit-content;padding:1px 4px;border-radius:4px;color:var(--kx-text-2);cursor:pointer;list-style:none}.kx-gates-sum::-webkit-details-marker{display:none}.kx-gates-sum:before{content:"";width:0;height:0;border-left:4px solid currentColor;border-top:3.5px solid transparent;border-bottom:3.5px solid transparent;transition:transform .15s ease-out}.kx-gates[open] .kx-gates-sum:before{transform:rotate(90deg)}.kx-gates-sum:hover{color:var(--kx-text)}.kx-gates[data-ok=no] .kx-gates-sum{color:var(--kx-err)}.kx-gates-row{display:flex;flex-wrap:wrap;gap:6px;padding-top:6px}.kx-gate{color:var(--kx-text-2)}.kx-gate-st{font-size:10px}.kx-gate[data-ok=yes]{color:var(--kx-annotation);border-color:color-mix(in srgb,var(--kx-annotation) 45%,var(--kx-border))}.kx-gate[data-ok=no]{color:var(--kx-err);border-color:color-mix(in srgb,var(--kx-err) 45%,var(--kx-border))}.kx [data-c="0"]{--kx-c: var(--kx-c1)}.kx [data-c="1"]{--kx-c: var(--kx-c2)}.kx [data-c="2"]{--kx-c: var(--kx-c3)}.kx [data-c="3"]{--kx-c: var(--kx-c4)}.kx [data-c="4"]{--kx-c: var(--kx-c5)}.kx [data-c="5"]{--kx-c: var(--kx-c6)}@media(prefers-reduced-motion:reduce){.kx,.kx *{transition:none!important;animation:none!important}}
