.app{height:100vh;height:100svh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.app-map{flex:1;min-height:0;position:relative}.app-map .karte-container,.app-map .leaflet-container{height:100%;width:100%}.karte-controls{position:absolute;top:20px;left:50%;transform:translate(-50%);width:max-content;z-index:1100;display:flex;align-items:center;gap:8px}.karte-toggle-btn{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;background-color:var(--bg-panel);border:1.5px solid var(--border-color);border-radius:var(--rp-radius-pill);box-shadow:var(--rp-shadow-overlay);font-family:var(--rp-font-sans);font-size:var(--rp-text-40);font-weight:var(--rp-weight-semi);color:var(--text-primary);cursor:pointer;transition:background-color var(--rp-transition-fast),border-color var(--rp-transition-fast),opacity var(--rp-transition-fast);white-space:nowrap;min-height:36px}.karte-toggle-btn:hover{background-color:var(--bg-panel-subtle)}.karte-toggle-btn.inaktiv{opacity:.45}.karte-toggle-btn__dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.karte-toggle-btn__dist{font-size:var(--rp-text-30);font-weight:var(--rp-weight-normal);color:var(--text-muted)}.karte-toggle-btn--km{gap:6px}.karte-zoom-toggle{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%);z-index:1250;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:8px 16px;border-radius:var(--rp-radius-pill);border:1.5px solid var(--border-color);background-color:var(--bg-panel);color:var(--text-primary);font-family:var(--rp-font-sans);font-size:var(--rp-text-40);font-weight:var(--rp-weight-semi);text-transform:none;letter-spacing:0;box-shadow:var(--rp-shadow-overlay);cursor:pointer;opacity:1;visibility:visible;pointer-events:auto;transition:background-color var(--rp-transition-fast),border-color var(--rp-transition-fast),color var(--rp-transition-fast)}.karte-zoom-toggle svg{flex-shrink:0}.karte-zoom-toggle--aktiv{background-color:var(--rp-primary);border-color:var(--rp-primary);color:var(--rp-black)}.karte-zoom-toggle:not(.karte-zoom-toggle--aktiv){color:var(--text-muted)}.karte-container{width:100%;height:100%;overflow:hidden;position:relative}.strecken-panel{position:absolute;top:0;right:0;z-index:1200;width:clamp(320px,32vw,400px);max-width:100%;height:100%;background-color:var(--bg-panel);box-shadow:var(--rp-shadow-panel);display:flex;flex-direction:column;min-height:0;overflow:hidden;transform:translate(100%);transition:transform var(--rp-transition-slow)}.strecken-panel--offen{transform:translate(0)}@media (max-width: 639px){.strecken-panel{inset:auto 0 0;width:100%;height:calc(100dvh - max(12px,env(safe-area-inset-top)));max-height:calc(100dvh - max(12px,env(safe-area-inset-top)));border-radius:var(--rp-radius-md) var(--rp-radius-md) 0 0;box-shadow:var(--rp-shadow-sheet);transform:translateY(100%)}.strecken-panel--offen{transform:translateY(0)}}.strecken-panel__handle{display:none;width:36px;height:4px;background-color:var(--rp-black-subtle);border-radius:var(--rp-radius-pill);margin:12px auto 0;flex-shrink:0}@media (max-width: 639px){.strecken-panel__handle{display:block}}.strecken-panel__close{position:absolute;top:12px;right:12px;z-index:10;width:36px;height:36px;border-radius:var(--rp-radius-pill);border:none;cursor:pointer;background-color:var(--rp-black-slightest);color:var(--rp-black-muted);font-size:1.1rem;line-height:1;display:flex;align-items:center;justify-content:center;transition:background-color var(--rp-transition-fast),color var(--rp-transition-fast)}.strecken-panel__close:hover{background-color:var(--rp-black-subtle);color:var(--rp-black)}.strecken-panel__body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:48px 20px 28px;scrollbar-width:thin;scrollbar-color:var(--rp-black-subtle) transparent}.strecken-panel__body::-webkit-scrollbar{width:4px}.strecken-panel__body::-webkit-scrollbar-track{background:transparent}.strecken-panel__body::-webkit-scrollbar-thumb{background-color:var(--rp-black-subtle);border-radius:var(--rp-radius-pill)}@media (max-width: 639px){.strecken-panel__body{padding:16px 16px calc(40px + env(safe-area-inset-bottom))}}.strecken-panel__badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:var(--rp-radius-pill);font-size:var(--rp-text-30);font-weight:var(--rp-weight-semi);text-transform:uppercase;letter-spacing:var(--rp-tracking-sans);color:var(--rp-white);margin-bottom:10px}.strecken-panel__name{font-family:var(--rp-font-sans);font-size:var(--rp-text-90);font-weight:var(--rp-weight-bold);color:var(--text-primary);line-height:var(--rp-leading-tight);margin:0 0 4px;padding-right:36px}.strecken-panel__distanz{font-family:var(--rp-font-sans);font-size:var(--rp-text-70);font-weight:var(--rp-weight-semi);line-height:var(--rp-leading-tight);margin:0 0 16px}.strecken-panel__divider{border:none;border-top:1px solid var(--rp-black-slight);margin:0 0 16px}.strecken-panel__beschreibung{font-family:var(--rp-font-serif);font-size:var(--rp-text-45);color:var(--text-primary);line-height:var(--rp-leading-serif);margin:0 0 20px}.km-liste{display:flex;flex-direction:column;gap:0}.km-liste__titel{font-family:var(--rp-font-sans);font-size:var(--rp-text-30);font-weight:var(--rp-weight-semi);text-transform:uppercase;letter-spacing:var(--rp-tracking-sans);color:var(--text-muted);margin-bottom:8px}.km-liste__item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--rp-black-slightest);font-family:var(--rp-font-sans);font-size:var(--rp-text-40);color:var(--text-primary)}.km-liste__item:last-child{border-bottom:none}.km-liste__punkt{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--rp-text-30);font-weight:var(--rp-weight-bold);color:var(--rp-white);flex-shrink:0}.km-liste__label{font-weight:var(--rp-weight-semi);min-width:40px}.km-liste__ort{color:var(--text-muted);font-size:var(--rp-text-30)}.karte-legende{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));right:max(12px,env(safe-area-inset-right));z-index:900;background-color:var(--bg-panel);border-radius:var(--rp-radius-sm);box-shadow:var(--rp-shadow-overlay);overflow:hidden;font-family:var(--rp-font-sans);min-width:160px;max-width:min(220px,calc(100vw - 24px))}.karte-legende__toggle{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;padding:10px 12px;background:none;border:none;cursor:pointer;text-align:left;border-bottom:2px solid var(--rp-primary);transition:background-color var(--rp-transition-fast)}.karte-legende__toggle:hover{background-color:var(--rp-black-slightest)}.karte-legende__titel{font-size:var(--rp-text-30);font-weight:var(--rp-weight-semi);text-transform:uppercase;letter-spacing:var(--rp-tracking-sans);color:var(--rp-black-muted);line-height:1}.karte-legende__pfeil{font-size:.65rem;color:var(--rp-black-muted);line-height:1;flex-shrink:0;transition:transform var(--rp-transition-fast)}.karte-legende__pfeil--offen{transform:rotate(180deg)}.karte-legende__liste{list-style:none;margin:0;padding:8px 12px 10px;display:flex;flex-direction:column;gap:6px}.karte-legende__eintrag{display:flex;align-items:center;gap:8px;line-height:1}.karte-legende__linie{width:18px;height:4px;border-radius:var(--rp-radius-pill);flex-shrink:0}.karte-legende__pin{width:14px;height:14px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:700;color:#fff}.karte-legende__label{font-size:var(--rp-text-40);color:var(--text-primary);line-height:var(--rp-leading-tight)}.leaflet-bottom.leaflet-left .leaflet-control-zoom{margin-left:max(12px,env(safe-area-inset-left));margin-bottom:max(16px,env(safe-area-inset-bottom))}@media (max-width: 639px){.karte-zoom-toggle{bottom:max(18px,calc(env(safe-area-inset-bottom) + 6px));min-height:32px;padding:6px 10px;gap:6px;font-size:var(--rp-text-30);letter-spacing:0}.karte-zoom-toggle svg{width:12px;height:12px}.karte-legende{display:none}.karte-controls{top:56px;flex-wrap:nowrap;justify-content:flex-start;width:calc(100% - 24px);left:12px;transform:none;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none}.karte-controls::-webkit-scrollbar{display:none}.karte-toggle-btn{flex-shrink:0;min-height:32px;padding:6px 10px;gap:6px;font-size:var(--rp-text-30)}.karte-toggle-btn__dot{width:8px;height:8px}.karte-toggle-btn__dist{font-size:.68rem}.karte-header-badge{top:10px}.leaflet-bottom.leaflet-left .leaflet-control-zoom{display:none}}@media (prefers-color-scheme: dark){.strecken-panel__close{background-color:var(--bg-panel-subtle);color:var(--text-muted)}.strecken-panel__close:hover{background-color:#3a424a;color:var(--text-primary)}.strecken-panel__divider{border-top-color:var(--border-color)}.strecken-panel__handle{background-color:var(--border-color)}.km-liste__item{border-bottom-color:var(--bg-panel-subtle)}.karte-legende{border:1px solid var(--border-color)}.karte-legende__toggle:hover{background-color:var(--bg-panel-subtle)}.karte-legende__titel,.karte-legende__pfeil{color:var(--text-muted)}.karte-legende__label{color:var(--text-primary)}.karte-toggle-btn{background-color:var(--bg-panel);border-color:var(--border-color);color:var(--text-primary)}.karte-toggle-btn:hover{background-color:var(--bg-panel-subtle)}.karte-zoom-toggle{background-color:var(--bg-panel);border-color:var(--border-color);color:var(--text-muted)}.karte-zoom-toggle--aktiv{background-color:var(--rp-primary);border-color:var(--rp-primary);color:var(--rp-black)}}:root{--rp-primary: #ffcd00;--rp-black: #040a14;--rp-black-muted: #696c71;--rp-black-subtle: #d7d8d9;--rp-black-slight: #ebeced;--rp-black-slightest: #f5f5f6;--rp-white: #ffffff;--rp-font-sans: Inter, system-ui, sans-serif;--rp-font-serif: Georgia, serif;--rp-text-30: .75rem;--rp-text-40: .875rem;--rp-text-45: .938rem;--rp-text-50: 1rem;--rp-text-60: 1.125rem;--rp-text-70: 1.25rem;--rp-text-80: 1.375rem;--rp-text-90: 1.75rem;--rp-leading-tight: 1.25;--rp-leading-md: 1.5;--rp-leading-serif: 1.8;--rp-weight-normal: 400;--rp-weight-semi: 600;--rp-weight-bold: 700;--rp-tracking-sans: .063em;--rp-space-3: .75rem;--rp-space-4: 1rem;--rp-space-5: 1.25rem;--rp-space-6: 1.5rem;--rp-space-8: 2rem;--rp-radius-xs: .25rem;--rp-radius-sm: .5rem;--rp-radius-md: 1rem;--rp-radius-pill: 9999px;--rp-shadow-overlay: 1px 1px 8px rgba(0,0,0,.16), 1px 1px 16px rgba(0,0,0,.08);--rp-shadow-panel: -4px 0 20px rgba(4,10,20,.12);--rp-shadow-sheet: 0 -4px 20px rgba(4,10,20,.12);--rp-transition-fast: .1s cubic-bezier(.4,0,.2,1);--rp-transition: .2s cubic-bezier(.4,0,.2,1);--rp-transition-slow: .25s ease-in-out;--route-marathon: #CC0033;--route-half: #0057A8;--marker-start: #00A651;color-scheme:light dark;--bg-page: #f6f6f4;--bg-karte: #f0f1ed;--bg-panel: #ffffff;--bg-panel-subtle: #f3f4f0;--text-primary: #111111;--text-muted: #5a5f63;--border-color: rgba(0,0,0,.16)}@media (prefers-color-scheme: dark){:root{--bg-page: #111111;--bg-karte: #1a1d20;--bg-panel: #1f2327;--bg-panel-subtle: #2a3036;--text-primary: #f3f5f7;--text-muted: #b8bec5;--border-color: rgba(255,255,255,.2)}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{font-family:var(--rp-font-sans);font-size:var(--rp-text-50);line-height:var(--rp-leading-md);color:var(--text-primary);background-color:var(--bg-page);-webkit-font-smoothing:antialiased;overflow:hidden}a{color:inherit}.leaflet-container{font-family:var(--rp-font-sans)!important;background-color:var(--bg-karte)!important}.leaflet-container:focus{outline:none}.leaflet-container:focus-visible{outline:2px solid var(--rp-primary);outline-offset:2px}.leaflet-control-zoom{border:1px solid var(--rp-black-subtle)!important;border-radius:var(--rp-radius-sm)!important;box-shadow:var(--rp-shadow-overlay)!important;overflow:hidden}.leaflet-control-zoom a{background-color:var(--rp-white)!important;color:var(--rp-black)!important;font-family:var(--rp-font-sans)!important;border-bottom:1px solid var(--rp-black-subtle)!important;transition:background-color var(--rp-transition-fast)!important}.leaflet-control-zoom a:hover{background-color:var(--rp-black-slightest)!important}.leaflet-control-zoom-out{border-bottom:none!important}@media (prefers-color-scheme: dark){.leaflet-control-zoom a{background-color:var(--bg-panel)!important;color:var(--text-primary)!important;border-bottom-color:var(--border-color)!important}.leaflet-control-zoom a:hover{background-color:var(--bg-panel-subtle)!important}.leaflet-control-zoom{border-color:var(--border-color)!important}}