.page-demo main{padding-bottom:64px}.demo-hero{padding:56px 0 36px;position:relative;overflow:hidden}.demo-hero:before{content:"";background-image:linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);pointer-events:none;background-size:56px 56px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(70% 100% at 20% 0,#000 15%,#0000 75%);mask-image:radial-gradient(70% 100% at 20% 0,#000 15%,#0000 75%)}.demo-hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:end;gap:40px;display:grid;position:relative}.demo-hero h1{letter-spacing:-.05em;max-width:17ch;margin-top:18px;font-size:clamp(2.3rem,4.6vw,3.7rem);font-weight:650;line-height:1.02}.demo-hero .lead{margin-top:16px}.hero-run{box-shadow:var(--shadow), 0 0 90px -36px #5b82ff8c;border-radius:18px;padding:22px}.hero-actions{flex-wrap:wrap;align-items:center;gap:12px;margin-top:14px;display:flex}.role-steps{color:var(--ink-2)}.field-label{color:var(--ink-2);justify-content:space-between;gap:8px;margin:0 0 7px;font-size:.8rem;font-weight:550;display:flex}.page-demo textarea,.page-demo input[type=text],.page-demo select{width:100%;font:.93rem/1.5 var(--sans);color:var(--ink);border:1px solid var(--line-strong);background:#00000059;border-radius:9px;padding:10px 12px;transition:border-color .15s}.page-demo textarea:hover,.page-demo input[type=text]:hover,.page-demo select:hover{border-color:#ffffff3d}.page-demo textarea:focus-visible,.page-demo input:focus-visible,.page-demo select:focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-color:#0000}.page-demo textarea[readonly]{color:var(--ink-2)}#a-envelope,#b-inbox,#a-key-input{font:.76rem/1.45 var(--mono)}.page-demo select{background-color:var(--surface-2);width:auto;max-width:100%}.btn-quiet{color:var(--accent);background:0 0;border-color:#0000}.btn-quiet:hover:not(:disabled){border-color:var(--line-strong);background:#ffffff08}.btn-warn{background:var(--warn-bg);color:var(--warn);border-color:#f5b54473}.btn-warn:hover:not(:disabled){border-color:var(--warn);background:#f5b54429}.btn-small{--h:30px;border-radius:7px;padding:0 10px;font-size:.78rem}.file-btn{position:relative;overflow:hidden}.file-btn input{opacity:0;cursor:pointer;position:absolute;inset:0}.row{flex-wrap:wrap;align-items:center;display:flex}.gap{gap:8px}.row>input[type=text]{flex:180px;width:auto}.fineprint{color:var(--ink-3);margin:10px 0 0;font-size:.8rem}.counter{font:500 .74rem var(--mono);color:var(--ink-3)}.op-error{background:var(--bad-bg);color:var(--bad);border:1px solid #ff6b6b59;border-radius:9px;margin:10px 0 0;padding:9px 11px;font-size:.86rem}.results{border:1px solid var(--line-strong);background:linear-gradient(180deg, #ffffff0b, #ffffff03), var(--bg-2);box-shadow:var(--shadow), 0 0 80px -40px #5be3a159;border-radius:18px;margin:8px 0 20px;padding:22px}.results-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;display:flex}.results-head h2{font-size:1.1rem}.results-meta{font:.78rem var(--mono);color:var(--ink-3)}.checks{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0 0;padding:0;list-style:none;display:grid}.check{border:1px solid var(--line);background:var(--surface-2);border-radius:11px;padding:14px}.check-top{align-items:center;gap:9px;font-weight:600;display:flex}.check-icon{border:1.5px solid var(--line-strong);width:22px;height:22px;color:var(--ink-3);border-radius:50%;flex:none;place-items:center;font-size:.78rem;display:inline-grid}.check p{color:var(--ink-2);margin:8px 0 0;font-size:.84rem}.check[data-state=pass]{border-color:#5be3a166}.check[data-state=pass] .check-icon{background:var(--ok);border-color:var(--ok);color:var(--bg)}.check[data-state=fail]{background:var(--bad-bg);border-color:#ff6b6b80}.check[data-state=fail] .check-icon{background:var(--bad);border-color:var(--bad);color:var(--bg)}.check[data-state=running] .check-icon{border-color:var(--accent);border-top-color:#0000;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.timings{font:.78rem/1.6 var(--mono);color:var(--ink-2);margin:14px 0 0}.results-actions{flex-wrap:wrap;align-items:center;gap:12px;margin-top:14px;display:flex}.results-actions .fineprint{flex:280px;margin:0}.stage{scroll-margin-top:calc(var(--header-h) + 12px);grid-template-columns:minmax(0,1fr) minmax(0,1.05fr) minmax(0,1fr);align-items:start;gap:16px;display:grid}body[data-role=a] .stage,body[data-role=b] .stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}body[data-role=a] .agent-b,body[data-role=b] .agent-a,body:not([data-role=both]) [data-both-only]{display:none!important}body[data-role=b] .channel{order:2}.agent,.channel,.panel{background:linear-gradient(180deg, #ffffff0a, #ffffff03), var(--bg-2);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:18px;min-width:0;position:relative}.agent:before,.channel:before{content:"";background:linear-gradient(90deg, transparent, var(--rail,var(--accent)), transparent);border-radius:2px;height:2px;position:absolute;top:-1px;left:18px;right:18px}.agent-a{--rail:var(--agent-a)}.agent-b{--rail:var(--agent-b)}.channel{--rail:#b394ff}.agent{padding:18px}.agent-head{border-bottom:1px solid var(--line);grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding-bottom:14px;display:grid}.agent-head h2,.channel-head h2{font-size:1.04rem}.role-tag{color:var(--ink-3);font-size:.84rem;font-weight:450}.agent-sub{color:var(--ink-3);margin:2px 0 0;font-size:.8rem}.node{width:38px;height:38px;font:700 .98rem var(--mono);color:var(--bg);border-radius:50%;place-items:center;display:inline-grid}.node-a{background:var(--agent-a);box-shadow:0 0 0 4px #8ea2ff24,0 0 24px #8ea2ff8c}.node-b{background:var(--agent-b);box-shadow:0 0 0 4px #4fd1c024,0 0 24px #4fd1c08c}.state-chip{font:500 .7rem/1 var(--mono);border:1px solid var(--line-strong);color:var(--ink-3);white-space:nowrap;background:#ffffff08;border-radius:999px;padding:6px 9px}.state-chip[data-tone=ok]{color:var(--ok);background:var(--ok-bg);border-color:#5be3a166}.state-chip[data-tone=bad]{color:var(--bad);background:var(--bad-bg);border-color:#ff6b6b73}.state-chip[data-tone=busy]{color:var(--accent);background:var(--accent-soft);border-color:#8ec5ff66}.step{border-bottom:1px dashed var(--line);padding:16px 0}.step:last-child{border-bottom:0;padding-bottom:0}.step h3{align-items:center;gap:9px;margin-bottom:12px;font-size:.92rem;display:flex}.num{border:1px solid var(--line-strong);width:20px;height:20px;font:500 .7rem var(--mono);color:var(--ink-2);border-radius:6px;place-items:center;display:inline-grid}.step>.row+.row{margin-top:8px}.import-box,.keycard,.envelope-out{margin-top:12px}.keycard{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:13px}.kc-label{color:var(--ink-3);margin:0 0 7px;font-size:.76rem}.fingerprint{font:500 .82rem/1.65 var(--mono);letter-spacing:.02em;word-spacing:.15em;overflow-wrap:anywhere;color:var(--ink);margin:0}.compare-auto{margin:9px 0 11px;font-size:.84rem}.compare-auto:empty{display:none}.compare-result{font-size:.84rem;font-weight:600}.tone-ok{color:var(--ok)}.tone-bad{color:var(--bad)}.tone-warn{color:var(--warn)}.kv{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0;display:grid}.kv div{min-width:0}.kv dt{font:500 .68rem var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.08em}.kv dd{font:.84rem var(--mono);overflow-wrap:anywhere;margin:3px 0 0}.kv-wide{grid-template-columns:1fr;gap:12px}.kv-wide dd{font-family:var(--sans);color:var(--ink-2)}.trace{border-collapse:collapse;width:100%;margin-top:12px;font-size:.8rem}.trace caption{text-align:left;color:var(--ink-3);padding-bottom:5px;font-size:.72rem}.trace th,.trace td{text-align:left;border-bottom:1px solid var(--line);padding:5px 6px}.trace th{font:500 .68rem var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}.trace td{color:var(--ink-2)}.trace td:nth-child(2),.trace td:nth-child(3),.trace th:nth-child(2),.trace th:nth-child(3){text-align:right;font-family:var(--mono);white-space:nowrap}.trace tr[data-ok=false] td:first-child{color:var(--bad);font-weight:600}.verdict{border:1px solid var(--line-strong);border-radius:11px;margin-top:12px;padding:13px}.verdict[data-ok=true]{background:var(--ok-bg);border-color:#5be3a173}.verdict[data-ok=false]{background:var(--bad-bg);border-color:#ff6b6b80}.verdict-title{font:600 .8rem var(--mono);letter-spacing:.08em;margin:0}.verdict[data-ok=true] .verdict-title{color:var(--ok)}.verdict[data-ok=false] .verdict-title{color:var(--bad)}.verdict p{color:var(--ink-2);margin:7px 0 0;font-size:.86rem}.plaintext{border:1px solid var(--line);white-space:pre-wrap;overflow-wrap:anywhere;font:.93rem/1.5 var(--sans);color:var(--ink);background:#00000059;border-radius:8px;margin:9px 0 0;padding:11px}.tamper-note{color:var(--warn);margin:11px 0 0;font-size:.84rem}.tamper-note:empty{display:none}.channel{background:radial-gradient(500px 220px at 50% 0%, #38bdf80f, transparent), var(--surface);padding:18px}.lane{grid-template-columns:auto 1fr auto;align-items:center;height:58px;margin:18px 0 8px;display:grid;position:relative}.lane-end{width:32px;height:32px;font:700 .82rem var(--mono);color:var(--bg);z-index:1;border-radius:50%;place-items:center;display:inline-grid}.lane-a{background:var(--agent-a);box-shadow:0 0 0 4px #8ea2ff1f}.lane-b{background:var(--agent-b);box-shadow:0 0 0 4px #4fd1c01f}.lane-track{background:linear-gradient(90deg,#8ea2ff8c,#b394ff59,#4fd1c08c);border-radius:2px;height:2px;box-shadow:0 0 14px #7896ff73}.flight{font:500 .72rem/1 var(--mono);background:var(--surface-3);border:1px solid var(--accent);color:var(--ink);white-space:nowrap;z-index:2;pointer-events:none;border-radius:7px;align-items:center;gap:6px;padding:6px 9px;display:inline-flex;position:absolute;top:50%;left:0;transform:translateY(-50%);box-shadow:0 0 24px #8ec5ff2e}.flight[data-kind=pubkey]{border-color:var(--agent-b);box-shadow:0 0 24px #4fd1c02e}.flight[data-state=tampered]{border-color:var(--warn);background:#2a2010}.flight[data-state=verified]{border-color:var(--ok);background:#0e2a1f}.flight[data-state=rejected]{border-color:var(--bad);background:#2c1214}.lane-note{color:var(--ink-3);margin:0 0 14px;font-size:.74rem}h3.sub{align-items:center;gap:8px;font-size:.86rem;display:flex}.packets{gap:6px;max-height:224px;margin:9px 0 14px;padding:0;list-style:none;display:grid;overflow:auto}.packets .empty{color:var(--ink-3);font-size:.84rem}.packet{text-align:left;border:1px solid var(--line);background:var(--surface-2);width:100%;color:var(--ink);font:.8rem var(--sans);cursor:pointer;border-radius:9px;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:8px 10px;display:grid}.packet:hover{border-color:var(--line-strong)}.packet:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.packet[aria-pressed=true]{background:var(--accent-soft);border-color:#8ec5ff99}.packet .dir{font:600 .72rem var(--mono);color:var(--ink-3)}.packet .pstate{font:500 .68rem var(--mono);border:1px solid var(--line-strong);color:var(--ink-3);border-radius:999px;padding:3px 7px}.packet[data-state=verified] .pstate{color:var(--ok);border-color:#5be3a173}.packet[data-state=rejected] .pstate{color:var(--bad);border-color:#ff6b6b80}.packet[data-state=tampered] .pstate,.packet[data-state=edited] .pstate{color:var(--warn);border-color:#f5b54480}.inspector{border:1px solid var(--line-strong);background:var(--surface-2);border-radius:11px;margin-bottom:16px;padding:13px}.inspector-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.inspector .field-block{margin-top:11px}.inspector .field-name{font:500 .76rem var(--mono);color:var(--ink);justify-content:space-between;gap:8px;display:flex}.inspector .field-name .counter{font-weight:400}.inspector .header-json{font:.72rem/1.5 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;color:var(--ink-2);margin:7px 0 0}.hex{font:.7rem/1.55 var(--mono);border:1px solid var(--line);max-height:170px;color:var(--ink-2);background:#0006;border-radius:7px;margin:5px 0 0;padding:7px 9px;overflow:auto}.hex-row{white-space:pre}.hex-off{color:var(--ink-4);margin-right:8px}.hex .b-tag{color:var(--accent);text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent);text-underline-offset:2px}.hex .b-changed{background:var(--warn);color:var(--bg);border-radius:2px}.legend{color:var(--ink-3);margin:7px 0 0;font-size:.72rem}.legend .swatch-tag{color:var(--accent);text-decoration:underline}.legend .swatch-changed{background:var(--warn);color:var(--bg);border-radius:2px;padding:0 3px}.log-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.events{border-top:1px solid var(--line);max-height:470px;margin:9px 0 0;padding:0;list-style:none;overflow:auto}.ev{border-bottom:1px solid var(--line);grid-template-columns:4.4rem auto 1fr;align-items:baseline;gap:4px 9px;padding:8px 2px;font-size:.8rem;display:grid}.ev-time{font:.7rem var(--mono);color:var(--ink-4);text-align:right}.ev-agent{font:600 .66rem/1 var(--mono);color:var(--bg);background:var(--ink-3);border-radius:4px;padding:3px 5px}.ev-agent[data-agent=A]{background:var(--agent-a)}.ev-agent[data-agent=B]{background:var(--agent-b)}.ev-kind{color:var(--ink);font-weight:550}.ev[data-tone=ok] .ev-kind{color:var(--ok)}.ev[data-tone=bad] .ev-kind{color:var(--bad)}.ev[data-tone=warn] .ev-kind{color:var(--warn)}.ev-detail{font:.7rem/1.5 var(--mono);color:var(--ink-3);overflow-wrap:anywhere;grid-column:3}.ev details{color:var(--ink-2);grid-column:3;font-size:.78rem}.ev summary{cursor:pointer;color:var(--accent);font-size:.74rem}.ev details p{margin:5px 0 0}.source-label{font:600 .66rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;border-radius:5px;margin:0;padding:5px 8px;display:inline-block}.source-fixed{border:1px solid var(--line-strong);color:var(--ink-2);background:#ffffff0a}.source-live{background:var(--accent-soft);color:var(--accent);border:1px solid #8ec5ff73}.panel{margin-top:16px;padding:22px}.panel-head{justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px;display:flex}.panel h2{align-items:center;gap:10px;font-size:1.12rem;display:flex}.ai-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;display:grid}.ai-grid p{color:var(--ink-2);margin-top:0}.ai-grid strong{color:var(--ink)}.progress{margin-top:14px}.bar{background:#ffffff0f;border-radius:999px;height:6px;overflow:hidden}.bar span{background:linear-gradient(90deg, var(--viz-1), var(--viz-2), var(--viz-3));width:0;height:100%;transition:width .2s linear;display:block}.progress-text{font:.76rem var(--mono);color:var(--ink-2);margin:7px 0 0}.ai-tool+.ai-tool{margin-top:20px}.ai-output{background:var(--surface-2);border:1px solid #8ec5ff59;border-radius:11px;margin-top:20px;padding:14px}.ai-text{white-space:pre-wrap;overflow-wrap:anywhere;min-height:1.5em;color:var(--ink);margin:11px 0}.prompt-view summary{cursor:pointer;color:var(--accent);margin-top:9px;font-size:.8rem}.prompt-view pre{white-space:pre-wrap;overflow-wrap:anywhere;font:.72rem/1.55 var(--mono);border:1px solid var(--line);max-height:260px;color:var(--ink-2);background:#0006;border-radius:7px;padding:9px;overflow:auto}.demo-notes h2{margin-bottom:18px}.notes-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;display:grid}.notes-grid h3{margin-bottom:8px;font-size:.95rem}.notes-grid p{color:var(--ink-2);font-size:.88rem}.env-line{border-top:1px solid var(--line);font-family:var(--mono);margin-top:22px;padding-top:16px;font-size:.72rem}@media (max-width:1180px){.stage,body[data-role=a] .stage,body[data-role=b] .stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.channel{order:3;grid-column:1/-1}body[data-role=a] .channel,body[data-role=b] .channel{order:0;grid-column:auto}.checks{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:860px){.demo-hero-grid,.ai-grid,.notes-grid{grid-template-columns:minmax(0,1fr)}}@media (max-width:760px){.demo-hero{padding-top:26px}.demo-hero h1{font-size:2.15rem}.demo-hero .lead{font-size:1rem}.stage,body[data-role=a] .stage,body[data-role=b] .stage{grid-template-columns:minmax(0,1fr)}.channel{order:0;grid-column:auto}.checks{grid-template-columns:minmax(0,1fr)}.kv{grid-template-columns:1fr 1fr}}