:root{font-family:Arial,Helvetica,sans-serif;color:#282b25;background:#f8f6ef;font-synthesis:none;--ink: #282b25;--paper: #f8f6ef;--muted: #76796d;--line: #dcded2;--lime: #d6f38c;--purple: #e8e1f4;--mono: ui-monospace, SFMono-Regular, Consolas, monospace}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit}button,select,input[type=range]{cursor:pointer}a{color:inherit}button,a,select,input{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #9671c0;outline-offset:4px}button:disabled{opacity:.4;cursor:default}button{transition:background .18s,transform .18s}::selection{background:var(--lime)}.skip{position:fixed;top:8px;transform:translateY(-200%);left:20px;z-index:20;background:var(--ink);color:#fff;padding:12px}.skip:focus{transform:translateY(0)}.site-header{max-width:1440px;margin:auto;display:flex;align-items:center;justify-content:space-between;min-height:92px;padding:20px 44px;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:17px;font-weight:750}.brand-mark{display:grid;place-items:center;width:39px;height:43px;background:var(--lime);border:1px solid var(--ink);border-radius:12px;transform:rotate(-7deg);font-size:29px;letter-spacing:-3px;padding-right:4px}.brand small{font-size:11px;font-family:var(--mono);font-weight:400;color:var(--muted);margin-left:9px}.back-link{font:11px var(--mono);text-decoration:none;border-bottom:1px solid #b0b59d;padding-bottom:5px}main{max-width:1440px;margin:0 auto;padding:0 44px}.intro{display:grid;grid-template-columns:1.6fr 1fr;align-items:center;gap:70px;padding:56px 0 48px}.eyebrow{font:9px/1.5 var(--mono);letter-spacing:1.4px;margin:0 0 18px;color:#777d69}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#799947;box-shadow:0 0 0 3px #98b35d1e;margin-right:7px}h1{font-size:clamp(42px,4.8vw,67px);line-height:1.04;letter-spacing:-3px;font-weight:750;margin:0 0 20px}h1 em{font-family:Georgia,serif;font-weight:400;background:linear-gradient(transparent 35%,var(--lime) 35%,var(--lime) 94%,transparent 94%);padding:0 7px 0 2px}.intro-copy{max-width:515px;font-size:14px;line-height:1.8;color:#74786c;margin:0}.intro-note{position:relative;justify-self:end;max-width:315px;background:#ede8f4;padding:27px 28px 24px;border:1px solid #d1c8df;border-radius:4px 18px 18px;transform:rotate(2deg)}.intro-note strong{font:italic 21px Georgia,serif;display:block}.intro-note p{font-size:12px;line-height:1.8;color:#6a6573;margin:12px 0 18px}.intro-note>span:last-child{font:8px var(--mono);color:#81798b}.note-spark{position:absolute;right:-13px;top:-25px;font-size:54px;color:#8d9b6d;line-height:1}.lab{display:grid;grid-template-columns:284px minmax(0,1fr);border:1px solid #cfd3c3;border-radius:16px;overflow:hidden;background:#fffef9;box-shadow:0 5px #373c2710;scroll-margin-top:20px}.control-panel{background:#f0f1e8;border-right:1px solid #d9ddcf;padding:24px 22px;min-width:0}.panel-heading{display:flex;justify-content:space-between;align-items:center;font:9px var(--mono);letter-spacing:1px;color:#747b66;margin-bottom:25px}.panel-heading>span:last-child{font-size:24px;line-height:.5}.control-panel label{font-size:11px;font-weight:650;display:block;margin:0 0 9px}.control-panel select,.control-panel input:not([type=range]){border:1px solid #c9d1bb;border-radius:7px;background:#fffef9;padding:10px;width:100%;min-height:40px;font-size:11px;outline-offset:2px}.control-panel select{padding-right:22px}.field-hint{font-size:10px;line-height:1.7;color:#7a816e;margin:10px 0 22px}.request-fields{display:flex;gap:8px}.request-fields>div:first-child{width:79px;flex-shrink:0}.request-fields .path-field{flex:1;min-width:0}.request-fields input{font:11px var(--mono)}.host-caption{font:9px var(--mono);margin:9px 0 27px;color:#879079;overflow-wrap:anywhere}.range-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.range-heading label{margin:0}.range-heading output{font:10px var(--mono);white-space:nowrap;color:#526b38;background:#e0e9d2;border-radius:4px;padding:4px 5px}.control-panel input[type=range]{width:100%;accent-color:#637c43;margin:14px 0 8px;display:block}.range-labels{display:flex;justify-content:space-between;color:#929982;font:8px var(--mono);margin-bottom:24px}.fault-label{padding-top:6px}.control-foot{display:flex;align-items:center;justify-content:space-between;gap:9px;padding-top:12px;border-top:1px solid #d4dac8;font-size:10px;color:#7a816f}.control-foot select{width:113px!important;min-height:32px!important;padding:5px!important;font-size:10px!important}.journey-panel{padding:27px 26px 20px;min-width:0}.journey-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.journey-heading .eyebrow{margin-bottom:9px}h2{margin:0;font-size:29px;font-weight:700;letter-spacing:-1px}h2>span{color:#91a555}.simulation-badge{font:8px var(--mono);letter-spacing:.5px;background:#f3f4ed;border:1px solid #dce1d2;padding:7px 8px;border-radius:5px;color:#8b947b;white-space:nowrap}.run-bar{display:flex;align-items:center;gap:8px;margin:24px 0 30px;flex-wrap:wrap}.run-bar button{font-size:10px;padding:10px 12px;min-height:37px;border:1px solid #d4d9c8;background:#fffef9;border-radius:7px}.run-bar button:not(:disabled):hover{background:#edf2e2}.run-bar .button-primary{background:#2e3828;border-color:#2e3828;color:#f4f7ec;display:flex;gap:15px;align-items:center;font-weight:650}.run-bar .button-primary:not(:disabled):hover{background:#485b39}.run-bar .reset-button{border:0;background:transparent;color:#7b816f;margin-left:auto}.keyboard-hint{flex-basis:100%;font:8px var(--mono);color:#969c8b;margin-top:4px}.flow{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;position:relative}.stage{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;min-width:0;padding:10px 9px 9px;min-height:144px;border:1px solid #e0e3d8;border-radius:8px;background:#f8f9f3;color:#8b927e;cursor:pointer;transition:background .25s,border-color .25s,transform .25s}.stage:not(:last-child):after{content:"›";position:absolute;right:-7px;top:49px;color:#b7bea9;z-index:2;background:#fffef9;font-size:14px;line-height:10px}.stage-number{font:8px var(--mono);color:#a5ac99}.stage-icon{white-space:nowrap;display:flex;align-items:center;font:21px var(--mono);height:40px;color:#9da78b}.stage strong{font-size:10px;line-height:1.3;min-height:26px;font-weight:600}.stage small{font-size:8px;line-height:1.3;min-height:24px;color:#707b61;margin-top:5px}.stage-result{font:8px var(--mono);margin-top:auto;padding-top:9px;white-space:nowrap}.stage.visited{background:#edf2e3;border-color:#bdcda8;color:#52653e}.stage.visited .stage-icon{color:#607f40}.stage.current{border-color:#6e8a45;background:#e6f2cf;box-shadow:0 3px #c8dca7;transform:translateY(-3px)}.stage.current .stage-number,.stage.current small{color:#7f906d}.stage.failed{border-color:#c58770;background:#fbebe3;color:#a45a42}.stage.failed .stage-icon{color:#b6674a}.stage.cached{background:#eeebf6;border-color:#c2b3db;color:#7a5d9e}.stage.cached .stage-icon{color:#8562a9}.stage:hover{border-color:#9eae88}.progress-track{height:3px;background:#edf0e4;border-radius:10px;margin:18px 0 24px;overflow:hidden}.progress-track span{height:100%;width:0;display:block;background:#91af5d;transition:width .3s}.current-step{display:flex;gap:15px;min-height:155px;padding:21px 18px;background:#f5f4ee;border:1px solid #e5e4d9;border-radius:10px}.step-marker{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;border-radius:50%;background:#e5ecd5;color:#79944d;font:20px var(--mono)}.current-step .eyebrow{font-size:8px;margin:0 0 7px;letter-spacing:.8px}.current-step h3{font-size:16px;margin:0 0 9px;font-weight:600;line-height:1.4}.current-step p:last-child{font-size:12px;line-height:1.8;margin:0;color:#777d6d;max-width:610px}.current-step[data-kind=error]{background:#fcf0e9;border-color:#e6d1c4}.current-step[data-kind=error] .step-marker{background:#f0d5c6;color:#a66043}.summary-strip{display:grid;grid-template-columns:.9fr 1.3fr 1fr;gap:12px;margin:25px 0}.summary-strip>div{min-width:0}.summary-strip span{font:7px var(--mono);letter-spacing:.8px;color:#979e8b;display:block;margin-bottom:8px}.summary-strip strong{font:11px var(--mono);line-height:1.6;display:block;overflow-wrap:anywhere}.summary-strip strong small{font-size:10px;font-weight:400;color:#8b947b}#elapsed{font-size:21px;line-height:1.1}#response-status[data-outcome=network-error],#response-status[data-outcome=http-error]{color:#ac6347}.explanation{border-top:1px solid #e5e8db;padding-top:15px}.explanation summary{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#778765;cursor:pointer;gap:20px;list-style:none}.explanation summary::-webkit-details-marker{display:none}.explanation summary>span:last-child{font-size:18px}.explanation p{font-size:11px;color:#7f8774;line-height:1.85;margin:12px 0 0;max-width:680px}.inspection{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:27px}.trace-panel{min-width:0;background:#29332c;border-radius:12px;overflow:hidden;border:1px solid #344638;color:#b7c8b6;display:flex;flex-direction:column}.terminal-heading{padding:14px 16px;display:flex;align-items:center;gap:15px;background:#222d26;border-bottom:1px solid #3b493c}.terminal-heading>span{display:flex;gap:4px}.terminal-heading i{width:6px;height:6px;border-radius:50%;background:#79916d}.terminal-heading i:first-child{background:#c68f74}.terminal-heading i:nth-child(2){background:#b6b77a}.terminal-heading b{font:9px var(--mono);font-weight:400;color:#9bae95}.terminal-heading button{margin-left:auto;background:transparent;border:0;color:#8fa27e;font:9px var(--mono);padding:4px;cursor:pointer}.trace-panel ol{list-style:none;margin:0;padding:18px 19px;min-height:220px;max-height:250px;overflow:auto;font:10px/1.9 var(--mono);flex:1}.trace-panel li{display:flex;gap:17px;padding:4px 0}.trace-panel time{white-space:nowrap;color:#758c70;font-size:9px;min-width:65px}.trace-panel li[data-kind=error]{color:#e0a18b}.trace-panel li[data-kind=cached]{color:#c6b7df}.trace-empty{color:#7d927a;font-style:italic}.trace-footer{font:8px var(--mono);padding:11px 18px;border-top:1px solid #3b493c;display:flex;justify-content:space-between;color:#768e70;gap:15px}.wire-panel{min-width:0;border:1px solid #d4dac9;background:#fffef9;border-radius:12px;overflow:hidden}.wire-tabs{display:flex;border-bottom:1px solid #e2e6d9;background:#f1f3e9;padding:0 14px;gap:20px}.wire-tabs button{border:0;border-bottom:2px solid transparent;background:transparent;padding:15px 3px 13px;font:10px var(--mono);color:#8c977d;cursor:pointer}.wire-tabs button.selected{border-color:#809e53;color:#506b39}.wire-panel>p{font-size:10px;color:#8c947f;line-height:1.6;margin:18px 20px 12px}.wire-panel pre{white-space:pre-wrap;word-break:break-word;font:10px/1.9 var(--mono);padding:0 20px 20px;margin:0;color:#57694a;min-height:175px}.takeaways{padding:57px 0 48px}.takeaways>.eyebrow{font-size:8px}.takeaways>div{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.takeaways article{position:relative;padding-top:16px;border-top:1px solid #d9dece}.takeaways article>span{position:absolute;right:0;top:17px;font:9px var(--mono);color:#a3ad92}.takeaways h3{font-size:15px;margin:0 30px 12px 0;font-weight:600;letter-spacing:-.2px}.takeaways p{font-size:11px;line-height:1.9;color:#838b76;max-width:315px;margin:0}footer{max-width:1440px;margin:auto;padding:23px 44px 28px;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #dce0d2;font:9px/1.8 var(--mono);color:#919985}footer a{text-decoration:none;color:#71815d}footer a:hover{text-decoration:underline}@media(min-width:1500px){main,.site-header,footer{padding-left:64px;padding-right:64px}}@media(max-width:1120px){.lab{grid-template-columns:250px minmax(0,1fr)}.control-panel{padding:23px 18px}.journey-panel{padding:25px 18px}.stage{padding:9px 6px;min-height:147px}.stage strong{font-size:9px}.stage small{font-size:7px}.simulation-badge{display:none}.intro{gap:35px}.intro-note{max-width:290px}.summary-strip{grid-template-columns:.8fr 1.2fr 1fr}}@media(max-width:900px){.site-header{padding:20px 25px}main{padding:0 25px}.intro{padding-top:40px;gap:25px;grid-template-columns:1.3fr 1fr}h1{font-size:48px}.intro-copy{font-size:12px}.intro-note{padding:22px;max-width:260px}.intro-note strong{font-size:19px}.intro-note p{font-size:11px}.brand small{display:none}.lab{grid-template-columns:1fr}.control-panel{border-right:0;border-bottom:1px solid #d7deca;display:grid;grid-template-columns:1fr 1fr;column-gap:30px;padding:24px}.control-panel>*{grid-column:1/-1}.control-panel .request-fields{grid-column:1/-1}.range-heading{margin-top:0}.control-foot{max-width:310px}.control-panel .field-hint{margin-bottom:18px}.journey-panel{padding:25px 24px}.stage strong{font-size:11px}.stage small{font-size:8px}.stage{padding:10px;min-height:150px}.inspection{gap:16px}.wire-panel pre{font-size:9px}.takeaways>div{gap:22px}footer{padding-left:25px;padding-right:25px}.control-panel{display:block}.control-panel .range-heading{margin-top:20px}.control-panel .host-caption{margin-bottom:20px}.control-panel .range-labels{margin-bottom:12px}.control-panel .fault-label{margin-top:20px}.control-panel .panel-heading{margin-bottom:19px}.control-panel .request-fields{max-width:none}.control-panel .field-hint{max-width:640px}}@media(max-width:650px){.site-header{min-height:76px;padding:16px 20px;gap:12px}.brand{font-size:15px;gap:9px}.brand-mark{width:32px;height:36px;font-size:25px;border-radius:9px}.back-link{font-size:8px;max-width:120px;line-height:1.7;text-align:right}main{padding:0 18px}.intro{grid-template-columns:1fr;gap:28px;padding:34px 3px 32px}.eyebrow{font-size:7px;letter-spacing:.9px;margin-bottom:17px}h1{font-size:49px;letter-spacing:-2.5px;margin-bottom:16px}.intro-copy{font-size:12px;max-width:340px}.intro-note{justify-self:stretch;max-width:none;transform:rotate(0);padding:20px 23px}.intro-note strong{font-size:21px}.intro-note p{margin:10px 0 11px;font-size:11px}.intro-note .note-spark{font-size:41px;right:10px;top:-19px}.intro-note>span:last-child{font-size:7px}.control-panel{padding:22px 19px}.control-panel label{font-size:12px}.control-panel select,.control-panel input:not([type=range]){font-size:12px;min-height:43px}.control-panel .field-hint{font-size:11px}.range-heading output{font-size:11px}.control-panel input[type=range]{height:24px;margin-top:8px}.range-labels{font-size:9px}.journey-panel{padding:23px 17px}.journey-heading .eyebrow{font-size:7px}h2{font-size:27px}.run-bar{gap:7px;margin:22px 0 26px}.run-bar button{font-size:11px;min-height:42px;padding:10px 11px}.run-bar .reset-button{padding:8px;margin-left:0}.keyboard-hint{font-size:8px}.flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.stage{display:grid;grid-template-columns:33px 1fr;grid-template-rows:18px 24px 20px;column-gap:5px;min-height:99px;padding:10px 12px}.stage-number{grid-row:1;grid-column:2;font-size:8px}.stage-icon{grid-column:1;grid-row:1/4;height:100%;font-size:24px}.stage strong{grid-column:2;grid-row:2;min-height:0;font-size:11px}.stage small{display:none}.stage-result{grid-column:2;grid-row:3;padding-top:0;font-size:9px}.stage:not(:last-child):after{display:none}.stage:last-child{grid-column:1/-1;grid-template-columns:33px 1fr;min-height:81px;grid-template-rows:12px 22px 17px}.progress-track{margin:17px 0 20px}.current-step{padding:17px 14px;gap:11px;min-height:179px}.step-marker{width:26px;height:26px;font-size:18px}.current-step h3{font-size:15px}.current-step p:last-child{font-size:12px;line-height:1.8}.current-step .eyebrow{font-size:7px}.summary-strip{grid-template-columns:1fr 1fr;gap:19px 16px;margin:23px 0}.summary-strip>div:last-child{grid-column:1/-1}.summary-strip span{font-size:7px;letter-spacing:.6px}.summary-strip strong{font-size:11px}.explanation summary{font-size:12px}.explanation p{font-size:11px}.inspection{grid-template-columns:1fr;margin-top:20px;gap:19px}.trace-panel ol{min-height:160px;max-height:240px;font-size:10px}.trace-panel li{gap:12px}.trace-panel time{min-width:61px}.wire-panel pre{font-size:10px;min-height:150px}.wire-panel>p{font-size:11px}.takeaways{padding:38px 3px}.takeaways>div{grid-template-columns:1fr;gap:25px}.takeaways>.eyebrow{font-size:7px}.takeaways h3{font-size:16px}.takeaways p{font-size:12px;max-width:none}.takeaways article>span{font-size:10px}footer{padding:20px;flex-direction:column;gap:9px;font-size:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}.stage.current{transform:none}}
