* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body, html { margin: 0; padding: 0; height: 100%; font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; overflow: hidden; }
#map { width: 100vw; height: 100vh; z-index: 1; padding-top: 56px; }

.title-bar {
    position: fixed; top: 0; left: 0; width: 100vw; z-index: 1000;
    background: #0F5FDC;
    padding: 10px 15px; box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    display: flex; align-items: center; justify-content: space-between;
    pointer-events: none; user-select: none;
}
.title-texts { display: flex; flex-direction: column; }
.title-nepali {
    font-family: "Kalimati", "Noto Sans Devanagari", serif;
    font-size: 14px; font-weight: 700; color: #fff; margin: 0; line-height: 1.3;
}
.title-english { font-size: 9.5px; color: rgba(255,255,255,0.82); margin: 0; }
.level-badge {
    background: rgba(255,255,255,0.2); color: white;
    font-size: 10px; font-weight: 700;
    padding: 3px 10px; border-radius: 20px; pointer-events: none;
}

.bottom-sheet {
    position: fixed; bottom: 0; left: 0; width: 100vw; z-index: 1000;
    background: #0F5FDC;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.25);
    transform: translateY(100%);
    transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);
    overflow: hidden;
}
.bottom-sheet.open { transform: translateY(0); }
.sheet-handle { width: 40px; height: 4px; background: rgba(255,255,255,0.4); border-radius: 2px; margin: 10px auto 0; }
.sheet-header {
    background: #0a4ab5;
    color: white; padding: 12px 16px; font-size: 14px; font-weight: 700;
    display: flex; justify-content: space-between; align-items: center;
}
.sheet-close {
    background: rgba(255,255,255,0.2); border: none; color: white;
    font-size: 16px; width: 28px; height: 28px; border-radius: 50%;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.sheet-close:active { background: rgba(255,255,255,0.35); }
.sheet-body { padding: 12px 16px 28px; }
.info-row {
    display: flex; justify-content: space-between;
    padding: 10px 0; font-size: 13px;
    border-bottom: 1px solid rgba(255,255,255,0.2);
}
.info-row:last-of-type { border-bottom: none; }
.info-row .label { color: rgba(255,255,255,0.75); }
.info-row .value { font-weight: 700; color: #ffffff; text-align: right; }
.enter-btn {
    width: 100%; padding: 13px; background: white; color: #0F5FDC;
    border: none; border-radius: 10px;
    cursor: pointer; font-weight: 700; font-size: 14px; margin-top: 14px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.enter-btn:active { background: #e8f0fe; transform: scale(0.98); }

.back-btn {
    position: fixed; bottom: 24px; left: 16px; z-index: 1001;
    padding: 12px 22px; background: white;
    border: 2px solid #0F5FDC; color: #0F5FDC;
    font-size: 13px; font-weight: 700;
    border-radius: 25px; cursor: pointer; display: none;
    box-shadow: 0 4px 14px rgba(0,0,0,0.12);
}
.back-btn:active { background: #0F5FDC; color: white; }

.loading-overlay {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    background: rgba(255,255,255,0.7); z-index: 2000;
    display: none; align-items: center; justify-content: center;
    flex-direction: column; gap: 14px;
}
.loading-overlay.active { display: flex; }
.spinner {
    width: 44px; height: 44px; border: 4px solid #e0e0e0;
    border-top-color: #0F5FDC; border-radius: 50%;
    animation: spin 0.8s linear infinite;
}
.loading-text { font-size: 13px; color: #0F5FDC; font-weight: 600; }
@keyframes spin { to { transform: rotate(360deg); } }

.mun-label {
    background: transparent !important; border: none !important;
    box-shadow: none !important; pointer-events: none;
    text-align: center; line-height: 1.2; white-space: nowrap;
}

.leaflet-bottom.leaflet-right { bottom: 80px !important; right: 12px !important; }
.leaflet-control-zoom a {
    width: 36px !important; height: 36px !important;
    line-height: 36px !important; font-size: 18px !important;
}