body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: var(--text-color); background: linear-gradient(135deg, #17162b 0%, #201e35 100%); margin: 0; padding: 20px; display: flex; justify-content: center; min-height: 100vh; }
        .container { max-width: 800px; width: 100%; }
        h1, h2 { color: #1df926; text-align: center; margin-bottom: 30px; margin-top: 10px; }
        .header { height: 70px; display: flex; justify-content: center; align-items: center; margin-bottom: 20px; border-bottom: 1px solid transparent; background: linear-gradient(to right, transparent 20%, #c6dafc 40%, #ff37ba 50%, #c6dafc 60%, transparent 80%); background-size: 100% 1px; background-repeat: no-repeat; background-position: bottom; }
        .header a { color: #95e6ff; text-decoration: none; margin: 0 20px; font-size: 21px; transition: all 0.3s ease; }
        .header a:hover { transform: scale(1.1); text-shadow: 0 0 10px #ffffff; }
        .main { background-color: rgba(255, 255, 255, 0.05); border-radius: 15px; padding: 30px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); }
        #map { height: 300px; width: 100%; margin-bottom: 20px; border-radius: 10px; overflow: hidden; }
        .result-container { background-color: rgba(255, 255, 255, 0.1); border-radius: 10px; padding: 20px; margin-bottom: 20px; }
        .result-item { margin-bottom: 15px; display: flex; justify-content: space-between; align-items: center; }
        .result-label { font-weight: bold; color: #1df926; flex: 1; }
        .result-value { color: #95e6ff; flex: 2; text-align: right; }
        .leaflet-control-attribution { display: none; }