/* Intranet Militärschützen Gunzgen – Stil angelehnt an msgunzgen.ch */
:root{
  --bg:#ffffff; --surface:#f5f7fa; --surface-2:#e8edf3; --line:#d5dce5;
  --ink:#1b1f24; --navy:#001d3b; --muted:#5a6573;
  --blue:#094b92; --blue-ink:#ffffff; --blue-soft:#e3ecf7;
  --red:#b3261e; --red-soft:#f8dedb; --ok:#2e7d4f; --ok-soft:#dcefe3; --warn:#9a6700; --warn-soft:#fbefd2;
  --band:#001d3b; --band-ink:rgba(255,255,255,.88);
  --f:"Open Sans","Segoe UI",system-ui,-apple-system,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --r:8px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#0b1622; --surface:#112131; --surface-2:#182c40; --line:#26405a;
  --ink:#e4ebf3; --navy:#d6e5f6; --muted:#97a8bb;
  --blue:#4f93e0; --blue-ink:#04111f; --blue-soft:#173250;
  --red:#ef7b72; --red-soft:#3d2321; --ok:#6cc792; --ok-soft:#1f3529; --warn:#e7b44c; --warn-soft:#3a2f17;
  --band:#06101b; --band-ink:rgba(255,255,255,.8);
  color-scheme:dark}}

*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--f);font-size:16px;line-height:1.5;-webkit-text-size-adjust:100%}
[hidden]{display:none!important}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.wrap{max-width:1080px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
h1,h2,h3,.t,.tabs span,.cat,.subtabs button,.stat .k,.btn.primary{font-stretch:75%}
h1,h2,h3{color:var(--navy);text-transform:uppercase;font-weight:700;line-height:1.1;margin:0;text-wrap:balance}

/* ---------- Anmeldung ---------- */
.auth{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:max(24px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:linear-gradient(180deg,var(--band) 0 220px,var(--bg) 220px)}
.auth-card{width:100%;max-width:400px;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:24px;box-shadow:0 10px 30px rgba(0,20,40,.12)}
.auth-brand{display:flex;gap:12px;align-items:center;margin-bottom:20px}
.auth-brand h1{font-size:1.45rem}
.auth-brand p{margin:0;color:var(--muted);font-size:.9rem}
.auth h2{font-size:1.4rem}
.stack{display:flex;flex-direction:column;gap:14px}
.hint{margin:0;color:var(--muted);font-size:.92rem}
.links{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.linkbtn{background:none;border:0;padding:0;color:var(--blue);text-decoration:underline;cursor:pointer;font-size:.92rem}
.msg{margin:14px 0 0;padding:10px 12px;border-radius:6px;background:var(--blue-soft);font-size:.92rem}
.msg.err{background:var(--red-soft);color:var(--red)}
.back{color:var(--muted);font-size:.9rem}

/* ---------- Kopf ---------- */
header.top{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top)}
.bar{display:flex;align-items:center;gap:12px;padding-block:10px}
.logo{border-radius:8px}
.brandtxt{min-width:0}
.brandtxt .t{font-weight:700;text-transform:uppercase;color:var(--navy);font-size:1.3rem;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brandtxt .s{font-size:.8rem;color:var(--muted)}
.me{margin-left:auto;width:38px;height:38px;border-radius:50%;border:0;background:var(--blue);color:var(--blue-ink);font-weight:700;cursor:pointer;flex:none}

.tabs .tabsin{display:flex;gap:2px}
.tabs button{border:0;background:none;display:flex;align-items:center;gap:7px;padding:8px 14px 11px;cursor:pointer;color:var(--muted);border-bottom:3px solid transparent;font-weight:700;text-transform:uppercase;font-size:1.02rem;letter-spacing:.02em}
.tabs button[aria-current="page"]{color:var(--navy);border-bottom-color:var(--blue)}
.tabs svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tabs svg .fill{fill:currentColor}
@media (max-width:700px){
  .tabs{position:fixed;left:0;right:0;bottom:0;background:var(--bg);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);z-index:6}
  .tabs .tabsin{justify-content:space-around;padding:0}
  .tabs button{flex-direction:column;gap:2px;padding:8px 6px 6px;font-size:.78rem;border-bottom:0;border-top:3px solid transparent;flex:1}
  .tabs button[aria-current="page"]{border-top-color:var(--blue)}
  .tabs svg{width:24px;height:24px}
  body:has(#v-app:not([hidden])){padding-bottom:calc(66px + env(safe-area-inset-bottom))}
}

main{padding-block:22px 48px;min-height:60vh}
.head{display:flex;align-items:end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.head h2{font-size:1.9rem}
.head p{margin:4px 0 0;color:var(--muted);max-width:60ch}

/* ---------- Bausteine ---------- */
.btn{border:1px solid var(--line);background:var(--bg);padding:8px 16px;border-radius:999px;cursor:pointer;font-weight:600;font-size:.95rem;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none}
.btn:hover{border-color:var(--blue)}
.btn.primary{background:var(--blue);border-color:var(--blue);color:var(--blue-ink);text-transform:uppercase;letter-spacing:.04em;font-weight:700;padding:10px 20px}
.btn.small{padding:4px 12px;font-size:.85rem}
.btn.ghost{border-color:transparent;background:none;color:var(--muted)}
.btn.ghost:hover{color:var(--ink)}
.btn.danger{color:var(--red)}
.btn.armed{background:var(--red);border-color:var(--red);color:#fff}
.btn.on{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}
.btn:disabled{opacity:.5;cursor:default}

.field{display:flex;flex-direction:column;gap:4px}
.field label{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700}
.field input,.field select,.field textarea{border:1px solid var(--line);background:var(--bg);border-radius:6px;padding:10px 12px;width:100%;font-size:16px}
.field textarea{min-height:120px;resize:vertical}
.field.check{flex-direction:row;align-items:center;gap:8px}
.field.check input{width:20px;height:20px}
.field.check label{text-transform:none;letter-spacing:0;font-size:.95rem;color:var(--ink);font-weight:400}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:480px){.row2{grid-template-columns:1fr}}

.grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;align-items:start}
@media (max-width:860px){.grid{grid-template-columns:1fr}}
.meta{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-size:.88rem;color:var(--muted)}
.cat{font-weight:700;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.chip{display:inline-block;font-size:.78rem;font-weight:700;padding:1px 9px;border-radius:999px;background:var(--surface-2);color:var(--ink)}
.chip.hl{background:var(--blue-soft);color:var(--blue)}
.chip.red{background:var(--red-soft);color:var(--red)}

.empty{border:1.5px dashed var(--line);border-radius:var(--r);padding:28px 20px;text-align:center;color:var(--muted)}
.empty b{display:block;color:var(--navy);text-transform:uppercase;font-stretch:75%;font-size:1.2rem;margin-bottom:4px}

/* Termine */
.list{display:flex;flex-direction:column;gap:10px}
.termin{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px}
.date{text-align:center;border-right:1px solid var(--line);padding-right:12px}
.date .d{font-stretch:75%;font-weight:700;font-size:2rem;line-height:1;color:var(--navy)}
.date .m{font-stretch:75%;font-weight:700;font-size:.85rem;text-transform:uppercase;color:var(--blue)}
.date .w{font-size:.75rem;color:var(--muted)}
.termin h3{font-size:1.3rem;margin:4px 0 2px}
.termin .text{white-space:pre-wrap;font-size:.95rem;color:var(--muted);margin-top:4px;overflow-wrap:anywhere}
.zus{font-size:.85rem;color:var(--muted);margin-top:6px}
.tact{display:flex;flex-direction:column;gap:6px;align-items:end}
@media (max-width:560px){.termin{grid-template-columns:54px minmax(0,1fr)}.tact{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}}
details.past{margin-top:18px}
details.past summary{cursor:pointer;color:var(--muted);font-weight:600}
details.past .termin{opacity:.72}

/* Infos */
.post{padding-block:16px;border-top:1px solid var(--line)}
.post:first-child{border-top:0;padding-top:0}
.post h3{font-size:1.35rem;margin:4px 0 6px}
.post .text{white-space:pre-wrap;max-width:68ch;overflow-wrap:anywhere}
.acts{display:flex;gap:4px;margin-top:6px;flex-wrap:wrap}

.side{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.side h3{font-size:1.15rem;margin-bottom:10px}
.side dl{margin:0;display:grid;gap:10px}
.side dt{font-size:.75rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:700}
.side dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}

/* Vorstand */
.subtabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}
.subtabs button{border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:6px 16px;cursor:pointer;font-weight:700;text-transform:uppercase;font-size:.95rem}
.subtabs button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:var(--blue-ink)}
.stats{display:flex;gap:28px;flex-wrap:wrap}
.stat .v{font-stretch:75%;font-weight:700;font-size:1.9rem;line-height:1;color:var(--navy);font-variant-numeric:tabular-nums}
.stat .v.neg{color:var(--red)}
.stat .k{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r)}
table{border-collapse:collapse;width:100%;font-size:.95rem}
th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.74rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);background:var(--surface);white-space:nowrap}
tr:last-child td{border-bottom:0}
td.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
td.neg{color:var(--red)}
td.mono{font-family:var(--mono);font-size:.86rem;white-space:nowrap}
td.done{text-decoration:line-through;color:var(--muted)}
td.nowrap{white-space:nowrap}
.pill{display:inline-block;font-size:.78rem;font-weight:700;padding:3px 10px;border-radius:999px;border:0;cursor:pointer}
.pill.yes{background:var(--ok-soft);color:var(--ok)}
.pill.no{background:var(--red-soft);color:var(--red)}
.pill.late{background:var(--red-soft);color:var(--red);cursor:default}
.pill.wait{background:var(--warn-soft);color:var(--warn);cursor:default}
.proto{border:1px solid var(--line);border-radius:var(--r);margin-bottom:10px;background:var(--surface)}
.proto summary{padding:12px 14px;cursor:pointer;display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.proto summary b{font-stretch:75%;text-transform:uppercase;color:var(--navy);font-size:1.15rem}
.proto .body{padding:0 14px 6px;white-space:pre-wrap;overflow-wrap:anywhere}

/* Admin */
.cards2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:20px;align-items:start}
.panel{border:1px solid var(--line);border-radius:var(--r);padding:18px;min-width:0}
.panel h3{font-size:1.25rem;margin-bottom:12px}
.users{display:flex;flex-direction:column}
.user{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-block:10px;border-top:1px solid var(--line)}
.user:first-child{border-top:0;padding-top:0}
.user .who{flex:1 1 180px;min-width:0}
.user .who small{display:block;color:var(--muted);overflow-wrap:anywhere}
.user select{border:1px solid var(--line);background:var(--bg);border-radius:6px;padding:6px 8px}
.codebox{display:flex;gap:8px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:8px 10px;font-family:var(--mono);font-size:.85rem;overflow-wrap:anywhere}
.codebox code{flex:1;min-width:0}

