/* Erscheinungsbild nach dem Vorbild des bisherigen Programms: Salbeigrün, Oliv-Kopfzeilen, orange Auswahl, rote Linie */
:root{
  --bg:#E0E7D3;--panel:#D6DFC8;--nav:#BDCE97;--bar:#C1D19D;--navhead:#EDF1E4;--olive:#7B9651;--olive2:#66803F;
  --orange:#FFA03D;--orange2:#F28C1C;--redline:#E40500;--red:#D30801;--blue:#1B4FC4;--grn:#118401;--grn2:#008000;
  --card:#fff;--tx:#1d2a16;--mu:#56654a;--ln:#A3A99B;--ln2:#BFCBA9;--band:#FEFFDF;
  --g:#66803F;--g2:#7B9651;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;margin:0}
body{font:15px Tahoma,Verdana,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--tx);display:flex;flex-direction:column;overscroll-behavior:none}
/* Kopf: Symbolleiste + Reviername, rote Linie darunter */
header{background:linear-gradient(#D4E0B4,var(--bar));color:#12310b;padding:calc(6px + env(safe-area-inset-top)) 12px 6px;display:flex;align-items:baseline;gap:10px;border-bottom:3px solid var(--redline);flex-wrap:wrap}
header h1{margin:0;font-size:18px;font-weight:700;color:#15400c}
#sub{font-size:14px;color:#000}#sub b{color:#f00;font-weight:700}
main{flex:1;position:relative;overflow:hidden}
.tab{display:none;position:absolute;inset:0;overflow:auto;padding:10px}
.tab.active{display:block}
#tab-karte{padding:0}#map{position:absolute;inset:0}
.fab{position:absolute;z-index:500;right:12px;bottom:80px;width:46px;height:46px;border-radius:50%;border:1px solid var(--olive2);background:linear-gradient(#A9C27A,var(--olive));color:#fff;font-size:22px;box-shadow:0 2px 6px #0005}
.fab2{bottom:138px;background:linear-gradient(#FFC066,var(--orange2));border-color:#C77310}
.hint{position:absolute;z-index:500;left:12px;right:70px;top:12px;background:var(--navhead);color:#12310b;padding:10px;border:1px solid var(--olive);border-radius:4px;box-shadow:0 2px 6px #0004}
/* Navigation unten: wie die Navigationsleiste links im Vorbild, Auswahl in Orange */
nav{display:flex;background:var(--nav);border-top:1px solid var(--olive);padding-bottom:env(safe-area-inset-bottom)}
nav button{flex:1;border:0;border-right:1px solid #A8BA7F;background:linear-gradient(#CFDCAE,var(--nav));padding:6px 0;font-size:19px;color:#005B00;display:flex;flex-direction:column;align-items:center;position:relative}
nav button:last-child{border-right:0}
nav button span{font-size:11px;font-weight:700}
nav button.on{background:linear-gradient(#FFC98A,var(--orange));color:#2a1700}
/* Gruppenfelder (Karten) */
.card{background:var(--panel);border:1px solid var(--ln2);border-radius:3px;padding:10px;margin-bottom:10px}
.card h3{margin:0 0 4px;font-size:15px;display:flex;justify-content:space-between;gap:8px;color:var(--blue)}
.muted{color:var(--mu);font-size:13.5px}
.pill{font-size:12px;font-weight:700;padding:1px 8px;border-radius:3px;background:var(--olive);color:#fff;white-space:nowrap}
.pill.red{background:var(--red)}
.bar{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
/* Schaltflächen im Stil der Symbolleisten */
.btn{background:linear-gradient(#A9C27A,var(--olive));color:#fff;border:1px solid var(--olive2);border-radius:3px;padding:7px 12px;font:700 14px Tahoma,Verdana,Arial,sans-serif;display:inline-block;text-decoration:none;text-shadow:0 1px 0 #0003;cursor:pointer}
.btn.sec{background:linear-gradient(#fff,#E3E8D7);color:#12310b;border:1px solid #8D9C74;text-shadow:none}
.btn.danger{background:linear-gradient(#fff,#F3DCD2);color:#B3261E;border-color:#C98C7C;text-shadow:none}
.btn:active{background:linear-gradient(var(--orange),#FFC98A);color:#2a1700;border-color:#C77310}
.btn[disabled]{opacity:.5}
.row{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
/* Symbole in den Schaltflächen (eigene Zeichnungen) */
.btn.ic-add::before,dialog .btn[value=ok]::before,dialog .btn[value=cancel]::before,.btn.danger::before{content:"";display:inline-block;width:15px;height:15px;margin-right:6px;vertical-align:-3px;background-repeat:no-repeat;background-size:contain}
.btn.ic-add::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7.5' fill='%2316a516' stroke='%23fff'/%3E%3Cpath d='M8 4v8M4 8h8' stroke='%23fff' stroke-width='2.2'/%3E%3C/svg%3E")}
dialog .btn[value=ok]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='1.5' width='13' height='13' rx='1.5' fill='%23fff' stroke='%23fff'/%3E%3Crect x='3' y='2.5' width='8' height='4' fill='%232f55b8'/%3E%3Crect x='4' y='9' width='8' height='4.5' fill='%2316a516'/%3E%3C/svg%3E")}
dialog .btn[value=cancel]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 3l10 10M13 3L3 13' stroke='%23d30801' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E")}
.btn.danger::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7.5' fill='%23f28c1c' stroke='%23fff'/%3E%3Cpath d='M4 8h8' stroke='%23fff' stroke-width='2.4'/%3E%3C/svg%3E")}
/* Überschriften wie „Revierangaben“: blau, fett */
h2{font-size:15px;margin:14px 0 6px;color:var(--blue);font-weight:700;border-bottom:1px solid var(--ln2);padding-bottom:2px}
/* Eingabefelder: weiß, eckig, fette Beschriftung; Pflichtfelder mit rotem Stern */
select,input,textarea{width:100%;padding:7px 8px;border:1px solid var(--ln);border-radius:2px;font:inherit;background:#fff;color:#000}
select:focus,input:focus,textarea:focus{outline:2px solid var(--orange);outline-offset:-1px}
label.f{display:block;margin:7px 0;font-size:13px;color:#2a3a20;font-weight:700;position:relative}
label.f:has(:required)::after{content:"*";position:absolute;right:2px;top:0;color:#f00;font-size:17px;line-height:1}
.chk{display:flex;gap:8px;align-items:center;margin:7px 0;font-size:14px;font-weight:700;color:#2a3a20}.chk input{width:auto}
[hidden]{display:none!important}
dialog{border:2px solid var(--olive);border-radius:4px;padding:0;width:min(94vw,460px);background:var(--bg);color:var(--tx);max-height:92vh;box-shadow:0 6px 24px #0008}
dialog::backdrop{background:#0007}
#dlgForm{padding:14px}
#dlgForm>h2:first-child{margin:-14px -14px 12px;padding:8px 14px;background:linear-gradient(#97B26A,var(--olive));color:#fff;border:0;font-size:15px}
dialog:not(#dlg){padding:12px}
dialog pre{white-space:pre-wrap;font:13px/1.4 inherit;margin:6px 0 0;color:var(--mu)}
/* Listen: Tabellenzeilen im Wechsel weiß/gelblich, grüne Schrift, Auswahl orange */
#killList .card,#seatList .card,#mList .card,#sightList .card{background:#fff;border:0;border-bottom:1px solid #E3E6D2;border-radius:0;margin:0;padding:7px 9px}
#killList .card:nth-child(even),#seatList .card:nth-child(even),#mList .card:nth-child(even),#sightList .card:nth-child(even){background:var(--band)}
#killList .card h3,#seatList .card h3,#mList .card h3,#sightList .card h3{color:var(--grn);font-size:14.5px;margin:0}
#killList .card.bad h3,#mList .card.bad h3{color:var(--red)}
#killList .card.plain h3{color:#111}
#killList .card:active,#seatList .card:active,#mList .card:active,#sightList .card:active,#chatList .chi:active{background:var(--orange)}
#killList,#seatList,#mList,#sightList{border:1px solid var(--ln);background:#fff}
.listhead{background:linear-gradient(#8DA763,var(--olive));color:#fff;font-weight:700;padding:5px 9px;font-size:13px;display:flex;justify-content:space-between}
/* Wildart-Reiter in der Strecke (wie im Schussbuch) mit roter Linie darunter */
.wtabs{display:flex;gap:2px;overflow-x:auto;border-bottom:3px solid var(--redline);margin-bottom:8px;padding-bottom:0;-webkit-overflow-scrolling:touch}
.wtabs button{flex:none;border:1px solid #8D9C74;border-bottom:0;border-radius:4px 4px 0 0;background:linear-gradient(#fff,#D9E1C6);padding:6px 10px;font:700 13px Tahoma,Verdana,Arial,sans-serif;color:#12310b;white-space:nowrap}
.wtabs button.on{background:linear-gradient(#FFC98A,var(--orange));color:#2a1700}
.bar.filter{flex-wrap:nowrap}.bar.filter select{width:auto;flex:1;min-width:0}.bar.filter input{flex:1.4;min-width:0}
/* Mehr: Navigationsliste wie links im Hauptmenü */
.tiles{display:flex;flex-direction:column;gap:5px;margin-bottom:6px}
.tile{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid #B4C29A;border-radius:6px;background:linear-gradient(#fff,#EDF1E4);color:#005B00;font:700 14px Tahoma,Verdana,Arial,sans-serif;text-align:left;width:100%}
.tile span{font-size:19px;width:26px;text-align:center}
.tile::after{content:"";margin-left:auto;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#8FB4F0,#2f55b8);box-shadow:0 0 0 1px #1d3c8a inset;flex:none;
  -webkit-mask:none}
.tile:active{background:linear-gradient(#FFC98A,var(--orange));color:#2a1700}
/* Modul-Ansicht (Vollbild) */
#mod{position:absolute;inset:0;z-index:600;display:flex;flex-direction:column;background:var(--bg)}
#mod .chh{padding:8px 10px}#mod .chh .btn{padding:5px 10px;font-size:13px}
#modBody{flex:1;overflow:auto;padding:10px}
.chh{display:flex;align-items:center;gap:10px;padding:6px 10px;background:linear-gradient(#D4E0B4,var(--bar));color:#12310b;border-bottom:3px solid var(--redline)}
.chh b{color:#15400c}
.chh button{background:none;border:0;color:#12310b;font-size:24px;padding:4px 6px}
.chh .mid{flex:1;min-width:0}.chh .sub{font-size:12px;opacity:.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kv{display:flex;justify-content:space-between;gap:12px;padding:4px 0;border-bottom:1px solid var(--ln2);font-size:14px}.kv>span:last-child{text-align:right}
.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
details{margin:6px 0}summary{cursor:pointer;padding:6px 0;font-weight:700;color:var(--blue)}
.neg{color:var(--red)}
.bar2{display:flex;align-items:center;gap:6px;margin:3px 0;font-size:13px}.bar2 span{width:34%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar2 i{display:block;height:10px;border-radius:2px;background:var(--olive)}.bar2 b{font-size:12px}
.cols{display:flex;align-items:flex-end;gap:3px;height:112px}.col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;font-size:10px;color:var(--mu)}.col i{display:block;width:100%;background:var(--olive);border-radius:2px 2px 0 0;min-height:1px}.col b{font-size:10px;color:var(--tx)}
a{color:#0046D5}
/* Tabellen: Oliv-Kopf mit weißer Schrift, Zeilenband */
.tbl{width:100%;border-collapse:collapse;font-size:13px;background:#fff}
.tbl th{background:linear-gradient(#8DA763,var(--olive));color:#fff;font-size:12px;padding:4px 6px;text-align:center;border:1px solid #6E8A45}
.tbl td{padding:4px 6px;border:1px solid #E0E4CF;text-align:center;color:var(--grn);font-weight:700}
.tbl tr:nth-child(even) td{background:var(--band)}
.tbl td:first-child,.tbl th:first-child{text-align:left}.tbl input{width:auto}
/* Schonzeiten-Matrix wie im Vorbild: grüner Haken = Jagdzeit, rotes Kreuz = Schonzeit */
.mx{width:100%;border-collapse:collapse;font-size:11px;background:#fff;table-layout:fixed}
.mx th{background:linear-gradient(#8DA763,var(--olive));color:#fff;padding:3px 0;font-size:10px;border:1px solid #6E8A45}
.mx th:first-child{width:30%;text-align:left;padding-left:5px}
.mx td{border:1px solid #E0E4CF;text-align:center;height:22px;padding:0}
.mx td:first-child{text-align:left;padding-left:5px;font-weight:700;color:#12310b;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mx tr.grp td{background:#1e5bd8;color:#fff;font-weight:700}
.mx .y{color:#0a8a0a;font-weight:700;font-size:14px}.mx .n{color:#d30801;font-size:13px}
.mx sup{font-size:8px;color:#000;font-weight:700}
.mx tr.on td{outline:2px solid var(--orange);outline-offset:-2px}
.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;margin:6px 0;color:#12310b;font-weight:700}
/* Kassenbestand */
.kbest{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin:8px 0;font-weight:700;color:#0D0D6D}
.kbest span{border:2px solid #3b8a3b;background:#fff;padding:3px 12px;border-radius:2px;font-size:16px;color:#0D0D6D}
/* Chat */
#tab-chat{padding:0}
#chatList{position:absolute;inset:0;overflow:auto;background:#fff}
.chi{display:flex;gap:12px;padding:10px 12px;border-bottom:1px solid #E3E6D2;align-items:center;cursor:pointer}
.chi:nth-child(even){background:var(--band)}
.av{width:42px;height:42px;border-radius:50%;background:var(--olive);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;flex:none}
.chi .mid{flex:1;min-width:0}.chi .top{display:flex;justify-content:space-between;gap:8px;align-items:center}
.chi .top b{color:var(--grn)}
.pv{color:var(--mu);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge{background:var(--redline);color:#fff;border-radius:99px;min-width:20px;padding:0 6px;text-align:center;font-size:12px;line-height:20px;font-style:normal}
.badge.nb{position:absolute;top:1px;left:calc(50% + 4px)}
#chatView{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--bg)}
.chh .av{width:34px;height:34px}
#chatMsgs{flex:1;overflow:auto;padding:10px;display:flex;flex-direction:column;gap:4px}
.bub{max-width:84%;padding:6px 9px;border-radius:6px;background:#fff;border:1px solid var(--ln2);align-self:flex-start;overflow-wrap:anywhere}
.bub .tx{white-space:pre-wrap}
.bub.me{align-self:flex-end;background:#DCEBB9;color:#111;border-color:#B4C98A}
.bub .nm{font-size:12px;font-weight:700}
.bub .meta{font-size:11px;color:var(--mu);text-align:right;margin-top:2px;white-space:nowrap}
.bub img{max-width:100%;max-height:300px;border-radius:4px;display:block;margin-bottom:4px;cursor:zoom-in}
.bub .loc .row{margin:6px 0}.bub .loc .btn{padding:6px 12px;font-size:14px}
.bub .del{border:0;background:none;font-size:12px;padding:0 6px 0 0;opacity:.6}
.tick.read{color:#1e6fd8;opacity:1}.tick.fail{color:var(--red)}
.day{align-self:center;font-size:12px;background:var(--navhead);border:1px solid var(--ln2);padding:2px 10px;border-radius:3px;color:var(--mu);margin:6px 0}
.cmp{display:flex;gap:6px;padding:8px;background:var(--bar);border-top:1px solid var(--olive);align-items:flex-end}
.cmp textarea{flex:1;resize:none;max-height:100px;border-radius:3px;padding:8px 10px;line-height:1.3}
.cmp button{border:1px solid var(--olive2);border-radius:3px;width:40px;height:40px;background:linear-gradient(#A9C27A,var(--olive));color:#fff;font-size:18px;flex:none}
.cmp .ghost{background:none;border-color:transparent;color:var(--mu);font-size:22px;width:34px}
.seg{display:flex;gap:6px;margin:10px 0;flex-wrap:wrap}.seg .btn.on{background:linear-gradient(#FFC98A,var(--orange));color:#2a1700;border-color:#C77310}
.bk{height:9px;background:#fff;border:1px solid var(--ln);overflow:hidden;margin-top:6px}.bk i{display:block;height:100%;background:var(--olive)}.bk i.over{background:var(--red)}
/* Abschussplan: Soll/Ist wie im Vorbild – Über-/Unterschreitung farbig */
#planList .card h3{color:var(--grn)}
.cmpv{display:inline-block;min-width:22px;text-align:right;font-weight:700}.cmpv.neg{color:#d30801}.cmpv.pos{color:#1b45c8}.cmpv.zero{color:var(--grn)}
.mx th.now{background:var(--orange);color:#2a1700}

/* Revierkarte */
.gbar{max-height:55%;overflow:auto;right:62px}.gbar .row{margin-top:8px}.gbar .grow{display:flex;align-items:center;gap:6px;justify-content:space-between;margin:6px 0;flex-wrap:wrap}.gbar .btn{padding:6px 10px}
.gname{color:#E40500;font-weight:700;font-size:13px;text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff;white-space:nowrap;transform:translate(-50%,-50%)}
.gpt{width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid #E40500;box-shadow:0 1px 4px #0006;box-sizing:border-box}.gpt.sel{background:#FFA03D}
.gmid{width:10px;height:10px;margin:3px;border-radius:50%;background:#fffc;border:2px solid #E40500;box-sizing:border-box;opacity:.8}

/* Symbole der Reviereinrichtung */
.ic{width:1.3em;height:1.3em;vertical-align:-.3em;color:#3F5F1C}
.sm{width:34px;height:34px;box-sizing:border-box;border-radius:50%;background:#fff;border:2px solid #7B9651;box-shadow:0 2px 5px #0006;display:flex;align-items:center;justify-content:center}.sm .ic{width:22px;height:22px;vertical-align:0}.sm.occ{background:#E40500;border-color:#9b0300}.sm.occ .ic{color:#fff}

.sm.out{border-style:dashed;border-color:#FFA03D;box-shadow:0 0 0 3px #FFA03D88,0 2px 5px #0006}

.wsw{display:inline-block;width:14px;height:5px;border-radius:2px;vertical-align:middle}

.newver{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:8px 12px;background:#FFF1B8;border-bottom:1px solid #C9A300;color:#4a3a00;font-size:14px}.newver[hidden]{display:none}