/* flurnamen — app-spezifisch, weltsein-Tokens */
/* [hidden] muss gewinnen — sonst überschreibt display:flex/… das Verstecken
   (Overlays/Dialog lägen sichtbar über der Suche und fingen alle Klicks ab). */
[hidden] { display: none !important; }

main { max-width: 1000px; }

.searchbar { display: flex; gap: .5rem; flex-wrap: wrap; margin: 1.2rem 0 .3rem; }
.searchbar input[type=search], .searchbar select {
  font-family: 'JetBrains Mono', monospace; font-size: .85rem;
  padding: .55rem .7rem; border: 1px solid var(--border); border-radius: 4px;
  background: var(--bg); color: var(--text);
}
#q { flex: 2 1 240px; }
#ort { flex: 1 1 160px; }
#kreis { flex: 1 1 150px; }
.chk { display: inline-flex; align-items: center; gap: .35rem; font-family:'JetBrains Mono',monospace; font-size: .8rem; color: var(--text-muted); white-space: nowrap; }
.modehint { font-family:'JetBrains Mono',monospace; font-size: .7rem; color: var(--text-muted); min-height: 1rem; margin-bottom: .6rem; }

.resultbar { display: flex; align-items: center; gap: .6rem; margin: .8rem 0 .4rem; font-family:'JetBrains Mono',monospace; font-size: .8rem; }
.resultbar .spacer, .overlay-bar .spacer, .searchbar .spacer { flex: 1; }
#count { color: var(--text-muted); }

.rtable { width: 100%; border-collapse: collapse; font-size: .88rem; }
.rtable th { text-align: left; font-family:'JetBrains Mono',monospace; font-size: .72rem; font-weight: 400;
  text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted);
  border-bottom: 1px solid var(--border); padding: .4rem .5rem; cursor: pointer; user-select: none; }
.rtable th.cm, .rtable td.cm { width: 1.6rem; cursor: default; padding-left: .2rem; }
.rtable th.cn, .rtable td.cn { text-align: right; width: 3.2rem; color: var(--text-muted); }
.rtable td { padding: .4rem .5rem; border-bottom: 1px solid var(--border); }
.rtable tbody tr { cursor: pointer; }
.rtable tbody tr:hover { background: var(--bg-secondary); }
.rtable td.fn { color: var(--brand); font-weight: 600; }
.rtable tr.marked { background: color-mix(in srgb, var(--brand) 10%, transparent); }

.more, .empty { margin: 1rem 0; text-align: center; }
.empty { color: var(--text-muted); font-family:'JetBrains Mono',monospace; font-size: .85rem; }

/* Auswertung */
.statline { font-family:'JetBrains Mono',monospace; font-size: .82rem; color: var(--text-muted); margin: 1.2rem 0 .5rem; }
.statline b { color: var(--brand); }
.agrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.4rem 2rem; }
.acol h3 { font-family:'JetBrains Mono',monospace; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); border-bottom: 1px solid var(--border); padding-bottom: .3rem; margin: 0 0 .5rem; }
.ranklist { list-style: none; margin: 0; padding: 0; }
.ranklist li { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .5rem;
  font-size: .84rem; padding: .18rem 0; cursor: pointer; position: relative; }
.ranklist li .bar { position: absolute; left: 0; bottom: 1px; height: 2px; background: var(--brand); opacity: .5; }
.ranklist li:hover .lbl { color: var(--brand); }
.ranklist .num { font-family:'JetBrains Mono',monospace; font-size: .72rem; color: var(--text-muted); }

/* Mini-Popup-Karte */
.pop { position: fixed; z-index: 1200; width: 340px; max-width: 92vw; background: var(--bg);
  border: 1px solid var(--border); border-radius: 6px; box-shadow: 0 6px 24px rgba(0,0,0,.18); overflow: hidden; }
.pop-head { display: flex; align-items: center; gap: .5rem; padding: .4rem .6rem; border-bottom: 1px solid var(--border);
  font-family:'JetBrains Mono',monospace; font-size: .78rem; }
.pop-head span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--brand); }
.pop-head button, .pop-foot { background: none; }
.pop-head button { border: none; font-size: 1.1rem; color: var(--text-muted); cursor: pointer; line-height: 1; }
.pop-map { height: 220px; }
.pop-foot { padding: .4rem .6rem; border-top: 1px solid var(--border); text-align: right; }

/* Overlays */
.overlay { position: fixed; inset: 0; z-index: 1100; background: var(--bg); display: flex; flex-direction: column; }
.overlay.center { background: rgba(0,0,0,.4); align-items: center; justify-content: center; }
.overlay-bar { display: flex; align-items: center; gap: .6rem; padding: .6rem 1rem; border-bottom: 1px solid var(--border);
  font-family:'JetBrains Mono',monospace; font-size: .85rem; }
.big-map { flex: 1; }

.dlg { background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 1.2rem 1.4rem; width: 360px; max-width: 92vw; }
.dlg h3 { font-family:'JetBrains Mono',monospace; font-size: .9rem; margin: 0 0 .8rem; }
.dlg-body { display: flex; flex-direction: column; gap: .5rem; font-size: .88rem; }
.dlg-body label { display: flex; align-items: center; gap: .5rem; cursor: pointer; }
.dlg-foot { display: flex; justify-content: flex-end; gap: .6rem; margin-top: 1.2rem; }

/* Karte: Grundkarte schwarzweiß, Polygone weltsein-grün */
.leaflet-tile-pane { filter: grayscale(1) contrast(1.02) brightness(1.02); }
html.dark .leaflet-tile-pane { filter: grayscale(1) invert(1) hue-rotate(180deg) brightness(.95) contrast(.95); }
.leaflet-container { background: var(--bg-secondary); font-family: 'Inter', sans-serif; }
.leaflet-popup-content { font-family: 'JetBrains Mono', monospace; font-size: .75rem; }

.btn { font-family:'JetBrains Mono',monospace; cursor: pointer; }
@media (max-width: 640px) {
  .pop { left: 50% !important; top: 50% !important; transform: translate(-50%, -50%); width: 92vw; }
  .rtable td.km, .rtable th:nth-child(4) { display: none; }
}