/* Dialog, Footer, Toast */
dialog{border:0;border-radius:12px;padding:0;width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);background:var(--bg);color:var(--ink);box-shadow:0 20px 50px rgba(0,0,0,.3)}
dialog::backdrop{background:rgba(0,15,30,.5)}
dialog form{padding:20px;display:flex;flex-direction:column;gap:12px}
dialog h3{font-size:1.45rem}
.formbtns{display:flex;justify-content:flex-end;gap:8px;margin-top:6px;flex-wrap:wrap}
footer.band{background:var(--band);color:var(--band-ink);padding-block:20px}
footer.band .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:.9rem}
footer.band b{font-stretch:75%;text-transform:uppercase;font-size:1.05rem}
footer.band a{color:inherit}
.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateX(-50%);background:var(--navy);color:var(--bg);padding:10px 16px;border-radius:8px;font-size:.95rem;z-index:20;max-width:calc(100vw - 32px);box-shadow:0 6px 20px rgba(0,0,0,.2)}
.loading{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);color:var(--muted);z-index:30}
@media (prefers-reduced-motion:no-preference){.termin,.post{animation:in .2s ease-out}@keyframes in{from{transform:translateY(4px)}to{transform:none}}}

/* ===== Update 01: Start, Kalender, Chat ===== */
.tabs button{position:relative}
.dot{position:absolute;top:6px;right:6px;width:9px;height:9px;border-radius:50%;background:var(--red);border:2px solid var(--bg)}
@media (min-width:701px){.dot{top:8px;right:4px}}
.hello{font-size:1rem;color:var(--muted);margin:0 0 4px}
.sec{margin-top:30px}
.sec:first-child{margin-top:0}
.sec > h2{font-size:1.5rem;margin-bottom:12px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.sec > h2 small{font-size:.9rem;color:var(--muted);text-transform:none;font-stretch:100%;font-weight:400}
.week{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px}
.wcard{border:1px solid var(--line);border-left:5px solid var(--blue);border-radius:var(--r);padding:14px;background:var(--surface);display:flex;flex-direction:column;gap:6px;min-width:0}
.wcard.fest{border-left-color:var(--navy)}
.wcard.vers{border-left-color:var(--red)}
.wcard .when{font-weight:700;color:var(--blue);font-size:.9rem;text-transform:uppercase;letter-spacing:.03em;font-stretch:75%}
.wcard h3{font-size:1.3rem}
.wcard .deadline{font-size:.88rem;color:var(--warn);font-weight:600}
.rsvp{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:4px}
.btn.no-on{background:var(--red-soft);border-color:var(--red);color:var(--red)}
.counts{font-size:.85rem;color:var(--muted);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:2px}

.composer{border:1px solid var(--line);border-radius:var(--r);padding:12px;display:flex;flex-direction:column;gap:8px;background:var(--surface);margin-bottom:8px}
.composer textarea{border:1px solid var(--line);border-radius:6px;padding:10px 12px;min-height:72px;resize:vertical;background:var(--bg);width:100%;font-size:16px}
.composer .row{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;font-size:.85rem;color:var(--muted)}
.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.9rem;color:#fff;flex:none}
.pin{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;padding-block:14px;border-top:1px solid var(--line)}
.pin:first-of-type{border-top:0}
.pin .who{font-weight:700}
.pin .text{white-space:pre-wrap;overflow-wrap:anywhere;margin-top:2px}
.pin h3{font-size:1.15rem;margin-top:2px}

/* Kalender */
.calbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.calbar h2{font-size:1.6rem;min-width:9ch}
.iconbtn{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--bg);cursor:pointer;font-size:1.1rem;line-height:1}
.filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.filters button{border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:4px 12px;cursor:pointer;font-size:.88rem;font-weight:600}
.filters button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:var(--bg)}
.month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.month .wd{background:var(--surface);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:6px;text-align:center;border-bottom:1px solid var(--line)}
.day{min-height:84px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:4px;background:var(--bg);cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:2px;min-width:0;font:inherit;color:inherit;border-top:0;border-left:0}
.day:nth-child(7n+7){border-right:0}
.day.other{background:var(--surface);color:var(--muted)}
.day .n{font-size:.85rem;font-weight:600;width:24px;height:24px;display:grid;place-items:center;border-radius:50%}
.day.today .n{background:var(--blue);color:var(--blue-ink)}
.day.sel{outline:2px solid var(--blue);outline-offset:-2px}
.ev{font-size:.72rem;line-height:1.25;padding:1px 4px;border-radius:3px;background:var(--blue-soft);color:var(--blue);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.ev.fest{background:var(--navy);color:var(--bg)}
.ev.vers{background:var(--red-soft);color:var(--red)}
.ev.mine{box-shadow:inset 3px 0 0 var(--ok)}
@media (max-width:640px){
  .day{min-height:52px;align-items:center}
  .day .ev{display:none}
  .day .pips{display:flex;gap:3px}
  .day .pips i{width:6px;height:6px;border-radius:50%;background:var(--blue)}
  .day .pips i.fest{background:var(--navy)} .day .pips i.vers{background:var(--red)}
}
@media (min-width:641px){.day .pips{display:none}}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.8rem;color:var(--muted);margin:8px 0 22px}
.legend span::before{content:"";display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px;background:var(--blue-soft)}
.legend .l-fest::before{background:var(--navy)} .legend .l-vers::before{background:var(--red-soft)} .legend .l-mine::before{background:var(--ok)}
.termin .links a{font-size:.88rem;color:var(--blue)}
.namelist{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.namelist ul{margin:6px 0 0;padding-left:18px}
@media (max-width:480px){.namelist{grid-template-columns:1fr}}

/* Chat */
.chatwrap{display:grid;grid-template-columns:280px minmax(0,1fr);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;height:calc(100dvh - 210px);min-height:420px}
.rooms{border-right:1px solid var(--line);overflow-y:auto;background:var(--surface)}
.room{display:flex;gap:10px;align-items:center;width:100%;padding:10px 12px;border:0;border-bottom:1px solid var(--line);background:none;cursor:pointer;text-align:left;font:inherit;color:inherit}
.room[aria-current="true"]{background:var(--blue-soft)}
.room .rt{min-width:0;flex:1}
.room .rn{font-weight:700;display:flex;justify-content:space-between;gap:6px}
.room .rp{font-size:.85rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.room .unread{width:10px;height:10px;border-radius:50%;background:var(--red);flex:none}
.convo{display:flex;flex-direction:column;min-width:0;min-height:0}
.convo .ch{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line)}
.convo .ch b{font-stretch:75%;text-transform:uppercase;color:var(--navy);font-size:1.15rem}
.msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:6px}
.cm{max-width:78%;align-self:flex-start;display:flex;flex-direction:column;gap:2px;min-width:0}
.cm.own{align-self:flex-end;align-items:flex-end}
.cm .bub{background:var(--surface-2);padding:8px 12px;border-radius:14px 14px 14px 4px;white-space:pre-wrap;overflow-wrap:break-word;max-width:100%}
.cm.own .bub{background:var(--blue);color:var(--blue-ink);border-radius:14px 14px 4px 14px}
.cm .mt{font-size:.72rem;color:var(--muted)}
.dayline{align-self:center;font-size:.75rem;color:var(--muted);background:var(--surface);padding:2px 10px;border-radius:999px;margin:8px 0}
.sendbar{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);align-items:flex-end}
.sendbar textarea{flex:1;border:1px solid var(--line);border-radius:18px;padding:9px 14px;resize:none;max-height:120px;background:var(--bg);font-size:16px}
.backbtn{display:none}
@media (max-width:700px){
  .chatwrap{grid-template-columns:1fr;height:calc(100dvh - 190px - env(safe-area-inset-bottom))}
  .chatwrap.open .rooms{display:none}
  .chatwrap:not(.open) .convo{display:none}
  .backbtn{display:inline-flex}
}

