:root{--bg: #eef3fb;--bg-2: #ffffff;--panel: #ffffff;--panel-2: #eef2fb;--line: #dbe3f0;--text: #1e293b;--muted: #64748b;--accent: #6366f1;--accent-2: #0891b2;--gold: #d97706;--danger: #ef4444;--ok: #059669;--radius: 14px;--shadow: 0 4px 16px rgba(30, 41, 59, .08)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:radial-gradient(120% 80% at 50% 0%,#dbeafe 0%,var(--bg) 55%);color:var(--text);-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}a{color:var(--accent-2);text-decoration:none}.app{max-width:720px;margin:0 auto;min-height:100%;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:#ffffffd9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}.topbar h1{font-size:18px;margin:0;letter-spacing:.3px}.topbar .sub{font-size:12px;color:var(--muted)}.iconbtn{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:8px 12px;font-size:14px}.iconbtn:active{transform:scale(.96)}.btn{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:11px 16px;font-size:15px;font-weight:600}.btn:active{transform:scale(.98)}.btn.ghost{background:var(--panel);border:1px solid var(--line);color:var(--text)}.btn.danger{background:var(--danger)}.btn.block{width:100%}.btn:disabled{opacity:.5}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.field label{font-size:13px;color:var(--muted)}input,select,textarea{background:var(--bg-2);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:11px 12px;font-size:15px;width:100%}textarea{resize:vertical;min-height:70px}.map{padding:12px 12px 100px}.district{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px;margin-bottom:14px;box-shadow:var(--shadow)}.district-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}.district-dot{width:12px;height:12px;border-radius:4px}.district-head h2{font-size:16px;margin:0;flex:1}.district-head .count{font-size:12px;color:var(--muted)}.houses{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}.house-cell{position:relative;background:linear-gradient(180deg,#f8fbff 0%,var(--panel-2) 100%);border:1px solid var(--line);border-radius:12px;padding:8px 6px 6px;text-align:center}.house-cell .name{font-size:11px;color:var(--muted);margin-top:4px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.house-cell .lvl{font-size:11px;color:var(--gold);font-weight:700}.house-cell.ruin{opacity:.75}.bubble-badge{position:absolute;top:-8px;right:-6px;min-width:20px;height:20px;padding:0 5px;background:var(--accent-2);color:#06283d;border-radius:999px;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px #22d3ee40;animation:pop 1.6s ease-in-out infinite}@keyframes pop{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}.tray{padding:0 12px 110px}.tray h3{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin:6px 4px}.bubble{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:8px 8px 8px 14px;margin-bottom:10px;box-shadow:var(--shadow)}.bubble .dot{width:36px;height:36px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#67e8f9,#0891b2);flex:0 0 auto;box-shadow:0 4px 14px #0891b266}.bubble .b-name{flex:1;font-size:14px}.bubble .b-metric{font-size:11px;color:var(--muted)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#040810a8;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:flex-end;justify-content:center}.sheet{width:100%;max-width:720px;background:var(--bg-2);border:1px solid var(--line);border-radius:18px 18px 0 0;padding:18px 16px 28px;box-shadow:0 -8px 40px #1e293b2e;animation:up .22s ease}@keyframes up{0%{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}.sheet h2{margin:0 0 4px;font-size:18px}.sheet .meta{color:var(--muted);font-size:13px;margin-bottom:16px}.progress{height:10px;background:var(--bg);border-radius:999px;overflow:hidden;border:1px solid var(--line)}.progress>i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2))}.section{padding:12px 16px 120px}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin-bottom:12px;box-shadow:var(--shadow)}.row{display:flex;align-items:center;gap:10px}.row+.row{margin-top:8px}.spacer{flex:1}.muted{color:var(--muted);font-size:13px}.pill{font-size:11px;padding:3px 8px;border-radius:999px;background:var(--panel-2);color:var(--muted)}.pill.ruin{background:#ef44442e;color:#fca5a5}.fab{position:fixed;bottom:22px;right:50%;transform:translate(50%);background:var(--accent);color:#fff;border:none;padding:14px 22px;border-radius:999px;font-size:15px;font-weight:700;box-shadow:0 10px 30px #6366f173;z-index:30}.bottomnav{position:fixed;bottom:0;left:0;right:0;z-index:25;display:flex;justify-content:space-around;background:#fffffff0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:8px 0 14px;max-width:720px;margin:0 auto}.bottomnav a{color:var(--muted);font-size:12px;text-align:center;padding:4px 16px}.bottomnav a.active{color:var(--text)}.center{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%;padding:24px;gap:14px}.toast{position:fixed;top:70px;left:50%;transform:translate(-50%);z-index:80;background:var(--ok);color:#fff;font-weight:700;padding:10px 18px;border-radius:999px;box-shadow:0 8px 24px #0006;animation:up .2s ease}.empty{text-align:center;color:var(--muted);padding:40px 16px}.mapcanvas{position:relative;flex:1;min-height:0;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,#dbeafe,#eef3fb 60%),repeating-linear-gradient(0deg,rgba(99,102,241,.04) 0 1px,transparent 1px 26px),repeating-linear-gradient(90deg,rgba(99,102,241,.04) 0 1px,transparent 1px 26px);touch-action:none}.mapctl{position:absolute;right:12px;bottom:84px;display:flex;flex-direction:column;gap:8px;z-index:10}.mapctl button{width:42px;height:42px;border-radius:12px;background:#fffffff2;border:1px solid var(--line);color:var(--text);font-size:18px;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center}.mapctl button:active{transform:scale(.94)}.tabs{display:flex;gap:6px;overflow-x:auto;padding:10px 12px;border-bottom:1px solid var(--line);background:#ffffffe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.tab{flex:0 0 auto;padding:8px 14px;border-radius:999px;font-size:14px;font-weight:600;background:var(--panel-2);border:1px solid var(--line);color:var(--muted);display:flex;align-items:center;gap:7px;white-space:nowrap}.tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.tab .tdot{width:9px;height:9px;border-radius:3px}