*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{color:#333;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","PingFang SC","Microsoft YaHei","Source Han Sans SC",sans-serif;background-color:#e6f4ea;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' opacity='.1'><path d='M100 20c40 0 70 30 70 70s-30 70-70 70-70-30-70-70 30-70 70-70z' fill='none' stroke='%2300c250' stroke-width='10'/></svg>");background-repeat:repeat}
a{text-decoration:none}
.page{width:100%;min-height:100vh}
.hero{max-width:900px;margin:40px auto;padding:0 20px;text-align:center}
.shield{width:82px;height:92px;margin:0 auto 10px}.shield svg{display:block;width:100%;height:100%;filter:drop-shadow(0 2px 2px rgba(0,0,0,.12))}.shield path:first-child{fill:#32ad1b}.shield .check{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.brand{display:flex;min-height:90px;align-items:center;justify-content:center;padding:20px;border-radius:15px;background:rgba(255,255,255,.9);box-shadow:0 2px 10px rgba(0,0,0,.1);color:#45bd67;font-family:"Comic Sans MS","KaiTi",cursive;font-size:36px;letter-spacing:8px;cursor:pointer}
.flag{margin-top:23px;font-size:16px}
.field{width:100%;margin:1px 0;border-radius:20px;background:#fff;box-shadow:0 4px 15px rgba(0,194,80,.2);transition:transform .3s,box-shadow .3s}
.field:hover{transform:scale(1.01);box-shadow:0 6px 20px rgba(0,194,80,.3)}
.routes{padding:1px 0}
.route{position:relative;width:80%;height:50px;margin:14px auto;overflow:hidden;border:2px solid #55c356;border-radius:50px;background:#fff;text-align:center;line-height:46px;transition:.3s}
.route:hover{transform:scale(1.02);box-shadow:0 4px 15px rgba(0,0,0,.1)}
.route-icon{float:left;width:36px;height:46px;background:#55c356}
.route-ping{float:right;width:86px;height:46px;background:#55c356;color:#fff;font-size:16px}
.route-link{display:block;height:46px;padding:0 10px;font-weight:500}
.route-link span{position:relative;display:inline-block;padding-left:25px;transition:color .3s}
.route-1 .route-link span{color:#55c356}.route-2 .route-link span{color:#57aade}.route-3 .route-link span{color:#ee7783}
.icon{display:inline-block;width:27px;height:27px;margin-top:9px;background-position:center;background-repeat:no-repeat;background-size:contain;vertical-align:top}
.icon.chain{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2'><path d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/><path d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/></svg>")}
.icon.arrow{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2'><path d='M5 12h14M12 5l7 7-7 7'/></svg>")}
.icon.star{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2'><polygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'/></svg>")}
.notice{padding:0 0 0 16px;color:#49b969;font-size:20px;line-height:34px}
.guide{padding:0 0 14px;text-align:center}
.guide h2{margin-bottom:16px;color:#ef111b;font-size:28px;font-weight:700}
.guide ul{max-width:900px;margin:0 auto}
.guide li{text-align:left;margin:9px 0;font-size:14px;line-height:1.6}
.guide a{color:#49b969}.guide a:hover{text-decoration:underline}
.share-icon{display:inline-flex;width:20px;height:20px;align-items:center;justify-content:center;border-radius:4px;color:#2f9f52;font-weight:700}
.foot{padding:10px;text-align:center;font-size:14px}
@media(max-width:768px){.hero{margin:24px auto;padding:0 15px}.shield{width:72px;height:82px}.brand{min-height:75px;padding:16px;font-size:28px;letter-spacing:5px}.flag{margin-top:20px;font-size:15px}.route{width:92%}.notice{padding:5px 15px;font-size:16px}.guide{padding:12px 15px 18px}.guide ul{margin:0 10px}.field{border-radius:14px}}
@media(max-width:420px){.hero{margin-top:18px}.brand{font-size:25px;letter-spacing:3px}.route{width:94%;margin:12px auto}.route-ping{width:64px}.route-link span{padding-left:8px}.guide h2{font-size:25px}}