/* ===== Homepage-Stil (msgunzgen.ch) ===== */
body{font-size:16px}
h1,h2,h3{letter-spacing:.005em}
/* Kopf: Name links, Textmenü rechts */
header.top{border-bottom:0;box-shadow:0 1px 0 var(--line)}
.bar{padding-block:20px;gap:24px}
.brandtxt{display:flex;flex-direction:column;text-decoration:none;min-width:0;margin-right:auto}
.brandtxt .t{font-size:1.75rem;line-height:1}
.brandtxt .s{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:3px}
@media (min-width:701px){
  .tabs{position:static;border:0;padding:0}
  .tabs .tabsin{max-width:none;padding:0;gap:4px}
  .tabs button{font-stretch:100%;font-size:.8rem;font-weight:600;letter-spacing:.06em;color:var(--navy);opacity:.72;padding:8px 10px;border-bottom:0}
  .tabs button:hover{opacity:1}
  .tabs button[aria-current="page"]{opacity:1;font-weight:700;border-bottom:0;box-shadow:inset 0 -2px 0 var(--navy)}
  .tabs svg{display:none}
  .me{margin-left:8px}
}
@media (max-width:700px){
  .bar{padding-block:14px}
  .brandtxt .t{font-size:1.35rem}
  .me{margin-left:auto}
}
/* Banner wie auf der Homepage */
.banner{margin:0 0 26px;aspect-ratio:1966/391;max-height:220px;width:100%;overflow:hidden;background:var(--surface-2)}
.banner img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:700px){.banner{aspect-ratio:2.4/1}}
/* Titel und Untertitel */
.sec > h2,.head h2,.calbar h2{font-size:2.15rem}
.sub{font-stretch:75%;font-weight:700;text-transform:uppercase;color:var(--navy);font-size:1rem;letter-spacing:.01em;margin:4px 0 14px}
.hello{font-stretch:75%;font-weight:700;text-transform:uppercase;color:var(--navy);font-size:1.05rem;margin-bottom:4px}
/* Flach statt Karten */
.termin,.wcard,.side,.composer,.panel,.proto,.tablewrap,.month,.chatwrap{border-radius:0}
.side,.composer,.proto{background:transparent}
.btn{font-size:.82rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:8px 16px}
.btn.small{font-size:.74rem;padding:5px 12px}
.btn.ghost,.linkbtn,.counts{text-transform:none;letter-spacing:0}
.btn:not(.primary):not(.ghost):not(.on):not(.no-on):not(.armed){border-color:var(--blue);color:var(--blue)}
/* Login weiss wie die Homepage */
.auth{background:var(--bg);justify-content:flex-start;padding-top:max(32px,env(safe-area-inset-top))}
.auth-card{max-width:760px;border:0;box-shadow:none;padding:0}
.auth-brand{display:block;margin-bottom:18px}
.auth-brand h1{font-size:1.9rem}
.auth-brand p{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase}
.auth form,.auth .msg,.auth .stack{max-width:440px}
.auth h2{font-size:2rem}

