*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:-apple-system,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;color:#222}
#map{position:absolute;inset:0}
#panel{position:absolute;top:10px;left:10px;width:330px;max-height:calc(100% - 20px);overflow:auto;background:rgba(255,255,255,.96);border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.2);padding:12px 14px;font-size:13px;z-index:2}
h1{font-size:17px;margin:0 0 2px}.sub{margin:0 0 10px;color:#555;font-size:12px}
.ctl{margin:8px 0}.ctl>label{display:block;font-weight:600;margin-bottom:4px;color:#333}
.seg{display:flex;flex-wrap:wrap;gap:4px}.seg button{flex:1 1 auto;border:1px solid #bbb;background:#fff;border-radius:4px;padding:4px 6px;cursor:pointer;font-size:12px}
.seg button.on{background:#1f4e79;color:#fff;border-color:#1f4e79}
.row{display:flex;align-items:center;gap:6px}.row input[type=range]{flex:1}
select{font-size:12px;padding:3px}#pal{width:100%}.hint{color:#777;font-size:11px}
#play{border:1px solid #1f4e79;background:#fff;color:#1f4e79;border-radius:4px;padding:3px 8px;cursor:pointer}
#legend{margin:10px 0}.lg-t{font-weight:600;margin-bottom:4px}.lg-r{display:flex;align-items:center;gap:6px;line-height:18px}.lg-s{width:22px;height:13px;border:1px solid rgba(0,0,0,.15)}
#rank{margin:4px 0 0;padding-left:22px}#rank li{cursor:pointer;line-height:19px}#rank li:hover{text-decoration:underline}#rank li.sep{list-style:none;color:#999;cursor:default}
summary{font-weight:600;cursor:pointer}
#chartBox{margin-top:8px}.ct{font-weight:600;font-size:12px}
.links{margin:10px 0 0;font-size:12px}a{color:#1f4e79}
#note{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:10;display:flex;align-items:center;justify-content:center}#note[hidden]{display:none}
.nb{background:#fff;max-width:720px;width:92%;max-height:86%;overflow:auto;border-radius:8px;padding:16px 22px;position:relative;font-size:13.5px;line-height:1.65}
.nb h2{margin-top:0}.nb h3{margin:12px 0 4px;font-size:15px}#closeNote{position:absolute;right:12px;top:8px;font-size:22px;border:0;background:none;cursor:pointer}
#tip{position:absolute;pointer-events:none;background:rgba(255,255,255,.95);border:1px solid #999;border-radius:4px;padding:4px 7px;font-size:12px;z-index:3}
.pp b{font-size:14px}.pp table{border-collapse:collapse;margin-top:4px}.pp td{padding:1px 6px 1px 0;font-size:12px}.pp td:last-child{text-align:right}
@media (max-width:640px){#panel{width:auto;right:10px;max-height:46%}}