*{box-sizing:border-box}body{margin:0;color:#28434d;background:#fbfdfc;font:16px/1.7 "Microsoft YaHei",sans-serif}main{max-width:920px;margin:auto;padding:24px}header p{margin:0 0 8px;color:#5b7378}h1{font-size:26px;margin:0 0 8px}#flow{position:relative;padding:0 0 0 65px;margin-top:24px}#routes{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.stage{position:relative;background:#fff;border:1px solid #b9d5d2;border-radius:12px;padding:17px 22px;margin-bottom:34px}.stage:target{outline:3px solid #cb8b50;outline-offset:3px}.stage h2{display:flex;align-items:center;gap:12px;margin:0;font-size:20px}.stage h2 svg{width:34px;height:34px;stroke:#237d7c;fill:none;stroke-width:2.2}.role{margin:10px 0;color:#23706c;font-size:15px}.stage ul{display:grid;grid-template-columns:1fr 1fr;gap:5px 28px;padding-left:20px;margin:10px 0}.output{border-top:1px solid #e2ece9;padding-top:8px;margin:12px 0 0;color:#677575;font-size:15px}.gate{position:relative;min-height:125px;margin:-10px 0 24px;display:flex;align-items:flex-start;justify-content:center}.diamond{margin:5px 0 0;width:145px;height:65px;background:#f8f0dc;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);display:grid;place-content:center}.diamond span{font-size:14px;width:90px;text-align:center;line-height:1.4}.return{position:absolute;top:76px;left:0;background:#fbfdfc;font-size:14px;color:#99603c;text-decoration:none}.yes{position:absolute;top:80px;left:72%;font-size:15px;color:#256f6c}.loop{margin-left:65px;padding:14px;background:#f1f7f6;border-radius:8px}.loop a{color:#23706c}.note{color:#627579;font-size:14px}@media(max-width:600px){main{padding:16px 10px}#flow{padding-left:36px}.stage{padding:13px}.stage ul{grid-template-columns:1fr;gap:2px}.stage h2{font-size:18px;gap:7px}.role,.output{font-size:14px}.gate{min-height:145px}.return{top:90px;max-width:65%;line-height:1.45}.yes{top:90px}.loop{margin-left:36px}h1{font-size:23px}}