/* Kompakte Terminliste, nach Tag gruppiert */
.daygroup{margin-bottom:18px}
.daygroup > h3{font-size:1rem;color:var(--navy);padding:8px 0 6px;border-bottom:2px solid var(--navy);display:flex;gap:10px;align-items:baseline}
.daygroup > h3 small{font-stretch:100%;text-transform:none;font-weight:600;color:var(--blue);font-size:.82rem}
.trow{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:4px 14px;padding:11px 0;border-bottom:1px solid var(--line);align-items:start}
.trow .tm{white-space:nowrap;font-family:var(--mono);font-size:.85rem;color:var(--muted);padding-top:3px;font-variant-numeric:tabular-nums}
.trow .tt{font-weight:700;color:var(--ink)}
.trow .tt .chip{margin-left:6px;vertical-align:1px}
.trow .to{font-size:.9rem;color:var(--muted)}
.trow .tx{font-size:.85rem;color:var(--muted);white-space:pre-wrap}
.trow .tx a{color:var(--blue)}
.trow .ta{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.trow .rsvp{margin-top:0;justify-content:flex-end}
.trow.mine .tt::before{content:"✓ ";color:var(--ok)}
.trow .admin{display:flex;gap:2px}
@media (max-width:640px){
  .trow{grid-template-columns:minmax(0,1fr);gap:2px}
  .trow .tm{padding-top:0;font-size:.8rem}
  .trow .ta{align-items:flex-start;margin-top:6px}
  .trow .rsvp{justify-content:flex-start}
}

/* ===== Update 02: Resultate, Ranglisten, Benutzer ===== */
.fsel{border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:4px 12px;font-size:.88rem;font-weight:600;color:var(--ink)}
input.fsel{border-radius:6px;padding:7px 12px;font-weight:400;font-size:16px}
.row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:480px){.row3{grid-template-columns:1fr 1fr}.row3 .field:last-child{grid-column:1/-1}}
.restab td{vertical-align:middle}
tr.me-row td{background:var(--blue-soft)}
tr.wait-row td{background:var(--warn-soft)}
.rank{display:inline-grid;place-items:center;min-width:28px;height:28px;border-radius:50%;font-weight:700}
.rank.r1{background:#d4a017;color:#1b1400}.rank.r2{background:#b8bec6;color:#141820}.rank.r3{background:#b8733a;color:#fff}
dialog.wide{width:min(980px,calc(100vw - 24px))}
@media (max-width:700px){
  .tabs .tabsin{overflow-x:auto;scrollbar-width:none;justify-content:flex-start}
  .tabs button{min-width:62px;font-size:.66rem;letter-spacing:0}
  .tabs svg{width:22px;height:22px}
}
@media (min-width:701px){
  .bar{flex-wrap:wrap;row-gap:8px}
  .brandtxt .t{white-space:nowrap;overflow:visible;font-size:clamp(1.35rem,2.1vw,1.75rem)}
  .tabs button{white-space:nowrap}
}
@media (min-width:701px){
  .bar{gap:10px}
  .tabs .tabsin{gap:0}
  .tabs button{padding:8px 8px}
}
@media (min-width:701px) and (max-width:1100px){.tabs button{font-size:.74rem;padding:8px 6px}}

/* ===== Update 03: Benachrichtigungen ===== */
.pushhint{display:flex;justify-content:space-between;align-items:center;gap:10px 16px;flex-wrap:wrap;border:1px solid var(--blue);background:var(--blue-soft);padding:12px 14px;margin-bottom:18px;font-weight:600}

/* ===== Kompakte, aufklappbare Termine (Startseite) ===== */
.daygroup.mini{margin-bottom:12px}
.daygroup.mini > h3{font-size:.88rem;padding:6px 0 4px;border-bottom-width:1px}
.daygroup.mini > h3 .cnt{margin-left:auto;color:var(--muted);font-weight:400}
.tmini{border-bottom:1px solid var(--line)}
.tmini summary{list-style:none;display:grid;grid-template-columns:88px minmax(0,1fr) auto 14px;gap:10px;align-items:center;padding:8px 2px;cursor:pointer;font-size:.9rem}
.tmini summary::-webkit-details-marker{display:none}
.tmini summary:hover{background:var(--surface)}
.tmini .mt{font-family:var(--mono);font-size:.76rem;color:var(--muted);white-space:nowrap}
.tmini .mn{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tmini .mn b{font-weight:600}
.tmini .mo{color:var(--muted)}
.tmini .mn .chip{font-size:.68rem;padding:0 6px}
.tmini .mb{font-size:.72rem;font-weight:700;color:var(--muted);white-space:nowrap}
.tmini .mb.ok{color:var(--ok)} .tmini .mb.no{color:var(--red)}
.tmini .chev{color:var(--muted);transition:transform .15s;font-size:1.1rem;line-height:1}
.tmini[open] .chev{transform:rotate(90deg)}
.tmini .mbody{padding:2px 2px 12px 98px;display:flex;flex-direction:column;gap:6px}
.tmini .mbody .tx{font-size:.85rem;color:var(--muted);white-space:pre-wrap}
.tmini .mbody .tx a{color:var(--blue)}
.tmini .mbody .rsvp{justify-content:flex-start}
@media (max-width:640px){
  .tmini summary{grid-template-columns:minmax(0,1fr) auto 12px;row-gap:0}
  .tmini .mt{grid-column:1/-1;font-size:.72rem}
  .tmini .mbody{padding-left:2px}
}
@media (prefers-reduced-motion:reduce){.tmini .chev{transition:none}}

/* ===== Datenschutz & Sicherung ===== */
.dstext{font-size:.95rem;max-height:60dvh;overflow-y:auto;padding-right:4px}
.dstext h4{font-stretch:75%;text-transform:uppercase;color:var(--navy);margin:14px 0 4px;font-size:1rem}
.dstext ul{margin:0;padding-left:20px}
.dstext li{margin-bottom:3px}
.authfoot{display:flex;gap:18px;align-items:center}
.ftlink{color:inherit;font-size:inherit}
.field.check label .linkbtn{font-size:inherit}

/* ===== Schützendaten & An-/Abmeldung ===== */
.kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,180px),1fr));gap:10px 20px;margin:0 0 12px}
.kv dt{font-size:.75rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:700}
.kv dd{margin:0;font-weight:600}
.anmtab td,.anmtab th{padding:7px 9px}
.anmtab input[type=checkbox]{width:18px;height:18px}
.mailprev{white-space:pre-wrap;font-family:var(--mono);font-size:.8rem;background:var(--surface);border:1px solid var(--line);padding:10px 12px;margin:0;max-height:240px;overflow:auto}
.anmsave{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--ok-soft);padding:10px 12px;font-weight:600;color:var(--ok)}
.anmhist{margin:4px 0 0;padding-left:18px;font-size:.88rem;color:var(--muted)}
.anmstat{font-size:.8rem;font-weight:600;color:var(--blue)}
.anmstat.abmeldung{color:var(--red)}

.searchbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:-4px}
.searchbar .hint{font-size:.8rem}
.mailbox{display:flex;justify-content:space-between;align-items:center;gap:10px 16px;flex-wrap:wrap;border:1px solid var(--line);border-left:4px solid var(--blue);background:var(--surface);padding:12px 14px;margin-bottom:18px}
.mailbox .k{display:block;font-size:.75rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:700}
.mailbox b{font-size:1.05rem;overflow-wrap:anywhere}
.mailbox .acts{margin:0}

