:root{
  --bg:#071014;--surface:#0c171c;--surface-2:#101e24;--surface-3:#14262d;--line:#21343c;--line-bright:#35505a;
  --text:#ecf4f2;--muted:#91a6a9;--soft:#c4d1d0;--cyan:#55e0d4;--cyan-dim:#173f40;--amber:#f7b955;
  --red:#ff7c80;--blue:#79b8ff;--purple:#bb9aff;--green:#72d89d;--radius:14px;--shadow:0 22px 60px rgba(0,0,0,.3)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 75% -10%,#103039 0,transparent 30rem),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5}
button,input{font:inherit}.skip-link{position:fixed;top:8px;left:8px;z-index:100;transform:translateY(-150%);background:#fff;color:#000;padding:.6rem 1rem;border-radius:6px}.skip-link:focus{transform:none}
a{color:var(--cyan)}a:hover{color:#8ff2e9}.site-header{height:64px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--line);color:var(--muted);font-size:.86rem;letter-spacing:.04em}.brand{color:var(--text);font-weight:750;text-decoration:none}.header-divider{width:1px;height:18px;background:var(--line-bright)}main{max-width:1500px;margin:auto;padding:0 clamp(18px,4vw,64px)}
.hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.62fr);gap:64px;align-items:end;padding:74px 0 54px}.eyebrow,.step-label{margin:0 0 10px;color:var(--cyan);font:700 .72rem/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.14em}.hero h1{max-width:830px;margin:0;font-size:clamp(2.6rem,6vw,5.7rem);line-height:.98;letter-spacing:-.055em}.lede{max-width:750px;margin:24px 0;color:var(--soft);font-size:clamp(1rem,1.5vw,1.24rem)}.legend{display:flex;flex-wrap:wrap;gap:12px 22px;color:var(--muted);font-size:.78rem}.legend span{display:flex;align-items:center;gap:8px}.dot{width:7px;height:7px;border-radius:50%}.dot.connection,.stage-icon.connection{background:var(--blue)}.dot.authentication,.stage-icon.authentication{background:var(--green)}.dot.session,.stage-icon.session{background:var(--cyan)}.dot.disconnect,.stage-icon.disconnect{background:var(--amber)}.dot.logoff,.stage-icon.logoff{background:var(--red)}.golden-rule{border-left:2px solid var(--cyan);padding:6px 0 8px 24px}.rule-label{display:block;color:var(--cyan);font:700 .7rem ui-monospace,monospace;text-transform:uppercase;letter-spacing:.12em}.golden-rule strong{display:block;margin:10px 0;font-size:1.35rem;line-height:1.3}.golden-rule p{margin:0;color:var(--muted);font-size:.92rem}
.workspace{display:grid;grid-template-columns:310px minmax(430px,1fr) 360px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(9,20,25,.86);box-shadow:var(--shadow);overflow:hidden}.scenario-panel,.timeline-panel,.inspector-panel{padding:28px}.scenario-panel,.timeline-panel{border-right:1px solid var(--line)}.section-heading,.library-heading{display:flex;align-items:start;justify-content:space-between;gap:20px}.section-heading h2,.library-heading h2,.cautions h2,.sources h2{margin:0;font-size:1.35rem;letter-spacing:-.02em}.text-button{border:0;background:none;color:var(--muted);padding:3px;cursor:pointer;font-size:.78rem}.text-button:hover{color:var(--cyan)}.scenario-list{display:grid;gap:7px;margin-top:24px}.scenario-button{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:start;width:100%;padding:15px 12px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--text);text-align:left;cursor:pointer}.scenario-button:hover{background:var(--surface-2)}.scenario-button.active{background:var(--surface-3);border-color:var(--line-bright)}.scenario-number{color:var(--cyan);font:700 .7rem ui-monospace,monospace}.scenario-button strong{display:block;font-size:.88rem}.scenario-button small{display:block;margin-top:3px;color:var(--muted);font-size:.72rem;line-height:1.35}.scenario-button .arrow{align-self:center;color:var(--line-bright)}.scenario-button.active .arrow{color:var(--cyan)}
.count-pill{padding:5px 9px;border:1px solid var(--line-bright);border-radius:999px;color:var(--muted);font:600 .68rem ui-monospace,monospace}.scenario-summary{margin:12px 0 26px;color:var(--muted);font-size:.9rem}.timeline{display:flex;align-items:stretch;overflow-x:auto;padding:10px 3px 22px;scrollbar-color:var(--line-bright) transparent}.timeline-step{display:flex;align-items:center;min-width:max-content}.event-node{width:145px;min-height:174px;padding:18px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);text-align:left;cursor:pointer;transition:.16s ease}.event-node:hover,.event-node.selected{transform:translateY(-3px);border-color:var(--cyan);box-shadow:0 10px 30px rgba(0,0,0,.24)}.node-icon{display:grid;place-items:center;width:30px;height:30px;margin-bottom:18px;border-radius:8px;background:var(--surface-3);color:var(--cyan);font-weight:800}.node-id{display:block;font:800 1.55rem ui-monospace,monospace}.node-title{display:block;margin:2px 0 10px;font-size:.76rem;font-weight:700;line-height:1.3}.event-node small{display:block;max-width:110px;color:var(--muted);font-size:.61rem;line-height:1.25}.connector{display:block;padding:0 9px;color:var(--line-bright)}.verdict{display:grid;grid-template-columns:auto 1fr;gap:14px;margin-top:20px;padding:16px;border:1px solid var(--cyan-dim);border-radius:10px;background:rgba(35,97,96,.12)}.verdict span{color:var(--cyan);font:700 .66rem ui-monospace,monospace;text-transform:uppercase;letter-spacing:.1em}.verdict strong{font-size:.8rem;line-height:1.45}
.inspector-panel{background:rgba(10,22,27,.75)}.inspector-title-row{display:flex;gap:12px;align-items:center}.inspector-title-row h2{margin:0;font-size:1.55rem}.inspector-title-row p{margin:0;color:var(--soft);font-size:.85rem}.stage-icon{display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:10px;color:#061012;font-weight:900}.channel-tag{margin:14px 0 18px;padding:7px 9px;border:1px solid var(--line);border-radius:7px;color:var(--muted);font:600 .6rem/1.35 ui-monospace,monospace;overflow-wrap:anywhere}.proof-block{margin:8px 0;padding:12px;border-left:2px solid;border-radius:0 7px 7px 0}.proof-block span{display:block;margin-bottom:4px;font:700 .62rem ui-monospace,monospace;text-transform:uppercase;letter-spacing:.1em}.proof-block strong{display:block;font-size:.77rem;line-height:1.4}.proof-block.positive{background:rgba(40,129,96,.12);border-color:var(--green)}.proof-block.positive span{color:var(--green)}.proof-block.caution{background:rgba(163,98,40,.12);border-color:var(--amber)}.proof-block.caution span{color:var(--amber)}.inspector-section{margin-top:17px}.inspector-section h3{margin:0 0 7px;color:var(--muted);font:700 .64rem ui-monospace,monospace;text-transform:uppercase;letter-spacing:.09em}.inspector-section ul{margin:0;padding-left:18px;color:var(--soft);font-size:.74rem}.inspector-section li+li{margin-top:4px}.field-tags{display:flex;flex-wrap:wrap;gap:5px}.field-tags span{padding:4px 7px;border-radius:5px;background:var(--surface-3);color:var(--soft);font-size:.66rem}.correlate{display:flex;justify-content:space-between;gap:12px;margin-top:17px;padding:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.7rem}.correlate span{color:var(--muted)}.correlate strong{color:var(--cyan);text-align:right}.analyst-prompt{display:grid;grid-template-columns:auto 1fr;gap:9px;margin-top:17px;padding:11px;border-radius:8px;background:var(--surface-2)}.analyst-prompt span{color:var(--cyan);font:800 .65rem ui-monospace,monospace;text-transform:uppercase}.analyst-prompt p{margin:0;font-size:.72rem;color:var(--soft)}
.workflow,.event-library,.cautions,.sources{padding:76px 0;border-bottom:1px solid var(--line)}.workflow-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:30px 0 18px;padding:0;list-style:none}.workflow-grid li{min-height:180px;padding:20px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}.workflow-grid span{display:block;color:var(--cyan);font:700 .7rem ui-monospace,monospace}.workflow-grid strong{display:block;margin:24px 0 8px}.workflow-grid p{margin:0;color:var(--muted);font-size:.8rem}.query-box{margin-top:14px;border:1px solid var(--line);border-radius:10px;background:var(--surface);overflow:hidden}.query-box summary{padding:16px 18px;cursor:pointer;color:var(--soft);font-size:.85rem}.query-box pre{margin:0;padding:20px;overflow:auto;background:#050a0d;color:#b9d7d4;font:12px/1.6 ui-monospace,monospace}.code-toolbar{display:flex;justify-content:flex-end;padding:8px 12px;border-top:1px solid var(--line);background:var(--surface-2)}.code-toolbar button{border:0;background:none;color:var(--cyan);cursor:pointer;font-size:.72rem}
.library-heading{align-items:end}.search-box{display:flex;align-items:center;gap:9px;width:min(410px,100%);padding:10px 13px;border:1px solid var(--line-bright);border-radius:9px;background:var(--surface)}.search-box:focus-within{border-color:var(--cyan)}.search-box svg{width:17px;fill:none;stroke:var(--muted);stroke-width:1.7}.search-box input{width:100%;border:0;outline:0;background:transparent;color:var(--text);font-size:.8rem}.library-filters{display:flex;flex-wrap:wrap;gap:7px;margin:24px 0}.library-filters button{padding:7px 11px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);cursor:pointer;font-size:.7rem}.library-filters button:hover,.library-filters button.active{border-color:var(--cyan);background:var(--cyan-dim);color:var(--text)}.event-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.event-card{position:relative;display:flex;flex-direction:column;min-height:260px;padding:18px;border:1px solid var(--line);border-top:2px solid var(--line-bright);border-radius:10px;background:var(--surface);overflow:hidden}.event-card.connection{border-top-color:var(--blue)}.event-card.authentication{border-top-color:var(--green)}.event-card.session{border-top-color:var(--cyan)}.event-card.disconnect{border-top-color:var(--amber)}.event-card.reconnect{border-top-color:var(--purple)}.event-card.logoff{border-top-color:var(--red)}.event-card-top{display:flex;justify-content:space-between;align-items:center}.event-id{font:800 1.35rem ui-monospace,monospace}.stage-name{color:var(--muted);font:600 .61rem ui-monospace,monospace;text-transform:uppercase}.event-card h3{margin:18px 0 4px;font-size:.98rem}.event-channel{min-height:32px!important;color:var(--cyan)!important;font:600 .61rem/1.35 ui-monospace,monospace!important}.event-card p{margin:7px 0;color:var(--soft);font-size:.75rem}.card-correlation{display:grid;gap:3px;margin-top:auto;padding-top:14px}.card-correlation span{color:var(--muted);font:700 .6rem ui-monospace,monospace;text-transform:uppercase}.card-correlation strong{font-size:.72rem}.event-card button{margin-top:14px;padding:9px;border:1px solid var(--line);border-radius:7px;background:var(--surface-2);color:var(--soft);cursor:pointer;font-size:.69rem}.event-card button:hover{border-color:var(--cyan);color:var(--cyan)}.no-results{padding:40px;text-align:center;color:var(--muted)}
.cautions{display:grid;grid-template-columns:280px 1fr;gap:50px}.caution-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.caution-grid article{padding:18px;border-left:2px solid var(--amber);background:rgba(247,185,85,.055)}.caution-grid strong{font-size:.83rem}.caution-grid p{margin:7px 0 0;color:var(--muted);font-size:.76rem}.sources{max-width:950px}.sources>p{color:var(--muted);font-size:.86rem}.sources ol{padding-left:20px;color:var(--muted);font-size:.8rem}.sources li+li{margin-top:6px}footer{max-width:1500px;margin:auto;padding:30px clamp(18px,4vw,64px) 50px;display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:.74rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1180px){.workspace{grid-template-columns:280px 1fr}.inspector-panel{grid-column:1/-1;border-top:1px solid var(--line)}.scenario-panel{border-right:1px solid var(--line)}.timeline-panel{border-right:0}.event-grid{grid-template-columns:repeat(3,1fr)}.workflow-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){.hero{grid-template-columns:1fr;gap:36px;padding-top:50px}.workspace{grid-template-columns:1fr}.scenario-panel,.timeline-panel{border-right:0;border-bottom:1px solid var(--line)}.workflow-grid{grid-template-columns:1fr 1fr}.event-grid{grid-template-columns:1fr 1fr}.library-heading{align-items:start;flex-direction:column}.search-box{width:100%}.cautions{grid-template-columns:1fr}.caution-grid{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.site-header{padding:0 18px}.site-header>span:last-child{display:none}.hero h1{font-size:2.75rem}.scenario-panel,.timeline-panel,.inspector-panel{padding:21px}.workflow-grid,.event-grid,.caution-grid{grid-template-columns:1fr}.timeline{margin-right:-21px}.event-node{width:132px}.workflow,.event-library,.cautions,.sources{padding:54px 0}.library-filters{flex-wrap:nowrap;overflow-x:auto;padding-bottom:7px}footer{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.event-node{transition:none}}