*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;color:#1E2329;background:#fff}
header{display:flex;align-items:center;gap:12px;padding:0 24px;height:64px;border-bottom:1px solid #EAECEF}.logo{font-size:20px}.logo span{color:#C99400}.sp{flex:1}
button{height:44px;padding:0 20px;border:0;border-radius:6px;font-weight:600;font-size:15px;cursor:pointer}.y{background:#FCD535;color:#1E2329}.ghost{background:#fff;border:1px solid #D0D5DD}.wide{width:100%;height:48px;font-size:16px}button:disabled{opacity:.5;cursor:not-allowed}
main{display:grid;grid-template-columns:1fr 380px;gap:24px;padding:24px}.mapwrap{position:relative}#map{height:calc(100vh - 140px);min-height:420px;border-radius:12px;border:1px solid #EAECEF}
#hint{position:absolute;z-index:500;top:16px;left:50%;transform:translateX(-50%);background:#fff;padding:8px 14px;border-radius:8px;font-weight:600}
.legend{position:absolute;z-index:500;left:12px;bottom:12px;background:#fff;padding:8px 12px;border-radius:8px;font-size:13px}
.card{border:1px solid #EAECEF;border-radius:12px;padding:20px;margin-bottom:16px}h3{margin:0 0 8px}.mu{color:#5E6673;font-size:13px}.red{color:#B42318}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}label{font-size:13px;color:#5E6673}
input,select{width:100%;height:44px;margin:4px 0 8px;padding:0 12px;border:1px solid #D0D5DD;border-radius:6px;font-size:16px}
.surge{background:#FEF6D8;border-radius:8px;padding:12px;margin:8px 0}.surge div,.sum div{display:flex;justify-content:space-between;font-size:14px;line-height:1.9}.surge span,.sum span{color:#5E6673}
.sum{border-top:1px solid #EAECEF;padding-top:8px;margin-bottom:8px}.big{font-size:20px}
.flag{position:relative;transform:translate(-1px,-100%);white-space:nowrap}.flag i{position:absolute;left:0;bottom:0;width:2px;height:30px;background:#fff}
.flag i:after{content:"";position:absolute;left:2px;top:0;border:8px solid transparent;border-left:16px solid #2E7CF6;border-right:0}.flag.listed i:after{border-left-color:#F6465D}
.flag b{position:absolute;left:-4px;bottom:32px;background:#fff;font-size:11px;padding:2px 6px;border-radius:4px}
.item{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 0;border-top:1px solid #EAECEF;font-size:13px}.item button{height:32px;padding:0 12px}
dialog{border:0;border-radius:12px;padding:24px;width:340px}#pay{background:#F5F5F5;border-radius:8px;padding:12px;font-size:13px;word-break:break-all}
@media(max-width:900px){main{grid-template-columns:1fr}}

.tabs{display:flex;background:#F5F5F5;border-radius:8px;padding:4px;margin-bottom:8px}.tabs button{flex:1;height:36px;background:transparent}.tabs .on{background:#fff}
.node{width:24px;height:24px;border-radius:50%;background:#FCD535;color:#1E2329;font-weight:700;font-size:13px;display:grid;place-items:center;border:2px solid #1E2329}
.cities{position:absolute;z-index:500;top:12px;left:12px;right:12px;display:flex;gap:6px;flex-wrap:wrap}.cities button{height:30px;padding:0 10px;font-size:12px;background:#fff;border:1px solid #D0D5DD}
.chip{display:inline-block;margin:2px;padding:4px 10px;border:1px solid #D0D5DD;border-radius:14px;font-size:12px;cursor:pointer}.chip.on{background:#FCD535;border-color:#FCD535}
#hist{max-height:320px;overflow:auto;margin-top:8px}

.cb{transform:translate(-50%,-50%);white-space:nowrap;padding:3px 9px;border-radius:12px;background:#fff;font-size:12px;font-weight:700;border:2px solid;cursor:pointer}.cb.up{border-color:#0A7F5A;color:#0A7F5A}.cb.down{border-color:#B42318;color:#B42318}
#chart{margin:4px 0 8px}