/* Verbindungen & Posteingang */
.conn hr { border: 0; border-top: 1px solid var(--line, #dde3ea); margin: 18px 0; }
.connhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.mini-check { display: inline-flex; align-items: center; gap: 6px; font-size: .86rem; white-space: nowrap; cursor: pointer; }
.mailbox #inbox { flex-basis: 100%; }
.inbox { list-style: none; margin: 10px 0 0; padding: 0; border: 1px solid var(--line, #dde3ea); border-radius: 8px; overflow: hidden; background: #fff; max-height: 420px; overflow-y: auto; }
.inbox li + li { border-top: 1px solid var(--line, #dde3ea); }
.inbox button { all: unset; box-sizing: border-box; width: 100%; cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 9px 12px; font-size: .9rem; color: #1b2733; }
.inbox button:hover, .inbox button:focus-visible { background: #eef3f9; }
.inbox .ifrom { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inbox .idate { color: #5b6b7b; font-size: .8rem; }
.inbox .isubj { grid-column: 1 / -1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #3a4a5a; }
.inbox .unseen .ifrom::before { content: "● "; color: #094b92; }
.inbox .unseen .isubj { color: #001d3b; font-weight: 600; }
.mailtext { white-space: pre-wrap; word-break: break-word; font: inherit; font-size: .92rem; background: #f5f7fa; border-radius: 8px; padding: 12px; max-height: 50vh; overflow: auto; margin: 12px 0 0; }
[hidden]{display:none!important}
/* Kopfzeile mit 8 Bereichen auf einer Zeile halten */
@media (min-width:701px){ .bar{flex-wrap:nowrap} .me{flex:none} }
@media (min-width:701px) and (max-width:1280px){
  .bar{gap:14px}
  .brandtxt .t{font-size:1.35rem}
  .tabs .tabsin{gap:0}
  .tabs button{padding:8px 7px;letter-spacing:.03em;font-size:.76rem}
}
@media (min-width:701px) and (max-width:960px){ .brandtxt .s{display:none} .brandtxt .t{font-size:1.05rem;white-space:normal;max-width:9em} .tabs button{padding:8px 5px;font-size:.72rem;letter-spacing:.01em} }
/* Funktionen pro Benutzer */
.rgroup{border:1px solid var(--line);padding:6px 12px 8px;margin:0 0 10px}
.rgroup legend{font-weight:700;text-transform:uppercase;font-size:.75rem;letter-spacing:.07em;color:var(--muted);padding:0 4px}
.rrow{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:4px 10px;padding:6px 4px;border-radius:4px;cursor:pointer}
.rrow + .rrow{border-top:1px solid var(--line)}
.rrow input{width:18px;height:18px;margin:0}
.rrow small{color:var(--muted);font-size:.76rem;white-space:nowrap}
.rrow.diff{background:#fff6e0}
.rrow.diff small::after{content:" · angepasst";color:#8a5a00;font-weight:600}
@media (max-width:480px){.rrow{grid-template-columns:auto 1fr}.rrow small{grid-column:2}}
/* Aufgaben */
.alist{display:flex;flex-direction:column;gap:8px}
.acard{display:flex;align-items:stretch;gap:0;border:1px solid var(--line);background:var(--bg)}
.acard.done{opacity:.62}
.acard.done .at{text-decoration:line-through}
.acheck{flex:none;width:46px;border:0;border-right:1px solid var(--line);background:transparent;display:grid;place-items:center;font-size:1.15rem;font-weight:700;color:var(--ok,#2e7d4f);cursor:pointer}
button.acheck:not([aria-pressed="true"])::after{content:"";width:20px;height:20px;border:2px solid var(--blue);border-radius:50%;display:block}
button.acheck:hover{background:var(--surface)}
span.acheck{cursor:default}
.abody{all:unset;box-sizing:border-box;flex:1;min-width:0;padding:10px 14px;cursor:pointer;display:flex;flex-direction:column;gap:4px}
.abody:hover,.abody:focus-visible{background:var(--surface)}
.abody:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.at{font-weight:700;color:var(--navy)}
.ameta{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;font-size:.84rem;color:var(--muted)}
.adesc{flex-basis:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adue.soon{color:#8a5a00;font-weight:600}
details.adone{margin-top:12px}
details.adone summary{cursor:pointer;font-weight:600;color:var(--muted);margin-bottom:8px}
.adetail{white-space:pre-wrap;background:var(--surface);padding:12px;margin:12px 0 0;font-size:.93rem}
.afh{margin:16px 0 6px;font-size:.78rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.afiles{list-style:none;margin:0 0 10px;padding:0}
.afiles li{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:6px 0;border-bottom:1px solid var(--line)}
.afiles li .linkbtn{font-weight:600;text-align:left;overflow-wrap:anywhere}
.afiles li .hint{font-size:.8rem;margin-right:auto}
.upl{cursor:pointer}
.apick{max-height:220px;overflow:auto;border:1px solid var(--line);padding:4px 8px;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:2px 12px}
.apick label{display:flex;align-items:center;gap:8px;padding:5px 2px;cursor:pointer;font-size:.92rem}
.apick label[hidden]{display:none}
.field .apick label{display:flex;justify-content:flex-start;text-transform:none;letter-spacing:0;font-weight:400;font-stretch:100%;color:var(--ink,#1b2733);font-size:.92rem;margin:0}
.field .apick label input{width:18px;height:18px;flex:none;margin:0}
/* lange Überschriften auf dem Handy umbrechen statt überlaufen */
.sec > h2,.head h2,.calbar h2{overflow-wrap:break-word;hyphens:auto}
@media (max-width:480px){.sec > h2,.head h2,.calbar h2{font-size:1.75rem}}
/* Vereinsfunktionen */
.fchips{display:inline-flex;flex-wrap:wrap;gap:4px;margin:4px 6px 4px 0;vertical-align:middle}
.fchip{display:inline-block;background:#e6eef8;color:#094b92;font-size:.74rem;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap}
.apick small{color:var(--muted);font-size:.78rem}
.wmwlist{border-top:1px solid var(--line)}
.wmw{display:grid;grid-template-columns:minmax(120px,190px) 1fr;gap:6px 16px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.wf{font-weight:700;color:var(--navy);font-stretch:75%;text-transform:uppercase;letter-spacing:.02em}
.wn{display:flex;flex-wrap:wrap;gap:6px 16px}
.wp{display:inline-flex;align-items:center;gap:8px}
.wp .avatar{width:28px;height:28px;font-size:.72rem;flex:none}
.wp .linkbtn{font-size:.95rem;text-decoration:none}
@media (max-width:480px){.wmw{grid-template-columns:1fr;gap:4px}}
/* Vorschlag-Knopf in der Kopfzeile */
.idea{margin-left:auto;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--blue);display:grid;place-items:center;cursor:pointer;flex:none}
.idea svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.idea:hover,.idea:focus-visible{background:var(--surface)}
.idea + .me{margin-left:8px}
.vkat{display:flex;flex-wrap:wrap;gap:8px}
.field .vkat label{display:inline-flex;text-transform:none;letter-spacing:0;font-weight:500;font-size:.92rem;color:var(--ink,#1b2733);margin:0;cursor:pointer}
.vkat input{position:absolute;opacity:0;width:1px;height:1px}
.vkat span{border:1px solid var(--line);border-radius:999px;padding:7px 14px;background:var(--bg)}
.vkat input:checked + span{background:var(--navy);border-color:var(--navy);color:#fff}
.vkat input:focus-visible + span{outline:2px solid var(--blue);outline-offset:2px}
.vmine{margin:4px 0 8px}.vmine summary{cursor:pointer;font-weight:600;color:var(--muted)}
.vitem{border-top:1px solid var(--line);padding:8px 0;font-size:.9rem}.vitem p{margin:4px 0 0;white-space:pre-wrap}
.vant{background:var(--surface);padding:6px 10px}
.vlist{display:flex;flex-direction:column;gap:10px}
.vcard{border:1px solid var(--line);background:var(--bg);padding:12px 14px}
.vhead{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}.vhead .hint{font-size:.82rem}
.vtext{white-space:pre-wrap;margin:8px 0;font-size:.95rem}
.vedit{display:grid;grid-template-columns:160px 1fr;gap:8px;align-items:start}
.vedit textarea{min-height:44px}
.vbtns{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap}
@media (max-width:560px){.vedit{grid-template-columns:1fr}}
.krow{border-top:1px solid var(--line);padding:10px 0;font-size:.92rem}
.krow .pill{margin:6px 6px 6px 0;display:inline-block}
.klist{margin:4px 0 8px}.klist summary{cursor:pointer;color:var(--blue);font-weight:600}
.klist ul{max-height:220px;overflow:auto;margin:6px 0 0;padding-left:18px;font-size:.86rem}
#admin-badge{position:absolute}

/* =====================================================================
   Design 2026 – ruhiger, mit Tiefe. Marken-Navy + Blau bleiben,
   Messing (Patronenhülse) nur für „Treffer“: heute, nächster Anlass, Kranz.
   ===================================================================== */
:root{
  --page:#eef2f7; --line:#dde4ed; --line-strong:#c9d3df;
  --ink:#16222f; --muted:#5b6878;
  --brass:#b8892b; --brass-ink:#7a5a12; --brass-soft:#f6ecd6;
  --navy-fix:#001d3b;
  --r:14px; --r-s:10px;
  --mono:var(--f);
  --sh:0 1px 2px rgba(0,29,59,.05),0 6px 18px rgba(0,29,59,.05);
}
@media (prefers-color-scheme: dark){:root{
  --page:#07111c; --line:#22384f; --line-strong:#2d4762; --ink:#e4ebf3;
  --brass:#d9a845; --brass-ink:#e9c06a; --brass-soft:#2f2612; --navy-fix:#0d2741;
  --sh:0 1px 2px rgba(0,0,0,.3)}}
body{background:var(--page);font-variant-numeric:tabular-nums}
#v-app main{padding-block:26px 56px}

/* Kopfzeile */
header.top{background:var(--bg);box-shadow:0 1px 0 var(--line)}
.bar{padding-block:14px}
.brandtxt .t{font-size:1.6rem}
.tabs .sm{display:none}
@media (max-width:700px){
  .bar{padding-block:10px;gap:10px}
  .brandtxt .t{white-space:normal;font-size:1.06rem;line-height:1.02;max-width:12ch}
  .brandtxt .s{display:none}
  .tabs{background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-top:1px solid var(--line)}
  .tabs button{border-top:0;font-size:.7rem;font-weight:600;color:var(--muted);padding:6px 2px 7px;gap:3px;text-transform:none;letter-spacing:0}
  .tabs button svg{width:44px;height:28px;padding:3px 10px;border-radius:999px;transition:background .15s}
  .tabs button[aria-current="page"]{color:var(--navy)}
  .tabs button[aria-current="page"] svg{background:var(--blue-soft);color:var(--blue)}
  .tabs .lg{display:none}.tabs .sm{display:inline}
  .tabs .dot{top:4px;right:calc(50% - 20px)}
}

/* Titel: kleiner und ruhiger, Unterzeilen in normaler Schrift */
.sec > h2,.head h2,.calbar h2{font-size:1.65rem}
.head h2:only-child,.head > div > h2{font-size:1.9rem}
.sub,.head p{font-stretch:100%;font-weight:400;text-transform:none;color:var(--muted);font-size:.95rem;letter-spacing:0;margin:2px 0 14px}
.sec{margin-top:34px}
.field label{text-transform:none;letter-spacing:0;font-size:.86rem;font-weight:600;color:var(--ink)}
th{text-transform:none;letter-spacing:0;font-size:.8rem;font-weight:700}
.stat .k{text-transform:none;letter-spacing:0;font-size:.82rem;font-weight:600}
.empty b{text-transform:none;font-stretch:100%;font-size:1.02rem}
.cat{text-transform:none;letter-spacing:0}

/* Knöpfe: Hauptaktion bleibt Homepage-Pill, der Rest ruhig */
.btn:not(.primary){text-transform:none;letter-spacing:0;font-size:.88rem;font-weight:600}
.btn.small:not(.primary){font-size:.82rem;padding:5px 12px}
.btn.primary{box-shadow:0 1px 0 rgba(0,0,0,.08)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.on{background:var(--ok);border-color:var(--ok);color:#fff}

/* Flächen: Inhalte liegen auf weissen Blättern */
.panel,.tablewrap,.month,.chatwrap,.composer,.proto,.acard,.vcard,.termin,.wcard{border-radius:var(--r);background:var(--bg);border:1px solid var(--line);box-shadow:var(--sh)}
.month,.chatwrap,.tablewrap{overflow:hidden}
.panel{padding:20px 22px}
.composer{padding:14px;background:var(--bg)}
.composer textarea{border-radius:var(--r-s);background:var(--page)}
.field input,.field select,.field textarea,.fsel,.sendbar textarea{border-color:var(--line-strong);border-radius:var(--r-s)}
.field input:focus,.field select:focus,.field textarea:focus,.composer textarea:focus{outline:2px solid var(--blue);outline-offset:0;border-color:var(--blue)}
.empty{background:var(--bg);border:1px dashed var(--line-strong);border-radius:var(--r)}

/* Startseite: Karte „Nächster Anlass“ */
.hero{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 28px;align-items:center;background:var(--navy-fix);color:#fff;border-radius:20px;padding:26px 30px;margin-bottom:18px;box-shadow:0 10px 30px rgba(0,29,59,.18)}
.hero h2{color:#fff;font-size:2.3rem;line-height:1.02;margin:2px 0 6px;max-width:22ch}
.hero .hmore{font-size:.6em;opacity:.7;font-stretch:100%}
.hgreet{margin:0 0 10px;font-size:.95rem;color:rgba(255,255,255,.72)}
.hwhen{margin:0;font-weight:700;color:#f0cf86;font-size:.95rem}
.hmeta{margin:0;color:rgba(255,255,255,.86);font-size:1rem}
.hacts{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:16px}
.hero .btn.primary{background:#fff;border-color:#fff;color:var(--navy-fix)}
.btn.hghost{background:transparent;border:1px solid rgba(255,255,255,.45)!important;color:#fff!important}
.btn.hghost:hover{border-color:#fff!important}
.hstat{font-weight:700;color:#9fe0b7}
.hero-img{position:absolute;inset:0 0 0 auto;width:58%;height:100%;object-fit:cover;z-index:-1;opacity:.38;-webkit-mask-image:linear-gradient(90deg,transparent,#000 55%);mask-image:linear-gradient(90deg,transparent,#000 55%)}
.htxt{min-width:0}
/* Schiessscheibe: Ringe, Datum im Zentrum */
.scheibe{width:168px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;flex:none;
  background:repeating-radial-gradient(circle at center,transparent 0 15px,rgba(255,255,255,.34) 15px 16.5px);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.zentrum{width:76px;height:76px;border-radius:50%;background:var(--brass);color:#1a1405;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;box-shadow:0 0 0 6px rgba(184,137,43,.25)}
.zentrum b{font-stretch:75%;font-size:2.1rem;font-weight:800}
.zentrum span{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-top:2px}
@media (max-width:700px){
  .hero{grid-template-columns:minmax(0,1fr);padding:22px 20px 20px;border-radius:18px}
  .hero h2{font-size:1.75rem;padding-right:96px}
  .hgreet,.hwhen{padding-right:96px}
  .scheibe{position:absolute;top:16px;right:14px;width:104px;z-index:-1}
  .scheibe{background:repeating-radial-gradient(circle at center,transparent 0 9px,rgba(255,255,255,.3) 9px 10px)}
  .zentrum{width:52px;height:52px;box-shadow:0 0 0 4px rgba(184,137,43,.25)}
  .zentrum b{font-size:1.5rem}.zentrum span{font-size:.6rem}
  .hero-img{width:100%;opacity:.22;-webkit-mask-image:linear-gradient(180deg,transparent,#000 70%);mask-image:linear-gradient(180deg,transparent,#000 70%)}
}
.startgrid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:8px 32px;align-items:start}
.startgrid .sec:first-child{margin-top:12px}
.sside .sec{margin-top:12px}
.sside .sec + .sec{margin-top:30px}
@media (max-width:900px){.startgrid{grid-template-columns:minmax(0,1fr)}.sside .sec{margin-top:34px}}
.pushhint{border-radius:var(--r);border:1px solid var(--line);background:var(--bg);box-shadow:var(--sh)}

/* Diese Woche / Termin-Listen */
.daygroup.mini{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:4px 14px 2px;margin-bottom:12px}
.daygroup.mini > h3{border-bottom:1px solid var(--line);text-transform:none;font-stretch:100%;font-size:.95rem;padding:10px 0 8px}
.daygroup.mini > h3 small{color:var(--brass-ink)}
.tmini:last-child{border-bottom:0}
.tmini .mt,.trow .tm{font-family:var(--f);font-weight:700;color:var(--navy);font-size:.85rem}
.tmini summary:hover{background:transparent}
.tmini summary:hover .mn b{color:var(--blue)}
.daygroup:not(.mini){background:var(--bg);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:2px 18px;margin-bottom:14px}
.daygroup:not(.mini) > h3{border-bottom:1px solid var(--line);text-transform:none;font-stretch:100%;font-size:1rem;padding:12px 0 10px}
.trow:last-child{border-bottom:0}
.trow.mine{box-shadow:inset 3px 0 0 var(--ok);margin-left:-18px;padding-left:15px;margin-right:-18px;padding-right:18px}
.trow.mine .tt::before{content:""}
.trow .admin .btn{color:var(--muted)}
.trow .tx a{text-underline-offset:2px}

/* Pinnwand */
.pin{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-top:10px;box-shadow:var(--sh)}
.pin:first-of-type{border-top:1px solid var(--line)}
.pin .acts .btn{font-size:.78rem}

/* Aufgaben / Wer macht was */
.acheck{border-right-color:var(--line)}
.acard{overflow:hidden}
.wmwlist{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:2px 16px}
.wmw:last-child{border-bottom:0}
.sside .wmw{grid-template-columns:1fr;gap:4px}
.wf{font-size:.85rem;color:var(--muted);text-transform:none;font-stretch:100%;font-weight:700;letter-spacing:0}

/* Kalender */
.month .wd{background:var(--bg);text-transform:none;letter-spacing:0;font-size:.8rem;border-bottom:1px solid var(--line)}
.day{border-color:var(--line)}
.day:nth-child(7n+6),.day:nth-child(7n+7){background:color-mix(in srgb,var(--page) 55%,var(--bg))}
.day.other{background:var(--page);color:color-mix(in srgb,var(--muted) 70%,transparent)}
.day.today .n{background:var(--brass);color:#1a1405;font-weight:800}
.day.sel{outline:2px solid var(--blue);outline-offset:-2px;background:var(--blue-soft)}
.day:hover{background:var(--blue-soft)}
.ev{border-radius:5px;padding:2px 6px}
.ev.fest{background:var(--navy-fix);color:#fff}
.legend span::before{border-radius:3px}
.legend .l-fest::before{background:var(--navy-fix)}

/* Chat */
.rooms{background:var(--bg)}
.room[aria-current="true"]{background:var(--blue-soft);box-shadow:inset 3px 0 0 var(--blue)}
.msgs{background:var(--page)}
.cm .bub{background:var(--bg);border:1px solid var(--line)}
.cm.own .bub{border-color:var(--blue)}

/* Tabellen & Ranglisten */
th{background:var(--bg);border-bottom:1px solid var(--line-strong)}
tbody tr:hover td{background:color-mix(in srgb,var(--blue-soft) 45%,transparent)}
td.num,td.mono{font-family:var(--f)}

/* Unter-Navigation & Filter */
.subtabs button{text-transform:none;font-size:.9rem;font-weight:600;background:var(--bg)}
.filters button{background:var(--bg)}

/* Dialoge, Toast, Fusszeile */
dialog{border-radius:18px;box-shadow:0 24px 60px rgba(0,20,40,.35)}
dialog form{padding:22px 22px 18px}
dialog h3{font-size:1.5rem}
.toast{border-radius:999px;padding:10px 18px;background:var(--navy-fix);color:#fff}
footer.band{background:var(--navy-fix)}

/* Anmeldung */
.auth{background:linear-gradient(180deg,var(--navy-fix) 0 230px,var(--page) 230px)}
.auth-card{max-width:440px;background:var(--bg);border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 40px rgba(0,29,59,.16);padding:26px 24px}
.auth-brand h1{color:var(--navy)}
.auth .back,.auth .authfoot{color:var(--muted)}
.auth-card .banner{margin:0 -24px 18px;border-radius:0;max-height:150px}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.hero h2{overflow-wrap:break-word;hyphens:auto}
.hlist{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:4px}
.hlist li{color:rgba(255,255,255,.9);font-size:1rem}
.hlist li b{color:#fff}
.hlist li span{color:rgba(255,255,255,.7);font-size:.92rem}
.hlist li span::before{content:"– "}
.hlist .hmore{color:rgba(255,255,255,.7);font-size:.9rem}
@media (min-width:701px) and (max-width:1300px){.brandtxt .t{font-size:1.3rem}.bar{gap:18px}}
@media (max-width:700px){.brandtxt .t{max-width:none;overflow:visible;text-overflow:clip;font-size:1rem}}
.kv dt{text-transform:none;letter-spacing:0;font-size:.82rem;font-weight:600}
/* Trainings */
.tstats{display:flex;gap:14px 30px;flex-wrap:wrap;margin:4px 0 12px}
.tstats .k .tup{color:var(--ok);font-weight:700}.tstats .k .tdown{color:var(--red);font-weight:700}
.tkurve{margin:0 0 14px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px 8px;box-shadow:var(--sh)}
.tkurve svg{width:100%;height:110px;display:block;overflow:visible}
.tkurve .tline{fill:none;stroke:var(--blue);stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.tkurve .tdot{fill:var(--bg);stroke:var(--blue);stroke-width:2;vector-effect:non-scaling-stroke}
.tkurve .tgrid{stroke:var(--line);stroke-dasharray:4 4;vector-effect:non-scaling-stroke}
.tkurve figcaption{font-size:.8rem;color:var(--muted);margin-top:4px}
.tlist{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);margin-bottom:10px}
.trow2{display:grid;grid-template-columns:86px minmax(0,1fr) 150px auto;gap:6px 14px;align-items:center;padding:11px 14px;border-top:1px solid var(--line)}
.trow2:first-child{border-top:0}
.td1{font-weight:700;color:var(--navy);font-size:.88rem}
.td2{min-width:0;display:flex;flex-direction:column}.td2 span{font-size:.84rem;color:var(--muted)}.td2 .tbem{font-style:italic}
.td3{display:grid;grid-template-columns:auto 1fr;gap:0 6px;align-items:baseline}
.td3 b{font-size:1.15rem;color:var(--navy)}.td3 span{font-size:.8rem;color:var(--muted)}
.tbar{grid-column:1/-1;display:block;height:6px;border-radius:99px;background:var(--surface-2);overflow:hidden;margin-top:4px}
.tbar i{display:block;height:100%;background:var(--brass);border-radius:99px}
.td3 small{grid-column:1/-1;font-size:.78rem;color:var(--muted)}
@media (max-width:600px){.trow2{grid-template-columns:70px minmax(0,1fr);}.td3{grid-column:2}.td4{grid-column:2}}
/* Trainingstermine im Kalender */
.ev.train{background:#dff1ec;color:#0f5c4a}
.day .pips i.train{background:#2a8c74}
.legend .l-train::before{background:#dff1ec;box-shadow:inset 0 0 0 1px #2a8c74}
@media (prefers-color-scheme: dark){.ev.train{background:#163b33;color:#9fe3cf}}
.repeatbox{border:1px dashed var(--line-strong);border-radius:var(--r-s);padding:10px 12px;display:flex;flex-direction:column;gap:8px}
/* Import */
.timap{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px 12px}
.timap select{border:1px solid var(--line-strong);border-radius:var(--r-s);padding:7px 8px;background:var(--bg)}
.tiprev{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-s)}
.tiprev table{font-size:.84rem}.tiprev td,.tiprev th{padding:6px 8px;white-space:nowrap}
.dbupd{border-color:var(--brass);background:linear-gradient(0deg,var(--brass-soft),var(--brass-soft)),var(--bg);margin-bottom:22px}
/* Hilfe & Support */
.idea svg .fill{fill:currentColor}
.faq{border:1px solid var(--line);border-radius:var(--r-s);padding:8px 12px;background:var(--page)}
.faq > summary{cursor:pointer;font-weight:700;color:var(--navy)}
.faqi{border-top:1px solid var(--line);padding:6px 0}
.faqi:first-of-type{margin-top:8px}
.faqi summary{cursor:pointer;font-weight:600;font-size:.92rem}
.faqi p{margin:6px 0 2px;font-size:.9rem;color:var(--muted)}
.vtech{font-size:.82rem;color:var(--muted)}
.vtech summary{cursor:pointer}
.vtech p{margin:4px 0 0;overflow-wrap:anywhere}
.vshots{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 8px}
.vshot{display:grid;place-items:center;width:110px;height:110px;border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden;background:var(--page);font-size:.75rem;color:var(--muted);text-align:center;padding:4px}
.vshot img{width:100%;height:100%;object-fit:cover}
.schk{list-style:none;margin:4px 0 6px;padding:0;display:flex;flex-direction:column;gap:6px}
.schk li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:8px;align-items:start;font-size:.93rem}
.schk li small{display:block;color:var(--muted);font-size:.82rem;margin-top:1px}
.schk .ci{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.8rem}
.schk .ok .ci{background:var(--ok-soft);color:var(--ok)}
.schk .warn .ci{background:var(--warn-soft);color:var(--warn)}
.schk .info .ci{background:var(--blue-soft);color:var(--blue)}
.sicht{display:flex;flex-wrap:wrap;gap:6px}
.sicht span{font-size:.82rem;font-weight:600;padding:3px 10px;border-radius:999px}
.sicht .on{background:var(--ok-soft);color:var(--ok)}
.sicht .off{background:var(--surface-2);color:var(--muted)}
.sbtns{justify-content:flex-start}
.sbtns .btn.primary{margin-left:auto}
/* Bedienungsanleitung */
.anlbtn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;text-align:left;padding:12px 14px;border-color:var(--blue);background:var(--blue-soft);color:var(--navy);font-weight:700;margin-bottom:10px}
.anlbtn small{font-weight:400;font-size:.84rem;color:var(--muted)}
details.anl{border-top:1px solid var(--line);padding:8px 0}
details.anl:first-child{border-top:0}
details.anl summary{cursor:pointer;font-weight:700;color:var(--navy);font-size:1rem}
details.anl ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px;font-size:.93rem;line-height:1.45}
details.anl ol b{color:var(--ink)}
#anl-list{max-height:min(60vh,560px);overflow-y:auto;padding-right:4px}
/* Kalender-Abo */
.abo{border:1px solid var(--line);border-radius:var(--r-s);padding:10px 12px;margin:10px 0;background:var(--page)}
.abo .acts{display:flex;flex-wrap:wrap;gap:6px}
/* Anlage */
.dlist{display:flex;flex-direction:column;gap:8px}
.dcard{display:flex;gap:12px;align-items:flex-start;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-s);padding:10px 12px}
.dcard.ich{border-color:var(--ok);box-shadow:inset 3px 0 0 var(--ok)}
.dcard.past{opacity:.65}
.dcard .dd{display:flex;flex-direction:column;align-items:center;min-width:40px;line-height:1.1;color:var(--navy)}
.dcard .dd b{font-size:1.35rem}.dcard .dd span{font-size:.75rem;text-transform:uppercase;color:var(--muted)}
.dcard .dt{font-weight:700}
.dcard .meta{font-size:.84rem;color:var(--muted);margin-top:1px}
.dh{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.hchip{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;font-size:.8rem;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--blue-soft);color:var(--navy)}
.hchip.me{background:var(--ok-soft);color:var(--ok)}
.hchip.leer{background:transparent;border:1px dashed var(--line);color:var(--muted);font-weight:400}
.dact{display:flex;flex-direction:column;gap:5px;align-items:flex-end}
.dline{display:flex;flex-direction:column;gap:3px;margin-top:6px}
.dchip{font-size:.84rem;color:var(--muted)}
.dchip.frei{color:var(--ink)}.dchip.ich{color:var(--ok);font-weight:600}
.dchip .linkbtn{margin-left:6px;font-size:.84rem}
.bulkrow{display:flex;align-items:center;gap:8px;font-size:.92rem;padding:3px 0}
.bulkrow input[type=number]{width:62px}
.bulkrow small{color:var(--muted)}
.bulklist{max-height:min(42vh,360px);overflow-y:auto;border:1px solid var(--line);border-radius:var(--r-s);padding:6px 10px}
.slist{display:flex;flex-direction:column;gap:10px}
.scard{display:flex;gap:12px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-s);padding:12px 14px}
.scard.over{border-color:var(--red);box-shadow:inset 3px 0 0 var(--red)}
.scard.soon{box-shadow:inset 3px 0 0 var(--warn)}
.scard.done{opacity:.7}
.scard h3{margin:4px 0 2px;font-size:1.02rem}
.scard .chips{display:flex;flex-wrap:wrap;gap:4px}
.scard .meta{font-size:.84rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.sst{font-weight:700}.sst.over{color:var(--red)}.sst.soon{color:var(--warn)}.sst.done{color:var(--ok)}
.slog{font-size:.84rem;margin-top:6px}.slog summary{cursor:pointer;color:var(--blue)}.slog ul{margin:4px 0 0;padding-left:18px}
.sbars{display:flex;flex-direction:column;gap:6px;margin:6px 0 8px}
.sbar{display:grid;grid-template-columns:28px minmax(0,1fr) 70px;align-items:center;gap:10px}
.sbar .sn{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:800;font-size:.85rem}
.sbar .track{height:14px;background:var(--surface-2);border-radius:999px;overflow:hidden}
.sbar .track i{display:block;height:100%;background:var(--blue);border-radius:999px;min-width:2px}
.sbar b{text-align:right;font-variant-numeric:tabular-nums}
.sbar small{grid-column:2/4;margin-top:-4px;font-size:.76rem;color:var(--muted)}
.schtab td,.schtab th{padding:6px 7px;font-size:.84rem}
.szgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.szgrid label{display:flex;align-items:center;gap:6px}
.szgrid label span{width:26px;height:26px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:800;font-size:.8rem}
.szgrid input{width:100%;min-width:0}
@media (max-width:560px){.szgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.dcard{flex-wrap:wrap}.dact{flex-direction:row;flex-wrap:wrap;width:100%;justify-content:flex-start}.scard{flex-direction:column}.scard .dact{align-items:flex-start;flex-direction:row;flex-wrap:wrap}}
.szin{display:flex;flex-direction:column;min-width:0;flex:1}
.sz-diff{font-size:.72rem;color:var(--muted);min-height:1em;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sz-diff.ok{color:var(--ok);font-weight:700}.sz-diff.warn{color:var(--red);font-weight:700}.sz-diff.info{color:var(--blue);font-weight:600}
.szgrid label{align-items:flex-start}
.szgrid label span{margin-top:7px}
.szmodus{display:flex;gap:8px;flex-wrap:wrap}
.sdbf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:8px}
.sdbf .field{margin:0}
.schtab tfoot td{border-top:2px solid var(--line);background:var(--surface)}
@media (max-width:700px){.sdbf{grid-template-columns:repeat(2,minmax(0,1fr))}}
.autop{border:1px solid var(--line);border-radius:var(--r-s);background:var(--bg);padding:10px 14px;margin:6px 0 16px}
.autop > summary{cursor:pointer;font-weight:600;color:var(--navy)}
.autorow{display:grid;grid-template-columns:minmax(0,1fr) 130px 64px auto auto;gap:6px;align-items:center}
.autorow small{color:var(--muted)}
.autoarten{display:flex;flex-wrap:wrap;gap:4px 16px}
@media (max-width:560px){.autorow{grid-template-columns:minmax(0,1fr) 110px;}.autorow .au-a{grid-column:1/3}}
.autop .bulkrow{display:flex;font-weight:400;font-size:.92rem;text-transform:none;letter-spacing:0;color:var(--ink)}
.autop .bulkrow input[type=checkbox]{width:auto;flex:none}
@media (max-width:560px){.autorow{grid-template-columns:minmax(0,1fr) 64px auto}.autorow .au-a{grid-column:1/4}.autorow small{display:none}}
.wmp{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}
.wmp:last-child{border-bottom:0}
.wmp .avatar{flex:none;margin-top:1px}
.wmt{min-width:0;flex:1}
.wmn{display:flex;align-items:center;gap:8px}
.wmf{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.wmf span{font-size:.78rem;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--blue-soft);color:var(--navy)}
/* Nacht-Update */
.upd{border-color:var(--blue);background:linear-gradient(0deg,var(--blue-soft),var(--blue-soft)),var(--bg);margin-bottom:22px}
.upd .upitem{margin:8px 0}.upd ul{margin:4px 0 0;padding-left:20px}
.uphint{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--blue-soft);color:var(--navy);border-radius:var(--r-s);padding:8px 12px;margin-bottom:14px;font-weight:600;font-size:.92rem}
.vorschaubar{position:sticky;top:0;z-index:100;background:var(--brass,#b8892b);color:#fff;text-align:center;font-weight:700;font-size:.85rem;padding:5px 10px}