:root{font-family:Avenir Next,Segoe UI,system-ui,sans-serif;color:#1d1c1a;background:#e9e7e2}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}.app-shell{width:100%;height:100%;position:relative;background:radial-gradient(circle at 30% 15%,#f7f5ee,#ece8dc 45%,#ddd8cc)}.hud{position:absolute;z-index:2;top:14px;left:14px;width:min(500px,calc(100% - 360px));background:#ffffffc4;border:1px solid rgba(50,45,38,.16);border-radius:12px;padding:10px 12px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.hud h1{margin:0;font-size:1rem;letter-spacing:.01em}.brand-title{margin:0;font-size:1rem;letter-spacing:.01em;line-height:1.15}.brand-ids{color:#0f172a;font-weight:800}.brand-tech{color:#334155;font-weight:700}.brand-gradient{font-weight:900;background:linear-gradient(120deg,#f97316,#facc15,#22c55e,#0ea5e9,#f97316);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:brandFlow 6s linear infinite;text-shadow:0 0 14px rgba(249,115,22,.22)}@keyframes brandFlow{0%{background-position:0% 50%}to{background-position:300% 50%}}.hud p{margin:0;font-size:.9rem;line-height:1.3}.control-grid{margin-top:10px;display:grid;gap:8px}.control-grid label{display:grid;gap:4px;font-size:.84rem;color:#2a2723}.control-grid input[type=range]{width:100%}.hud code{font-family:SF Mono,Menlo,Monaco,Consolas,monospace}.dun-panel{position:absolute;z-index:3;top:14px;right:14px;width:min(320px,calc(100% - 28px));max-height:calc(100% - 28px);display:flex;flex-direction:column;gap:8px;background:linear-gradient(165deg,#ffffff4d,#f0f6ff24);border:1px solid rgba(255,255,255,.45);border-radius:16px;padding:12px;-webkit-backdrop-filter:blur(15px) saturate(135%);backdrop-filter:blur(15px) saturate(135%);box-shadow:0 18px 30px #0003}.rumah-panel{position:absolute;z-index:3;left:14px;bottom:14px;width:min(140px,calc((100% - 28px)/2));background:linear-gradient(165deg,#ffffff4d,#f0f6ff24);border:1px solid rgba(255,255,255,.45);border-radius:14px;padding:10px;-webkit-backdrop-filter:blur(15px) saturate(135%);backdrop-filter:blur(15px) saturate(135%);box-shadow:0 18px 30px #0003}.building-editor{margin-bottom:8px;display:grid;gap:4px}.building-editor-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.building-editor label{font-size:.64rem;font-weight:700;color:#111827;letter-spacing:.02em;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px 1px 0 #ffffff,1px 1px 0 #ffffff}.building-editor-actions{display:flex;align-items:center;gap:5px}.building-zoom-btn{border:1px solid rgba(255,255,255,.35);background:#0f172a61;color:#f8fafc;border-radius:7px;font-size:.62rem;font-weight:700;padding:3px 7px;cursor:pointer}.building-zoom-btn:disabled{opacity:.5;cursor:not-allowed}.building-edit-btn{width:24px;height:24px;border:1px solid rgba(255,255,255,.35);background:#0f172a61;color:#f8fafc;border-radius:7px;font-size:.72rem;font-weight:800;line-height:1;cursor:pointer}.building-editor input{width:100%;border:1px solid rgba(255,255,255,.35);background:#1f29375c;color:#f8fafc;border-radius:8px;padding:6px 8px;font-size:.72rem;outline:none}.building-editor input::placeholder{color:#f1f5f9c7}.building-name-view{width:100%;border:1px solid rgba(255,255,255,.24);background:#1f293738;color:#e2e8f0;border-radius:8px;padding:6px 8px;font-size:.72rem;font-weight:600;line-height:1.2}.kampung-panel{position:absolute;z-index:20;left:14px;top:120px;bottom:auto;width:min(140px,calc((100% - 28px)/2));max-height:250px;display:flex;flex-direction:column;gap:6px;background:linear-gradient(165deg,#ffffff4d,#f0f6ff24);border:1px solid rgba(255,255,255,.45);border-radius:14px;padding:10px;-webkit-backdrop-filter:blur(15px) saturate(135%);backdrop-filter:blur(15px) saturate(135%);box-shadow:0 18px 30px #0003}.kampung-panel-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.kampung-panel-header h3{margin:0;font-size:.84rem;color:#111827;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px 1px 0 #ffffff,1px 1px 0 #ffffff}.kampung-panel-header span{color:#111827;font-size:.72rem;font-weight:700;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px 1px 0 #ffffff,1px 1px 0 #ffffff}.kampung-list{overflow:auto;display:grid;gap:4px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.75) rgba(255,255,255,.2)}.kampung-list::-webkit-scrollbar{width:10px}.kampung-list::-webkit-scrollbar-track{background:linear-gradient(180deg,#ffffff3d,#ffffff1a);border:1px solid rgba(255,255,255,.28);border-radius:999px;-webkit-backdrop-filter:blur(8px) saturate(130%);backdrop-filter:blur(8px) saturate(130%)}.kampung-list::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#ffffffc7,#bfdbfe8c);border:1px solid rgba(255,255,255,.68);border-radius:999px;box-shadow:inset 0 1px #ffffffe0,0 4px 10px #0f172a33}.kampung-item{border:1px solid rgba(255,255,255,.35);background:#0f172a6b;color:#f8fafc;border-radius:8px;text-align:left;padding:5px 7px;cursor:pointer}.kampung-item.active{background:#38bdf8cc;border-color:#bae6fdf2;color:#06283d}.kampung-item-name{display:block;font-size:.7rem;font-weight:600;line-height:1.2}.kampung-item-dun{display:block;margin-top:2px;opacity:.9;font-size:.62rem}.rumah-count-panel{position:absolute;z-index:3;top:14px;right:346px;width:170px;background:linear-gradient(165deg,#ffffff52,#f0f6ff24);border:1px solid rgba(255,255,255,.45);border-radius:14px;padding:9px 11px;-webkit-backdrop-filter:blur(15px) saturate(135%);backdrop-filter:blur(15px) saturate(135%);box-shadow:0 18px 30px #0003}.rumah-count-label{font-size:.72rem;color:#334155;font-weight:700;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px 1px 0 #ffffff,1px 1px 0 #ffffff}.rumah-count-value{margin-top:2px;font-size:1.16rem;color:#0f172a;font-weight:900;line-height:1.1;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px 1px 0 #ffffff,1px 1px 0 #ffffff}.dun-panel h2{margin:0;font-size:.96rem;letter-spacing:.02em;color:#111827;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px 1px 0 #ffffff,1px 1px 0 #ffffff}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.collapse-btn{border:1px solid rgba(255,255,255,.35);background:#0f172a61;color:#f8fafc;border-radius:8px;font-size:.76rem;padding:4px 8px;cursor:pointer}.dun-filter-input{width:100%;border:1px solid rgba(255,255,255,.35);background:#1f29375c;color:#f8fafc;border-radius:10px;padding:8px 10px;outline:none}.dun-filter-input::placeholder{color:#f1f5f9cc}.dun-count{font-size:.82rem;color:#f1f5f9f2}.layer-card{border:1px solid rgba(255,255,255,.28);background:#0f172a57;border-radius:9px;padding:6px 8px}.layer-toggle{display:flex;align-items:center;gap:6px;font-size:.74rem;color:#f8fafc;-webkit-user-select:none;user-select:none;cursor:pointer}.layer-toggle input[type=checkbox]{accent-color:#22d3ee}.layer-toggle--rumah input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}.jalan-toggle{margin-top:4px}.jalan-toggle input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}.jalan-layer-title{margin-top:8px;color:#111827;font-size:.66rem;font-weight:800;letter-spacing:.03em;text-shadow:-1px -1px 0 #ffffff,1px -1px 0 #ffffff,-1px 1px 0 #ffffff,1px 1px 0 #ffffff}.tick-ui{width:15px;height:15px;border-radius:5px;border:1px solid rgba(255,255,255,.55);background:linear-gradient(160deg,#ffffff42,#0f172a33);box-shadow:inset 0 1px #ffffff73,0 2px 6px #00000040;position:relative;transition:all .18s ease}.tick-ui:after{content:"";position:absolute;width:4px;height:8px;border-right:2px solid #06283d;border-bottom:2px solid #06283d;left:5px;top:1px;transform:rotate(45deg) scale(.7);opacity:0;transition:all .18s ease}.layer-toggle--rumah input[type=checkbox]:checked+.tick-ui{background:linear-gradient(160deg,#22d3eee0,#0ea5e9b8);border-color:#bae6fdf2;box-shadow:inset 0 1px #ffffff9e,0 0 0 2px #38bdf842,0 4px 10px #0e749059}.layer-toggle--rumah input[type=checkbox]:checked+.tick-ui:after{opacity:1;transform:rotate(45deg) scale(1)}.jalan-toggle input[type=checkbox]:checked+.tick-ui{background:linear-gradient(160deg,#facc15eb,#fb923cc7);border-color:#fef08aeb;box-shadow:inset 0 1px #ffffff9e,0 0 0 2px #fbbf2442,0 4px 10px #92400e59}.jalan-toggle input[type=checkbox]:checked+.tick-ui:after{opacity:1;transform:rotate(45deg) scale(1)}.dun-list{overflow:auto;display:grid;gap:6px;padding-right:4px}.dun-item{border:1px solid rgba(255,255,255,.2);background:#0f172a73;color:#f8fafc;border-radius:9px;text-align:left;padding:7px 9px;cursor:pointer}.dun-item.active{background:#b7d209;border-color:#b7d209f2;color:#1f2937}.dun-label{pointer-events:auto;font-family:Avenir Next,Segoe UI,system-ui,sans-serif;font-size:.36rem;font-weight:600;line-height:1.1;color:#111827;background:#ffffffeb;border:1px solid rgba(17,24,39,.26);box-shadow:0 1px 4px #0003;border-radius:3px;padding:1px 3px;white-space:nowrap;cursor:pointer}.dun-label.active{background:#b7d209;color:#1f2937;border-color:#60780ae6}.dun-label.dimmed{opacity:.4}.kampung-label{pointer-events:none;font-family:Avenir Next,Segoe UI,system-ui,sans-serif;font-size:.46rem;font-weight:500;color:#111827e0;background:#ffffff75;border:1px solid rgba(31,41,55,.16);border-radius:3px;padding:0 3px;white-space:nowrap}.kampung-tooltip{min-width:112px;max-width:168px;background:linear-gradient(160deg,#ffffff75,#f0f6ff33);border:1px solid rgba(255,255,255,.56);border-radius:9px;padding:5px 7px;-webkit-backdrop-filter:blur(14px) saturate(130%);backdrop-filter:blur(14px) saturate(130%);box-shadow:0 12px 26px #0f172a40}.kampung-tooltip-name{font-size:.68rem;font-weight:700;color:#0f172a;line-height:1.15}.kampung-tooltip-sub{margin-top:2px;font-size:.58rem;font-weight:600;color:#334155}@media(max-width:1024px){.hud{width:calc(100% - 28px)}.dun-panel{top:auto;bottom:14px;width:calc(100% - 28px);max-height:42%}.rumah-panel{left:14px;right:14px;bottom:14px;width:auto}.kampung-panel{left:14px;width:calc((100% - 28px)/2);max-height:240px}.rumah-count-panel{top:64px;right:14px;width:170px}}