.gpx-viewer{margin:16px 0;border:1px solid #435648;border-radius:12px;overflow:hidden;background:#15251c;color:#edf4e9;font:14px/1.5 system-ui,sans-serif;max-width:100%;min-width:0}
.gpx-viewer *{box-sizing:border-box}.gpx-heading{display:flex;gap:8px 20px;justify-content:space-between;flex-wrap:wrap;padding:12px 14px}.gpx-heading span{font-size:12px;color:#c2d0bd}.gpx-canvas{height:360px;position:relative;overflow:hidden;background:#1c3025;touch-action:none;cursor:grab}.gpx-canvas:focus-visible{outline:3px solid #c9ff68;outline-offset:-3px}.gpx-canvas:active{cursor:grabbing}.gpx-geography,.gpx-map,.gpx-tiles{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}.gpx-geography,.gpx-map{pointer-events:none}.gpx-tiles img{position:absolute;max-width:none!important;margin:0!important;border:0!important;opacity:1!important}.gpx-tools{position:absolute;left:10px;top:10px;display:flex;gap:5px}.gpx-tools button,.gpx-basemap button{font:inherit;cursor:pointer;color:#edf4e9;background:#14271f;border:1px solid #68826c;border-radius:6px;min-height:44px;min-width:44px;padding:5px 10px}.gpx-tools button:hover,.gpx-basemap button:hover{border-color:#c9ff68}.gpx-overview{position:absolute;bottom:10px;right:10px;width:132px;height:74px;border:1px solid #799274;border-radius:5px;background:#112218;pointer-events:none}.gpx-coordinates,.gpx-note,.gpx-message{margin:8px 14px!important;font-size:12px;overflow-wrap:anywhere}.gpx-message:empty{display:none}.gpx-basemap{display:flex;align-items:center;gap:10px;padding:4px 14px;flex-wrap:wrap}.gpx-basemap span{flex:1;min-width:150px;font-size:12px;color:#c2d0bd}.gpx-viewer a{color:#d0f5af!important}.gpx-basemap button:disabled{opacity:.6;cursor:default}.gpx-viewer [role=alert]{padding:12px;color:#fff}.gpx-note{color:#c2d0bd}@media(max-width:600px){.gpx-canvas{height:300px}.gpx-overview{width:108px;height:60px}.gpx-heading{gap:4px}.gpx-heading span{width:100%}}

.gpx-legend{display:flex;gap:8px 16px;flex-wrap:wrap;padding:0 14px 12px}.gpx-legend label{display:flex!important;flex-direction:row!important;align-items:center;gap:7px;min-height:44px;font-size:12px!important;margin:0!important;overflow-wrap:anywhere;max-width:100%}.gpx-legend input{width:18px!important;height:18px!important;min-height:18px!important;flex:0 0 18px;accent-color:#c9ff68}.gpx-legend span{width:18px;height:4px;flex:0 0 18px}

.gpx-basemap [hidden]{display:none!important}.gpx-layer-label{display:flex;gap:8px;align-items:center;font-size:14px}.gpx-layer-label select{font:inherit;border:1px solid #68826c;background:#14271f;color:#edf4e9;border-radius:6px;padding:8px;min-height:44px;max-width:100%}
.gpx-viewer-expanded{margin:8px 0}.gpx-viewer-expanded .gpx-canvas{height:calc(100dvh - 250px);min-height:360px}.gpx-viewer-expanded .gpx-coordinates{display:none}.gpx-viewer-expanded .gpx-note{font-size:11px}.gpx-viewer-expanded .gpx-legend{padding-bottom:4px}.gpx-viewer-expanded .gpx-heading{padding-top:8px;padding-bottom:4px}
@media(max-width:600px){.gpx-viewer-expanded .gpx-canvas{height:calc(100dvh - 315px);min-height:360px}.gpx-viewer-expanded .gpx-basemap{gap:4px 10px}.gpx-layer-label{width:100%}.gpx-layer-label select{flex:1}.gpx-viewer-expanded .gpx-basemap span{min-width:0;width:100%;flex:auto}}

.gpx-scale{position:absolute;bottom:15px;left:14px;min-width:15px;max-width:120px;border:2px solid #edf4e9;border-top:0;color:#fff;text-shadow:0 1px 3px #000;font:11px/1.6 system-ui;text-align:center;background:#102317b3;pointer-events:none}