:root{--ground: #edeef0;--surface: #ffffff;--sunken: #e3e5e9;--ink: #16181d;--ink-muted: #6b7280;--ink-faint: #9ca3af;--rule: #c9cdd4;--rule-strong: #9aa1ac;--accent: #5b3df5;--accent-soft: #ede9fe;--mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--ui: Archivo, "Helvetica Neue", -apple-system, system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--ui);-webkit-font-smoothing:antialiased}.app{max-width:1040px;margin:0 auto;padding:32px 24px 64px}.masthead{border-bottom:1px solid var(--ink);padding-bottom:14px;margin-bottom:24px}.eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:8px}.masthead h1{font-size:clamp(26px,4vw,40px);font-weight:600;letter-spacing:-.02em;margin:0}.masthead .times{color:var(--ink-faint);font-weight:400;padding:0 2px}.masthead .sub{font-family:var(--mono);font-size:11px;color:var(--ink-muted);margin-top:6px}.grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}.trace-row{grid-column:1 / -1;margin-top:8px}@media(max-width:900px){.grid{grid-template-columns:minmax(0,1fr)}}.stage{min-width:0}.junction{display:block;width:100%;max-width:640px;margin:0 auto;aspect-ratio:1;border:1px solid var(--rule);background:var(--ground)}.ribbon{display:block;width:100%;max-width:640px;margin:0 auto;border:1px solid var(--rule);border-top:none;background:var(--surface)}.transport{display:flex;align-items:center;gap:16px;margin-top:12px}.btn{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:8px 18px;border:1px solid var(--ink);background:var(--ink);color:var(--surface);cursor:pointer}.btn:hover{background:var(--accent);border-color:var(--accent)}.speed{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;color:var(--ink-muted)}.speed output{color:var(--ink);min-width:30px}.clock{margin-left:auto;font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink-muted)}.panel{display:flex;flex-direction:column;gap:16px}.block{border:1px solid var(--rule);background:var(--surface);padding:14px;margin:0}.block legend{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);padding:0 6px}.select{width:100%;font-family:var(--ui);font-size:13px;padding:7px 8px;border:1px solid var(--rule-strong);background:var(--surface);color:var(--ink)}.note{font-size:11px;line-height:1.5;color:var(--ink-muted);margin:10px 0 0}.flows{display:flex;gap:14px;margin:12px 0 0;padding-top:10px;border-top:1px solid var(--rule)}.flows div{flex:1}.flows dt{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}.flows dd{font-family:var(--mono);font-size:12px;margin:3px 0 0;font-variant-numeric:tabular-nums}.toggle{display:flex;align-items:center;gap:8px;font-size:12px;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--rule);cursor:pointer}.toggle input{accent-color:var(--accent)}.param+.param{margin-top:12px}.param.is-disabled{opacity:.38}.param-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px}.param-head label{font-size:12px}.param-head output{font-family:var(--mono);font-size:13px;font-variant-numeric:tabular-nums}.param-head output em,.readout-value em{font-style:normal;font-size:9px;color:var(--ink-faint);margin-left:2px}input[type=range]{width:100%;accent-color:var(--accent)}input[type=range]:focus-visible,.btn:focus-visible,.select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.readout{display:flex;justify-content:space-between;align-items:baseline;padding:5px 0;border-bottom:1px solid var(--rule)}.readout:last-of-type{border-bottom:none}.readout-label{font-size:11px;color:var(--ink-muted)}.readout-value{font-family:var(--mono);font-size:13px;font-variant-numeric:tabular-nums}.readout.is-big .readout-value{font-size:26px;font-weight:500;letter-spacing:-.02em}.readout.is-big{padding-bottom:8px}.violations{border:1px solid var(--accent);background:var(--accent-soft);padding:12px}.violations-head{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}.violations p{font-size:11px;line-height:1.55;margin:0 0 6px;color:var(--ink)}.violations p:last-child{margin-bottom:0}.violations code{font-family:var(--mono);font-size:10px;background:var(--surface);border:1px solid var(--rule);padding:1px 4px;margin-right:6px}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}.agent-badge{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10.5px;color:var(--ink-muted);margin-top:10px;padding:6px 9px;border:1px solid var(--rule);background:var(--surface)}.agent-badge .dot{width:6px;height:6px;background:var(--accent);flex:none}.agent-badge.is-off{color:var(--ink-faint)}.agent-badge.is-off .dot{background:var(--rule-strong)}.agent-badge.is-busy{border-color:var(--accent);background:var(--accent-soft);color:var(--ink)}.agent-meta{margin-left:auto;color:var(--ink-faint)}.param-right{display:flex;align-items:baseline;gap:8px}.lock{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;padding:2px 5px;border:1px solid var(--rule);background:var(--surface);color:var(--ink-faint);cursor:pointer}.lock:hover{border-color:var(--rule-strong);color:var(--ink-muted)}.lock.is-on{border-color:var(--accent);background:var(--accent);color:var(--surface)}.lock:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.trace-wrap{border:1px solid var(--rule);background:var(--surface)}.trace{display:block;width:100%}.trace-a11y{list-style:none;margin:0;padding:0}.trace-a11y button{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.trace-a11y button:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal;display:block;font-family:var(--mono);font-size:11px;text-align:left;padding:8px 10px;border-top:1px solid var(--rule);background:var(--accent-soft);color:var(--ink);cursor:pointer}.pin{border-top:1px solid var(--rule);padding:10px 0}.pin:first-of-type{border-top:none;padding-top:2px}.pin.is-live{border-left:2px solid var(--accent);padding-left:8px;margin-left:-10px}.pin-head{display:flex;justify-content:space-between;align-items:baseline}.pin-metric{font-family:var(--mono);font-size:16px;font-variant-numeric:tabular-nums}.pin-metric em{font-style:normal;font-size:9px;color:var(--ink-faint);margin-left:3px}.pin-cycle{font-family:var(--mono);font-size:10px;color:var(--ink-faint)}.pin-note{font-size:11px;line-height:1.5;color:var(--ink-muted);margin:5px 0 0}.pin-spec{font-family:var(--mono);font-size:9.5px;color:var(--ink-faint);margin-top:5px}.pin-actions{display:flex;gap:6px;margin-top:8px}.pin-btn{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;padding:4px 8px;border:1px solid var(--ink);background:var(--ink);color:var(--surface);cursor:pointer}.pin-btn:disabled{border-color:var(--rule);background:var(--surface);color:var(--ink-faint);cursor:default}.pin-btn.is-quiet{border-color:var(--rule);background:var(--surface);color:var(--ink-muted)}.pin-btn.is-quiet:hover{border-color:var(--rule-strong);color:var(--ink)}.pin-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.replay{max-width:640px;margin:0 auto;border:1px solid var(--accent);border-top:none;background:var(--accent-soft);padding:12px 14px 10px}.replay-head{display:flex;align-items:baseline;gap:10px}.replay-tag{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--surface);background:var(--accent);padding:2px 6px}.replay-title{font-family:var(--mono);font-size:11px;color:var(--ink-muted)}.replay-exit{margin-left:auto;font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border:1px solid var(--accent);background:transparent;color:var(--accent);cursor:pointer}.replay-exit:hover{background:var(--accent);color:var(--surface)}.replay-caption{font-size:13.5px;line-height:1.5;color:var(--ink);margin:10px 0 12px;max-width:62ch}.replay-timeline{display:flex;gap:2px;height:4px}.replay-seg{flex-basis:0;padding:0;border:none;background:#5b3df533;cursor:pointer;position:relative;overflow:hidden}.replay-seg:hover{background:#5b3df561}.replay-fill{display:block;height:100%;background:var(--accent)}.replay-seg:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.replay-transport{display:flex;align-items:center;gap:6px;margin-top:10px}.replay-btn{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border:1px solid var(--rule-strong);background:var(--surface);color:var(--ink);cursor:pointer}.replay-btn:hover{border-color:var(--accent);color:var(--accent)}.replay-count{margin-left:auto;font-family:var(--mono);font-size:10px;font-variant-numeric:tabular-nums;color:var(--ink-muted)}.demo{border:1px solid var(--rule);border-top:none;background:var(--surface)}.demo-head{display:flex;align-items:center;gap:12px;padding:8px 9px}.demo-btn{font-family:var(--mono);font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;padding:5px 11px;border:1px solid var(--accent);background:var(--accent);color:var(--surface);cursor:pointer}.demo-btn:hover{background:var(--surface);color:var(--accent)}.demo-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.demo-note{font-family:var(--mono);font-size:10px;color:var(--ink-faint)}.demo-count{margin-left:auto;font-family:var(--mono);font-size:10px;font-variant-numeric:tabular-nums;color:var(--ink-faint)}.demo-step{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;padding:9px 10px;border-top:1px solid var(--rule);font-size:11.5px;line-height:1.5;color:var(--ink)}.demo-step code{font-family:var(--mono);font-size:9.5px;color:var(--ink-muted);background:var(--sunken);padding:2px 5px}.demo-step.is-refusal{background:var(--accent-soft);border-top-color:var(--accent)}.demo-refusal{flex-basis:100%;margin:2px 0 0;font-size:11px;line-height:1.55;color:var(--ink)}.demo-refusal strong{color:var(--accent)}.pin.is-bad{opacity:.72}.pin-bad{font-family:var(--mono);font-size:9.5px;line-height:1.5;color:var(--accent);margin:6px 0 0}