@font-face {
    font-family: 'Arimon';
    font-display: swap;
    src: local('Arimon'),url('./fonts/arimonnew.woff2')format("woff2");
}
:root{--bg: #ffffff;--fg: #16181d;--muted: #6b7280;--line: #e3e6eb;--panel: rgba(255, 255, 255, .94);--shadow: 0 2px 8px rgba(15, 20, 30, .12), 0 8px 28px rgba(15, 20, 30, .1);--accent: #0f766e;--hunted: #0d9488;--radius: 5px;--topbar-h: 52px}
@media(prefers-color-scheme:dark){
	:root:not([data-theme=light]){--bg: #14161a;--fg: #e8eaee;--muted: #9aa1ad;--line: #2a2f38;--panel: rgba(20, 22, 26, .94);--shadow: 0 2px 8px rgba(0, 0, 0, .45), 0 8px 28px rgba(0, 0, 0, .35);--accent: #2dd4bf;--hunted: #14b8a6}
}
:root[data-theme=dark]{--bg: #14161a;--fg: #e8eaee;--muted: #9aa1ad;--line: #2a2f38;--panel: rgba(20, 22, 26, .94);--shadow: 0 2px 8px rgba(0, 0, 0, .45), 0 8px 28px rgba(0, 0, 0, .35);--accent: #2dd4bf;--hunted: #14b8a6}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;height:100%;font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--fg);background:var(--bg);overscroll-behavior:none}
#map{position:absolute;inset:var(--topbar-h) 0 0 0;background:#f7f5f2}
:root[data-theme=dark] #map{background:#1b1d21}
@media(prefers-color-scheme:dark){
	:root:not([data-theme=light]) #map{background:#1b1d21}
}
#topbar{position:absolute;inset:0 0 auto;height:var(--topbar-h);display:flex;align-items:center;gap:10px;padding:0 12px;background:var(--panel);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);z-index:20}
#topbar h1{margin:0;font-size:15px;font-weight:650;letter-spacing:.01em;white-space:nowrap}
.icon-btn{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--line);border-radius:5px;background:transparent;color:var(--fg);cursor:pointer}
.icon-btn:hover{border-color:var(--accent);color:var(--accent)}
#search-wrap{position:relative;flex:1;max-width:380px}
#search{width:100%;height:34px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--fg);font:inherit}
#search:focus{outline:2px solid var(--accent);outline-offset:-1px}
#results{position:absolute;top:38px;left:0;right:0;max-height:320px;overflow-y:auto;margin:0;padding:4px;list-style:none;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);z-index:30}
#results li{padding:6px 8px;border-radius:6px;cursor:pointer;display:flex;gap:8px;align-items:baseline}
#results li:hover,#results li[aria-selected=true]{background:color-mix(in srgb,var(--accent) 14%,transparent)}
#results b{font-variant-numeric:tabular-nums;color:var(--accent)}
#results span{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#status{margin-left:auto;font-size:12px;color:var(--muted);white-space:nowrap}
#panel{position:absolute;top:10px);right:10px;width:268px;max-height:calc(100% - var(--topbar-h) - 20px);max-height:calc(100dvh - var(--topbar-h) - 20px);overflow-y:auto;overscroll-behavior:contain;padding:4px 14px 12px;background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);z-index:15}
#panel section{padding:10px 0;border-bottom:1px solid var(--line)}
#panel section:last-of-type{border-bottom:0}
#menu-hint{position:absolute;top:calc(var(--topbar-h) + 12px);left:12px;z-index:16;padding:7px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--fg);font:inherit;font-size:12.5px;box-shadow:var(--shadow);cursor:pointer;animation:hinweis-auf .35s ease-out}
#menu-hint:before{content:"";position:absolute;top:-5px;left:12px;width:9px;height:9px;background:var(--panel);border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
@keyframes hinweis-auf{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
	#menu-hint{animation:none}
}
.tabs{position:sticky;top:0;z-index:2;display:flex;gap:2px;margin:0 -14px 2px;padding:6px 10px 0;background:var(--panel);border-bottom:1px solid var(--line)}
.tabs button{flex:1;padding:7px 2px 8px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.tabs button:hover{color:var(--fg)}
.tabs button[aria-selected=true]{color:var(--accent);border-bottom-color:var(--accent)}
.seghead{margin:8px 0 4px;font-size:12px;color:var(--muted)}
.seghead:first-of-type{margin-top:0}
#tab-spots .spotlist{max-height:none;overflow:visible}
#panel h2{margin:0 0 8px;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.seg{display:flex;gap:4px}
.seg button{flex:1;padding:6px 4px;border:1px solid var(--line);border-radius:7px;background:transparent;color:var(--fg);font:inherit;font-size:12px;cursor:pointer}
.seg button.on{background:var(--accent);border-color:var(--accent);color:#fff}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:2px 8px}
.check,.checks label{display:flex;align-items:center;gap:7px;padding:3px 0;cursor:pointer;font-size:13px}
.check input,.checks input{accent-color:var(--accent);width:15px;height:15px}
.callrow{display:flex;gap:6px}
.callrow input[type=text]{flex:1;height:32px;padding:0 8px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--fg);font:inherit;text-transform:uppercase}
.callrow input[type=color]{width:34px;height:32px;padding:2px;border:1px solid var(--line);border-radius:7px;background:var(--bg);cursor:pointer}
.hint{margin:6px 0 0;font-size:12px;color:var(--muted)}
.wide-btn{width:100%;padding:7px 8px;border:1px solid var(--accent);border-radius:7px;background:transparent;color:var(--accent);font:inherit;font-size:13px;cursor:pointer}
.wide-btn:hover{background:color-mix(in srgb,var(--accent) 12%,transparent)}
.wide-btn:disabled{opacity:.6;cursor:default}
.legend{margin:0;padding:0;list-style:none;display:grid;gap:5px;font-size:13px}
.legend li{display:flex;align-items:center;gap:8px}
.sw{width:16px;height:12px;border-radius:3px;border:1.5px solid var(--c);background:color-mix(in srgb,var(--c) 32%,transparent);flex:none}
.sw.dot{width:12px;height:12px;border-radius:50%;background:var(--c)}
.sw.line{height:0;border:0;border-top:3px solid var(--c);border-radius:0;background:none}
.spotlist{max-height:220px;overflow-y:auto;margin:-2px -4px 0}
.spotlist .hint{margin:0;padding:0 4px}
.spotlist button{display:block;width:100%;text-align:left;padding:5px 6px;border:0;border-radius:6px;background:transparent;color:var(--fg);font:inherit;font-size:12.5px;cursor:pointer}
.spotlist button:hover{background:color-mix(in srgb,var(--accent) 14%,transparent)}
.spotlist b{color:var(--accent)}
.spotlist span{color:var(--muted)}
.spotlist .spot{display:flex;align-items:stretch;gap:2px}
.spotlist .spot .jump{flex:1}
.spotlist .spot .mark{flex:none;width:26px;border:0;border-radius:6px;background:transparent;color:var(--muted);font:inherit;cursor:pointer}
.spotlist .spot .mark:hover{background:color-mix(in srgb,var(--hunted) 22%,transparent)}
.spotlist .spot.is-hunted .mark{color:var(--hunted)}
.spotlist .spot.is-hunted .jump{opacity:.65}
.spotlist .band{font-style:normal;font-size:11px;padding:0 4px;border-radius:4px;background:color-mix(in srgb,var(--fg) 10%,transparent);color:var(--muted)}
.filterrow{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.filterrow select{flex:1 1 30%;min-width:86px;padding:4px 6px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--fg);font:inherit;font-size:12px}
.filterrow .check{flex:1 1 100%;font-size:12px}
.counter{font-weight:400;font-size:12px;color:var(--muted)}
.filebtn{display:block;text-align:center}
.track-dot{width:16px;height:16px;border-radius:50%;background:#2563eb;border:3px solid #fff;box-shadow:0 0 0 2px #2563eb59}
#track-recenter{position:absolute;left:50%;bottom:26px;transform:translate(-50%);padding:7px 14px;border:1px solid var(--accent);border-radius:999px;background:var(--panel);color:var(--accent);font:inherit;font-size:13px;box-shadow:var(--shadow);cursor:pointer;z-index:15}
.pop .nfer:empty{display:none}
.pop .muted{color:var(--muted)}
.pop .parkinfo{margin:4px 0 6px;font-size:12px;line-height:1.5;color:var(--muted)}
.pop .parkinfo a{color:var(--accent)}
#position-box{position:absolute;left:50%;top:calc(var(--topbar-h));transform:translate(-50%);max-width:min(560px,calc(100% - 24px));padding:8px 14px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);border-right:3px solid var(--accent);border-radius:8px;box-shadow:var(--shadow);font-size:13px;z-index:14}
#position-box b{color:var(--accent)}
#position-box .edge-info{color:var(--muted)}
#credits{padding-top:10px;border-top:1px solid var(--line);font-size:11px;line-height:1.45;color:var(--muted)}
#credits summary{cursor:pointer;padding:3px 0}
#credits details[open] summary{margin-bottom:4px}
#credits p{margin:0 0 5px}
#credits a{color:inherit}
#readout{position:absolute;left:50%;top:12px;transform:translate(-50%);box-shadow: var(--shadow);display:flex;padding:6px 8px 4px;background:var(--panel);border:1px solid var(--line);border-radius:5px;font:14px Arimon;color:var(--muted);pointer-events:none;z-index:12}
#grid{font-weight:650;color:var(--fg)}
#hoverinfo{position:absolute;left:50%;bottom:12px;transform:translate(-50%);max-width:min(620px,calc(100% - 24px));padding:7px 12px;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);font-size:13px;pointer-events:none;z-index:12}
#hoverinfo div+div{margin-top:3px}
#hoverinfo b{color:var(--accent);font-variant-numeric:tabular-nums}
.maplibregl-ctrl-scale{font-size: 12px}
.maplibregl-ctrl-attrib a {color:inherit;text-decoration:underline;text-underline-offset:2px}
.maplibregl-popup{max-width:calc(100vw - 16px)!important}
.maplibregl-popup-content{padding:11px 13px;border-radius:var(--radius);background:var(--panel);color:var(--fg);box-shadow:var(--shadow);font:inherit;max-height:min(60vh,480px);overflow-y:auto;overscroll-behavior:contain}
.maplibregl-popup-close-button{font-size:17px;color:var(--muted);padding:2px 7px}
.maplibregl-popup-tip{border-top-color:var(--panel)!important;border-bottom-color:var(--panel)!important}
.pop h3{margin:0 0 4px;font-size:14px}
.pop .ref{color:var(--accent);font-variant-numeric:tabular-nums}
.pop .meta{color:var(--muted);font-size:12px;margin:4px 0 0}
.pop .acts{margin:6px 0 0;font-size:12px}
.pop nav{display:flex;gap:10px;margin-top:8px;font-size:12px}
.pop nav a{color:var(--accent)}
#topbar .afu-menu{margin-left:8px}
@media(max-width:720px){
	#panel{left:8px;right:8px;width:auto}
	#topbar h1,
	#topbar .afu-menu{margin-left:4px},
	#status{display:none},
}