:root{--bg:#f2f4f7;--panel:#fff;--text:#101828;--muted:#667085;--line:#d0d5dd;--primary:#101828;--green:#22b55b;--danger:#d92d20;--shadow:0 18px 45px rgba(16,24,40,.18)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--text);background:var(--bg)}button,input{font:inherit}button{cursor:pointer}.hidden{display:none!important}#app{height:100%;display:flex;flex-direction:column}.topbar{height:68px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:#fff;border-bottom:1px solid var(--line);z-index:20}.brand{display:flex;align-items:center;gap:10px}.brand-mark{width:38px;height:38px;border-radius:12px;background:#101828;color:#fff;display:grid;place-items:center;font-weight:900;font-size:21px}.brand span:last-child{display:flex;flex-direction:column}.brand strong{font-size:16px;letter-spacing:.2px;white-space:nowrap}.brand small{font-size:11px;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:8px}.btn,.icon-btn{border:1px solid var(--line);background:#fff;color:var(--text);border-radius:10px;padding:9px 13px;font-weight:650}.btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}.btn.danger{color:var(--danger);border-color:#fda29b}.btn.ghost{background:#fff}.btn.full{width:100%;margin-top:12px}.icon-btn{width:40px;font-size:22px;padding:4px}.workspace{position:relative;display:flex;flex:1;min-height:0}.map-viewport{position:relative;flex:1;min-width:0;overflow:hidden;background:#fff;touch-action:none;user-select:none}.map-viewport svg{width:100%;height:100%;display:block;touch-action:none}.city-shape{stroke:#111;stroke-width:2.1;vector-effect:non-scaling-stroke;transition:fill .18s ease;cursor:pointer}.city-shape.selected{stroke:#ff7a00;stroke-width:4}.city-label{pointer-events:none;text-anchor:middle;dominant-baseline:middle;font-weight:760;fill:#b42318;paint-order:stroke;stroke:#fff;stroke-width:2.8px;stroke-linejoin:round}.city-label .owner{font-size:14px;fill:#101828}.city-label .city-id{font-size:26px}.map-hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);padding:7px 12px;border-radius:999px;background:rgba(16,24,40,.82);color:#fff;font-size:12px;white-space:nowrap;pointer-events:none}.zoom-controls{position:absolute;right:14px;bottom:54px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 8px 24px rgba(16,24,40,.16)}.zoom-controls button{width:42px;height:42px;border:0;border-bottom:1px solid var(--line);background:#fff;font-size:22px;font-weight:700}.zoom-controls button:last-child{border-bottom:0}.ranking-panel{width:330px;flex:none;background:#fff;border-left:1px solid var(--line);display:flex;flex-direction:column}.panel-head,.modal-head,.sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px;border-bottom:1px solid #eaecf0}.panel-head h2,.modal-head h2,.sheet-head h2{margin:0;font-size:19px}.panel-head p,.modal-head p,.sheet-head p{margin:4px 0 0;color:var(--muted);font-size:12px}.close-btn{border:0;background:#f2f4f7;width:34px;height:34px;border-radius:50%;font-size:22px;line-height:1}.ranking-panel .close-btn{display:none}.ranking-list{flex:1;overflow:auto;padding:10px}.ranking-empty{padding:50px 20px;text-align:center;color:var(--muted)}.rank-row{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:8px;padding:11px 10px;border-radius:12px;margin-bottom:6px;border:1px solid transparent}.rank-row.mine{background:#ecfdf3;border-color:#75e0a7}.rank-no{font-size:18px;font-weight:850;color:#475467}.rank-main{min-width:0}.rank-name{display:flex;align-items:center;gap:8px;font-weight:750}.color-dot{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.25);flex:none}.rank-meta{font-size:12px;color:var(--muted);margin-top:3px}.rank-score{text-align:right;font-weight:850}.rank-score small{display:block;font-size:10px;color:var(--muted);font-weight:500}.score-rule{border-top:1px solid #eaecf0;padding:12px 16px;display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--muted)}.score-rule strong{color:var(--text);font-size:12px}.backdrop{position:fixed;inset:0;background:rgba(16,24,40,.46);z-index:40}.modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:16px}.modal-card{width:min(520px,100%);max-height:min(82vh,760px);overflow:auto;background:#fff;border-radius:20px;box-shadow:var(--shadow)}.modal-card.large{width:min(720px,100%)}.add-form{display:grid;grid-template-columns:1fr auto auto;gap:10px;padding:16px 18px}.add-form input[type=text],.add-form input:not([type]){min-width:0}.add-form>input{border:1px solid var(--line);border-radius:10px;padding:10px 12px}.color-field{border:1px solid var(--line);border-radius:10px;padding:5px 8px;display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}.color-field input{width:34px;height:30px;border:0;background:none;padding:0}.help-text{margin:0 18px 12px;padding:10px 12px;background:#f9fafb;border-radius:10px;color:var(--muted);font-size:12px;line-height:1.55}.manage-list{padding:0 18px 18px}.manage-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:9px;align-items:center;padding:10px 0;border-bottom:1px solid #eaecf0}.manage-row input[type=text]{width:100%;min-width:0;border:1px solid var(--line);border-radius:9px;padding:9px}.manage-row input[type=color]{width:40px;height:38px;border:1px solid var(--line);border-radius:9px;padding:3px;background:#fff}.small-btn{border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 10px;font-weight:650}.small-btn.danger{color:var(--danger)}.mine-badge{font-size:10px;color:#087a3d;background:#dcfae6;padding:3px 6px;border-radius:999px}.choice-list{padding:12px 18px;max-height:45vh;overflow:auto}.choice-row{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);background:#fff;border-radius:12px;padding:12px;margin-bottom:8px;text-align:left}.choice-row.active{border-color:#22b55b;background:#ecfdf3}.choice-main{display:flex;align-items:center;gap:10px;min-width:0}.choice-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.choice-meta{font-size:11px;color:var(--muted)}.sheet{position:fixed;z-index:60;left:50%;bottom:0;transform:translateX(-50%);width:min(650px,100%);max-height:80vh;overflow:auto;background:#fff;border-radius:22px 22px 0 0;box-shadow:var(--shadow);padding-bottom:env(safe-area-inset-bottom)}.sheet-handle{width:42px;height:5px;background:#d0d5dd;border-radius:999px;margin:8px auto 0}.sheet-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px 18px 6px}.action-card{border:0;border-radius:14px;padding:14px;text-align:left;display:flex;flex-direction:column;gap:4px}.action-card strong{font-size:16px}.action-card span{font-size:11px}.action-card.occupy{background:#dcfae6;color:#05603a}.action-card.abandon{background:#fee4e2;color:#912018}.section-title{font-size:13px;margin:14px 18px 0}.settings-grid{padding:16px 18px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.setting-item{border:1px solid var(--line);background:#fff;border-radius:12px;padding:13px;text-align:left;display:flex;flex-direction:column;gap:4px}.setting-item strong{font-size:14px}.setting-item span{font-size:11px;color:var(--muted)}.file-item input{display:none}.danger-item{border-color:#fda29b;background:#fff5f4}.privacy-note{margin:0 18px 18px;padding:12px;background:#f9fafb;border-radius:12px;font-size:12px;line-height:1.55;color:var(--muted)}.privacy-note strong{color:var(--text)}.privacy-note p{margin:6px 0 0}.toast{position:fixed;z-index:100;left:50%;bottom:86px;transform:translateX(-50%);background:#101828;color:#fff;padding:10px 15px;border-radius:10px;box-shadow:var(--shadow);font-size:13px;max-width:86vw;text-align:center}.toast.error{background:#b42318}@media(max-width:900px){.topbar{height:60px;padding:8px 10px}.brand-mark{width:34px;height:34px}.brand strong{font-size:14px}.top-actions{gap:5px}.top-actions .btn{padding:8px 9px;font-size:12px}.ranking-panel{position:fixed;z-index:45;right:0;top:60px;bottom:0;width:min(88vw,360px);transform:translateX(105%);transition:transform .22s ease;box-shadow:var(--shadow)}.ranking-panel.open{transform:translateX(0)}.ranking-panel .close-btn{display:block}.map-hint{bottom:10px;font-size:10px}.zoom-controls{right:10px;bottom:43px}.zoom-controls button{width:38px;height:38px}.city-label .owner{font-size:13px}.city-label .city-id{font-size:25px}}@media(max-width:560px){.brand{gap:7px}.brand-mark{width:30px;height:30px;font-size:17px}.brand strong{font-size:12px;letter-spacing:0}.brand small{display:none}.top-actions .btn{font-size:0;width:38px;height:38px;padding:0}.top-actions .btn:before{font-size:17px}.top-actions #legionBtn:before{content:'团'}.top-actions #myLegionBtn:before{content:'我'}.top-actions #rankingBtn:before{content:'榜'}.add-form{grid-template-columns:1fr auto}.add-form .btn{grid-column:1/-1}.settings-grid{grid-template-columns:1fr}.manage-row{grid-template-columns:auto 1fr auto}.manage-row .delete-legion{grid-column:2/4}.modal{padding:10px}.modal-card{border-radius:16px}.map-hint{display:none}}