:root{color-scheme:light;--paper:#f5f5ed;--white:#fffef9;--ink:#172c24;--sub:#52665b;--line:#d8ded3;--green:#176145;--lime:#d9f292;--mono:ui-monospace,SFMono-Regular,Consolas,monospace}
*{box-sizing:border-box} [hidden]{display:none!important}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.55 system-ui,"Microsoft YaHei",sans-serif}
.shell{width:min(960px,calc(100% - 48px));margin:auto}.mast{border-bottom:1px solid var(--line)}.top{display:flex;justify-content:space-between;align-items:center;min-height:68px}.brand{display:flex;gap:9px;align-items:center;text-decoration:none;color:var(--ink);font-size:23px;letter-spacing:-.07em;font-weight:850}.mark{display:grid;place-items:center;background:var(--ink);color:var(--lime);font:800 18px var(--mono);width:33px;height:33px;border-radius:8px;letter-spacing:-.12em;padding-right:3px}.edition{color:var(--sub);font-size:13px}
.hero{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:47px 0 38px}.eyebrow{font:700 12px var(--mono);letter-spacing:.2em;color:var(--green);display:flex;gap:8px;align-items:center;margin:0 0 15px}.eyebrow span,.branches i{width:7px;height:7px;background:#3a865b;border-radius:50%;display:inline-block}h1{font-size:clamp(36px,6vw,63px);line-height:1.09;margin:0;font-weight:850;letter-spacing:-.065em}h1 em{font-style:normal;color:var(--green)}.lead{color:var(--sub);margin:17px 0 0;line-height:1.7}
.diagram{display:flex;justify-content:center;align-items:center;min-height:174px;flex:0 1 385px;padding:18px 21px;background:radial-gradient(#a7bba6 1px,transparent 1px) 0 0/13px 13px;border:1px solid #dae4d4;border-radius:18px}.diagram svg{width:80px;flex:0 1 80px;color:#5b8e71;overflow:visible}.source{display:grid;place-items:center;align-content:center;gap:2px;min-width:72px;height:77px;background:var(--lime);border:1px solid #b5cc74;border-radius:10px}.source b{font:800 24px var(--mono)}.source span{font-size:11px}.branches{display:flex;flex-direction:column;gap:13px}.branches span{white-space:nowrap;border:1px solid #bad0bd;background:#fafff7;border-radius:7px;padding:5px 11px;font:600 13px/20px var(--mono)}.branches i{margin-right:4px;width:6px;height:6px}
.card{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:22px 25px;box-shadow:0 2px 0 #182e2007;margin-bottom:15px}.section-top{display:flex;align-items:center;gap:10px}.step{font:700 12px var(--mono);color:var(--green);background:#e8f2e4;border-radius:6px;padding:6px 8px}h2{font-size:19px;line-height:1.2;margin:0;letter-spacing:-.02em}
fieldset{border:0;padding:4px;background:#edf0e8;border-radius:9px;display:inline-flex;gap:3px;margin:16px 0 11px}.choice{position:relative;cursor:pointer}.choice input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.choice span{display:block;border-radius:6px;padding:5px 12px;color:var(--sub);font-weight:600;font-size:13px}.choice input:checked+span{background:var(--white);color:var(--ink);box-shadow:0 1px 3px #182e2017}.choice input:focus-visible+span{outline:2px solid var(--green);outline-offset:2px}
#url,textarea{width:100%;display:block;color:var(--ink);background:#fbfcf7;border:1px solid #cfd8cc;border-radius:9px;padding:12px 13px;font:14px/1.55 var(--mono)}textarea{resize:vertical;min-height:110px}::placeholder{color:#68796f;opacity:1}.hint{margin:8px 0 0;color:var(--sub);font-size:12px}
.actions,.result-actions{display:flex;gap:8px;align-items:center}.actions{margin-top:15px}button{font:700 14px/1.3 inherit;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;border:1px solid transparent;border-radius:8px;padding:9px 13px;color:var(--ink)}button:focus-visible,input:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid var(--green);outline-offset:3px}.primary{background:var(--ink);color:#fbfff2}.primary:hover{background:#285141}.primary span{margin-left:9px;color:var(--lime)}.quiet{background:transparent;color:var(--green);border-color:var(--line)}.quiet:hover{background:#edf4e9}button:disabled{opacity:.6;cursor:wait}
.result-head{display:flex;align-items:center;justify-content:space-between;gap:9px;flex-wrap:wrap}.count{font:700 12px var(--mono);background:#eef4df;border-radius:20px;padding:5px 8px}.empty{display:flex;justify-content:center;align-items:center;gap:9px;background:#f8faf4;border:1px dashed #dce3d6;border-radius:9px;margin-top:15px;color:var(--sub);min-height:65px;font-size:13px}.empty span{font:20px var(--mono);color:var(--green)}.nodes{list-style:none;padding:0;margin:12px 0 0}.node{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}.node-title{margin:0 0 2px;font-size:14px;overflow-wrap:anywhere}.protocol{display:inline-block;margin-right:8px;border-radius:4px;padding:2px 5px;background:#e7f1e6;color:#18563d;font:700 11px var(--mono);vertical-align:1px}.node code{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--sub);font:12px/1.4 var(--mono)}.error{color:#8c2328;background:#fff0ed;border-radius:8px;padding:8px 11px;margin:10px 0 0}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);max-width:calc(100% - 28px);width:max-content;background:var(--ink);color:white;border-radius:9px;padding:9px 14px;margin:0;box-shadow:0 3px 14px #0003}.toast:empty{display:none}footer{display:flex;justify-content:space-between;padding:0 2px 22px;color:var(--sub);font-size:12px}footer span:first-child{font-family:var(--mono)}.dim{color:#758b7e}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:680px){.shell{width:calc(100% - 32px)}.top{min-height:55px}.hero{flex-direction:column;align-items:stretch;padding:27px 0 22px;gap:17px}.diagram{flex:auto;min-height:130px;padding:10px}.diagram svg{height:96px}.branches{gap:6px}.branches span{padding:3px 8px}.source{height:61px}.wide{display:none}.card{padding:16px}.result-actions button{padding:7px 8px;font-size:12px}}