/* hol-base — HOL Allianz-Chat (Survive) */
:root{
  --bg:#0b0e14; --bg2:#11161f; --tile:#161d2b; --tile2:#1c2536;
  --mine:#1d3a2e; --mine2:#22503b;
  --line:#26304a; --text:#e7ecf5; --muted:#8b97ad;
  --accent:#f2a33c; --accent2:#ffce7a; --danger:#e15b5b; --ok:#4cc38a;
  --radius:16px; --shadow:0 6px 20px rgba(0,0,0,.35);
  --bg-grad:#16233b;
  --bar:rgba(11,14,20,.85); --bar2:rgba(11,14,20,.55); --mine-name:#bff0d3; --danger-text:#ffb3b3;
  --safe-top:env(safe-area-inset-top,0px); --safe-bot:env(safe-area-inset-bottom,0px);
}
/* Helles Theme */
:root[data-theme="light"]{
  --bg:#eef1f7; --bg2:#ffffff; --tile:#ffffff; --tile2:#e7ecf4;
  --mine:#d3ecdd; --mine2:#bfe3cd;
  --line:#d3d9e4; --text:#18202f; --muted:#5b6577;
  --accent:#e08a1e; --accent2:#b5710f; --danger:#d64545; --ok:#1f9d63;
  --shadow:0 6px 20px rgba(20,30,50,.12);
  --bg-grad:#dfe6f2;
  --bar:rgba(255,255,255,.88); --bar2:rgba(255,255,255,.7); --mine-name:#1f7a4d; --danger-text:#c0392b;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;margin:0}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:radial-gradient(1200px 600px at 50% -10%,var(--bg-grad) 0%,var(--bg) 60%);
  color:var(--text);overflow:hidden;
}
.hidden{display:none!important}
.muted{color:var(--muted)} .small{font-size:.82rem} .center{align-items:center;justify-content:center}
.screen{position:fixed;inset:0;display:flex;flex-direction:column}
.error{background:rgba(225,91,91,.15);border:1px solid var(--danger);color:var(--danger-text);padding:.6rem .8rem;border-radius:12px;margin-top:.8rem;font-size:.9rem}
.hint{margin-top:.6rem;font-size:.85rem;color:var(--muted)}
.hint.ok{color:var(--ok)} .hint.err{color:var(--danger-text)}

/* Marke */
.brand-badge{
  font-weight:900;letter-spacing:1px;color:#141414;
  background:linear-gradient(135deg,var(--accent2),var(--accent));
  padding:.5rem .8rem;border-radius:12px;font-size:1.6rem;box-shadow:var(--shadow);
}
.brand-badge.sm{font-size:1rem;padding:.35rem .55rem;border-radius:10px}
.brand-row{display:flex;gap:.8rem;align-items:center;margin-bottom:1.2rem}
.brand-row h1{margin:0;font-size:1.3rem}
.spinner{width:34px;height:34px;margin-top:1rem;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* Auth */
.auth-card{width:min(92vw,400px);background:var(--tile);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;box-shadow:var(--shadow)}
.form{display:flex;flex-direction:column;gap:.7rem}
.form label{display:flex;flex-direction:column;gap:.3rem;font-size:.85rem;color:var(--muted)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.6rem}
input,select,textarea{
  font:inherit;color:var(--text);background:var(--bg2);border:1px solid var(--line);
  border-radius:12px;padding:.7rem .8rem;outline:none;width:100%;
}
input:focus,select:focus,textarea:focus{border-color:var(--accent)}
.btn{border:none;border-radius:12px;padding:.75rem 1rem;font:inherit;font-weight:700;cursor:pointer;color:#fff}
.btn.primary{background:linear-gradient(135deg,var(--accent2),var(--accent));color:#141414}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
.btn.danger{background:transparent;border:1px solid var(--danger);color:var(--danger-text)}
.btn.small{padding:.5rem .7rem;font-size:.85rem}

/* Topbar */
.topbar{display:flex;justify-content:space-between;align-items:center;gap:.6rem;
  padding:calc(.6rem + var(--safe-top)) .8rem .6rem;background:var(--bar);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line);z-index:5}
.topbar-left{display:flex;align-items:center;gap:.6rem;min-width:0}
.topbar-right{display:flex;align-items:center;gap:.4rem}
.chan-info{display:flex;flex-direction:column;min-width:0}
.chan-select{background:transparent;border:none;color:var(--text);font-weight:800;font-size:1.05rem;padding:.1rem 0;width:auto}
.online-list::-webkit-scrollbar{height:6px}
.chan-switch{position:relative}
.chan-current{display:inline-flex;align-items:center;background:var(--tile2);border:1px solid var(--line);color:var(--text);
  font-weight:800;font-size:1.02rem;border-radius:10px;padding:.15rem .55rem;cursor:pointer;max-width:62vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chan-tabs{display:none;position:absolute;top:calc(100% + 4px);left:0;flex-direction:column;gap:.25rem;
  background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:.35rem;box-shadow:var(--shadow);z-index:30;min-width:160px;max-width:82vw}
.chan-tabs.open{display:flex}
.chan-tab{background:transparent;border:1px solid transparent;color:var(--text);border-radius:8px;padding:.4rem .6rem;
  font-weight:700;font-size:.95rem;cursor:pointer;white-space:nowrap;text-align:left}
.chan-tab.active{background:var(--tile2);border-color:var(--accent);color:var(--accent2)}
@media(min-width:560px){
  .chan-current{display:none}
  .chan-tabs{position:static;display:flex;flex-direction:row;gap:.3rem;background:transparent;border:none;padding:0;box-shadow:none;min-width:0;max-width:none}
  .chan-tab{border-color:var(--line);color:var(--muted);padding:.2rem .6rem;font-size:.92rem}
  .chan-tab.active{color:var(--text)}
}
.read-quick{display:inline-flex;align-items:center;gap:.3rem;margin-top:.15rem;background:var(--tile2);border:1px solid var(--line);border-radius:10px;padding:.12rem .45rem;width:fit-content}
.rq-icon{font-size:.82rem;opacity:.85}
.rq-select{background:transparent;border:none;color:var(--text);font-size:.82rem;font-weight:700;padding:0;width:auto;cursor:pointer}
.rq-select:focus{color:var(--accent)}
.rq-select option{background:var(--bg2);color:var(--text)}
.icon-btn{background:var(--tile2);border:1px solid var(--line);color:var(--text);border-radius:12px;
  width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;font-size:1.15rem;cursor:pointer;padding:0}
.avatar{border-radius:50%;object-fit:cover;background:var(--tile2)}
.avatar.sm{width:34px;height:34px} .avatar.lg{width:84px;height:84px}

/* Nachrichten (Tiles) */
.messages{flex:1;overflow-y:auto;padding:1rem .8rem 1.2rem;display:flex;flex-direction:column;gap:.7rem;scroll-behavior:smooth}
.msg{display:flex;gap:.55rem;max-width:86%;align-items:flex-end}
.msg.mine{align-self:flex-end;flex-direction:row-reverse}
.msg .avatar{width:30px;height:30px;flex:0 0 auto}
.bubble{background:var(--tile);border:1px solid var(--line);border-radius:16px;padding:.55rem .75rem;box-shadow:var(--shadow);position:relative}
.msg.mine .bubble{background:linear-gradient(135deg,var(--mine2),var(--mine));border-color:#2c6a4d}
.bubble .name{font-size:.75rem;font-weight:800;color:var(--accent2);margin-bottom:.15rem}
.msg.mine .bubble .name{color:var(--mine-name)}
.bubble .txt{white-space:pre-wrap;word-break:break-word;line-height:1.35}
.bubble .meta{display:flex;gap:.5rem;align-items:center;margin-top:.25rem;font-size:.68rem;color:var(--muted)}
.bubble img.chat-img{max-width:min(70vw,340px);max-height:340px;border-radius:12px;margin-top:.35rem;display:block;cursor:zoom-in}
.tag{font-size:.62rem;border:1px solid var(--line);border-radius:6px;padding:.02rem .3rem;color:var(--muted)}
.tag.tr{border-color:#3a5db8;color:#9fb8ff}
.orig{margin-top:.3rem;font-size:.8rem;color:var(--muted);border-top:1px dashed var(--line);padding-top:.3rem;display:none}
.orig.show{display:block}
.link-orig{cursor:pointer;color:#9fb8ff}
.daysep{align-self:center;font-size:.72rem;color:var(--muted);background:var(--bg2);border:1px solid var(--line);border-radius:20px;padding:.2rem .7rem;margin:.3rem 0}

/* Composer */
.composer{border-top:1px solid var(--line);background:var(--bar);backdrop-filter:blur(8px);
  padding:.5rem .6rem calc(.5rem + var(--safe-bot))}
.composer-row{display:flex;gap:.4rem;align-items:flex-end}
#msg-input{resize:none;max-height:140px;border-radius:20px}
.icon-btn.send{background:linear-gradient(135deg,var(--accent2),var(--accent));color:#141414;border:none}
.img-preview{position:relative;width:90px;margin-bottom:.5rem}
.img-preview img{width:90px;height:90px;object-fit:cover;border-radius:12px;border:1px solid var(--line)}
.img-preview button{position:absolute;top:-8px;right:-8px;width:24px;height:24px;border-radius:50%;border:none;background:var(--danger);color:#fff;cursor:pointer}
.drop-hint{position:fixed;inset:0;background:var(--bar);display:flex;align-items:center;justify-content:center;
  font-size:1.3rem;color:var(--accent2);border:3px dashed var(--accent);z-index:20;pointer-events:none}

/* Modals */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:flex-end;justify-content:center;z-index:30}
.modal-card{width:min(96vw,480px);max-height:92vh;overflow:auto;background:var(--bg2);border:1px solid var(--line);
  border-radius:20px 20px 0 0;box-shadow:var(--shadow)}
@media(min-width:560px){.modal{align-items:center}.modal-card{border-radius:20px}}
.modal-card.wide{width:min(96vw,720px)}
#user-search{margin-bottom:.3rem}
.user-group{font-size:.78rem;font-weight:800;color:var(--accent2);margin:.6rem 0 .1rem;padding-left:.2rem;letter-spacing:.5px}
.pin-reveal{white-space:pre-line;background:rgba(242,163,60,.12);border:1px solid var(--accent);color:var(--accent2);border-radius:12px;padding:.6rem .8rem;font-weight:700;font-size:.92rem}
.wizard-nav{display:flex;gap:.6rem}
.wizard-nav .btn{flex:1}
.help-sec{margin-bottom:.8rem}
.help-sec h4{margin:0 0 .2rem;font-size:.95rem;color:var(--accent2)}
.help-sec p{margin:0;font-size:.9rem;line-height:1.4;color:var(--text)}

/* Online-Akkordeon */
.online-bar{border-bottom:1px solid var(--line);background:var(--bar2)}
.online-toggle{display:flex;align-items:center;gap:.45rem;width:100%;background:transparent;border:none;color:var(--muted);
  padding:.45rem .9rem;font:inherit;font-size:.82rem;cursor:pointer}
#online-caret{display:inline-block;transition:transform .15s}
.online-toggle.open #online-caret{transform:rotate(90deg)}
.online-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 6px var(--ok);flex:0 0 auto}
.online-count{background:var(--tile2);border:1px solid var(--line);border-radius:10px;padding:0 .45rem;color:var(--text);font-weight:700}
.online-list{display:flex;flex-wrap:wrap;gap:.4rem;padding:.1rem .9rem .6rem}
.online-user{display:flex;align-items:center;gap:.35rem;background:var(--tile);border:1px solid var(--line);border-radius:20px;padding:.15rem .6rem .15rem .2rem;font-size:.8rem}
.online-user img{width:22px;height:22px;border-radius:50%;object-fit:cover}
.online-empty{color:var(--muted);font-size:.8rem;padding:.1rem .9rem .6rem}
.online-user.off{opacity:.75}
.online-user .last{color:var(--muted);font-size:.68rem;margin-left:.15rem}
.online-user .dotm{width:7px;height:7px;border-radius:50%;flex:0 0 auto;margin-right:.1rem}
.online-user .dotm.on{background:var(--ok)}
.online-user .dotm.off{background:var(--muted)}

/* Topbar-Funktionen: rechts eingeklappt, ziehen nach links auf */
#btn-more{display:inline-flex}
.actions{display:flex;align-items:center;gap:.4rem;max-width:0;min-width:0;overflow:hidden;opacity:0;
  transition:max-width .28s ease,opacity .2s ease;pointer-events:none}
.actions.open{max-width:78vw;overflow-x:auto;opacity:1;pointer-events:auto;scrollbar-width:none}
.actions.open::-webkit-scrollbar{display:none}
#btn-more.open{color:var(--accent2);border-color:var(--accent)}

/* Zusammenfassung */
#sum-body{white-space:pre-wrap;line-height:1.45;font-size:.92rem}
.sum-loading{color:var(--muted);display:flex;align-items:center;gap:.5rem}

/* Online + Kanäle auf Desktop in einer Zeile */
@media(min-width:560px){
  .online-bar{display:flex;align-items:center;gap:.5rem}
  #online-caret{display:none}
  .online-toggle{width:auto;flex:0 0 auto}
  .online-list{display:flex!important;flex-wrap:nowrap;overflow-x:auto;flex:1;min-width:0;padding:.3rem .5rem}
}

/* Abstimmungen (Polls) */
.poll-create{display:flex;flex-direction:column;gap:.5rem;background:var(--tile);border:1px solid var(--line);border-radius:12px;padding:.7rem;margin:.5rem 0}
.pl-opt{display:flex;gap:.4rem}
.pl-opt-in{flex:1}
.pl-opt-rm{width:36px;flex:0 0 auto;background:var(--tile2);border:1px solid var(--line);color:var(--text);border-radius:10px;cursor:pointer}
.poll-multi{display:flex;align-items:center;gap:.4rem;font-size:.9rem;color:var(--muted)}
.poll-multi input{width:auto}
.poll-list{display:flex;flex-direction:column;gap:.7rem;margin-top:.6rem}
.poll{background:var(--tile);border:1px solid var(--line);border-radius:12px;padding:.7rem}
.poll-q{font-weight:700;margin-bottom:.4rem;white-space:pre-wrap;word-break:break-word}
.poll .chat-img{max-width:100%;border-radius:10px;margin:.2rem 0}
.poll-opts{display:flex;flex-direction:column;gap:.35rem;margin:.4rem 0}
.poll-opt{position:relative;display:flex;align-items:center;justify-content:space-between;gap:.5rem;border:1px solid var(--line);border-radius:8px;padding:.4rem .55rem;overflow:hidden;cursor:pointer}
.poll-opt.mine{border-color:var(--accent)}
.poll-bar{position:absolute;left:0;top:0;bottom:0;background:rgba(242,163,60,.18);z-index:0}
.poll-opt-in{position:relative;z-index:1;display:flex;align-items:center;gap:.45rem;min-width:0}
.poll-opt-in input{width:auto}
.poll-opt-txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.poll-opt-n{position:relative;z-index:1;font-size:.78rem;color:var(--muted);white-space:nowrap}
.poll-foot{display:flex;justify-content:space-between;align-items:center;gap:.5rem;font-size:.78rem;color:var(--muted);margin-top:.4rem}
.poll-actions{display:flex;gap:.4rem;flex:0 0 auto}

/* Angepinnte Abstimmungen */
.pinned-polls{display:flex;gap:.4rem;overflow-x:auto;padding:.4rem .8rem;border-bottom:1px solid var(--line);background:rgba(242,163,60,.07);scrollbar-width:none}
.pinned-polls::-webkit-scrollbar{display:none}
.pinned-poll{background:var(--tile2);border:1px solid var(--accent);color:var(--accent2);border-radius:20px;padding:.3rem .7rem;white-space:nowrap;cursor:pointer;font-weight:700;font-size:.85rem;flex:0 0 auto;max-width:70vw;overflow:hidden;text-overflow:ellipsis}
.pl-rank{font-size:.75rem;padding:.12rem .3rem;background:var(--bg2);border:1px solid var(--line);color:var(--muted);border-radius:8px;width:auto}
.c-name{max-width:150px}

/* Archiv */
.arch-days{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.5rem;border-bottom:1px solid var(--line);margin-bottom:.5rem;scrollbar-width:none}
.arch-days::-webkit-scrollbar{display:none}
.arch-day{background:var(--tile);border:1px solid var(--line);color:var(--muted);border-radius:10px;padding:.3rem .6rem;white-space:nowrap;cursor:pointer;font-size:.85rem;flex:0 0 auto}
.arch-day.active{border-color:var(--accent);color:var(--accent2)}
.arch-msgs{max-height:62vh;overflow-y:auto;padding:.3rem 0}

/* Emoji-Reaktionen */
.reacts{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.35rem;align-items:center}
.react-chip{background:var(--tile2);border:1px solid var(--line);border-radius:14px;padding:.05rem .45rem;font-size:.78rem;cursor:pointer;color:var(--text);line-height:1.5}
.react-chip.mine{border-color:var(--accent);background:rgba(242,163,60,.16)}
.react-add{background:transparent;border:none;cursor:pointer;font-size:.82rem;opacity:.5;padding:0 .2rem}
.react-add:hover{opacity:1}
.react-pick{display:inline-flex;flex-wrap:wrap;gap:.1rem;background:var(--bg2);border:1px solid var(--line);border-radius:14px;padding:.15rem .35rem;max-width:min(88vw,320px)}
.react-opt{background:transparent;border:none;cursor:pointer;font-size:1.05rem;padding:.05rem .2rem;line-height:1}
.react-opt:hover{transform:scale(1.25)}

/* Beitrag löschen (Admin) */
.msg-del{cursor:pointer;opacity:.45;font-size:.85rem;margin-left:.1rem}
.msg-del:hover{opacity:1}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:1rem 1rem .4rem}
.modal-head h2{margin:0;font-size:1.1rem}
.modal-body{padding:.4rem 1rem 1.4rem;display:flex;flex-direction:column;gap:.7rem}
.modal-body h3{margin:.4rem 0 0;font-size:.95rem}
.modal-body label{display:flex;flex-direction:column;gap:.3rem;font-size:.85rem;color:var(--muted)}
.modal-body hr{border:none;border-top:1px solid var(--line);margin:.4rem 0}
.avatar-edit{display:flex;gap:1rem;align-items:center}
.ov-picker{display:flex;flex-direction:column;gap:.4rem}
.ov-picker-label{font-size:.85rem;color:var(--muted)}
.ov-list{display:flex;flex-wrap:wrap;gap:.5rem}
.ov-item{display:flex;align-items:center;gap:.35rem;background:var(--tile);border:1px solid var(--line);border-radius:10px;padding:.35rem .6rem;font-size:.9rem;cursor:pointer}
.ov-item input{width:auto}
.user-list{display:flex;flex-direction:column;gap:.5rem}
.user-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;background:var(--tile);border:1px solid var(--line);border-radius:12px;padding:.5rem .6rem}
.user-row .avatar{width:36px;height:36px}
.user-row .u-name{font-weight:700;flex:1;min-width:120px}
.u-actions{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:flex-end;margin-left:auto}
.btn.small.on{border-color:var(--accent);color:var(--accent2)}
.user-row .u-name small{display:block;color:var(--muted);font-weight:400}
.u-langs{display:flex;gap:.3rem;margin-top:.25rem}
.u-langs select{font-size:.72rem;padding:.15rem .3rem;color:var(--muted);background:var(--bg2);border:1px solid var(--line);border-radius:8px;width:auto;font-weight:400}
.chip{font-size:.68rem;border:1px solid var(--line);border-radius:6px;padding:.05rem .35rem;color:var(--muted)}
.chip.admin{border-color:var(--accent);color:var(--accent2)}

/* Toast */
.toast{position:fixed;left:50%;bottom:calc(1.2rem + var(--safe-bot));transform:translateX(-50%);
  background:var(--tile2);border:1px solid var(--line);color:var(--text);padding:.7rem 1rem;border-radius:12px;box-shadow:var(--shadow);z-index:50;font-size:.9rem}

/* Minimal-/Overlay-Modus (PiP-Fenster + In-App-Panel) */
.mini-body{display:flex;flex-direction:column;height:100%;background:var(--bg);color:var(--text);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;margin:0}
.mini-inline{position:fixed;right:10px;bottom:10px;width:min(92vw,340px);height:min(70vh,460px);
  border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);z-index:70;overflow:hidden}
.mini-head{display:flex;gap:.4rem;align-items:center;padding:.4rem .5rem;border-bottom:1px solid var(--line);background:var(--bg2)}
.mini-chan{flex:1;background:transparent;border:none;color:var(--text);font-weight:800;font-size:.95rem;padding:.1rem 0}
.mini-close{background:var(--tile2);border:1px solid var(--line);color:var(--text);border-radius:8px;width:30px;height:30px;cursor:pointer;flex:0 0 auto}
.mini-msgs{flex:1;overflow-y:auto;padding:.5rem;display:flex;flex-direction:column;gap:.4rem}
.mini-msg{background:var(--tile);border:1px solid var(--line);border-radius:10px;padding:.35rem .5rem;max-width:92%}
.mini-msg.mine{align-self:flex-end;background:linear-gradient(135deg,var(--mine2),var(--mine));border-color:#2c6a4d}
.mini-nm{font-size:.66rem;font-weight:800;color:var(--accent2);margin-bottom:.1rem}
.mini-msg.mine .mini-nm{color:var(--mine-name)}
.mini-tx{white-space:pre-wrap;word-break:break-word;font-size:.85rem;line-height:1.32}
.mini-img{max-width:100%;border-radius:8px;margin-top:.25rem}
.mini-comp{display:flex;gap:.35rem;padding:.4rem;border-top:1px solid var(--line);background:var(--bg2)}
.mini-comp textarea{flex:1;resize:none;max-height:80px;border-radius:12px;font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--line);padding:.5rem .6rem}
.mini-send{background:linear-gradient(135deg,var(--accent2),var(--accent));color:#141414;border:none;border-radius:12px;width:42px;cursor:pointer;font-size:1.1rem}

/* Install-Button (nur mobil) */
.install-btn{position:fixed;left:50%;bottom:calc(1rem + var(--safe-bot));transform:translateX(-50%);
  background:linear-gradient(135deg,var(--accent2),var(--accent));color:#141414;border:none;
  border-radius:24px;padding:.7rem 1.2rem;font-weight:800;box-shadow:var(--shadow);z-index:55;cursor:pointer}

/* Bild-Lightbox */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.9);display:flex;align-items:center;justify-content:center;z-index:60;cursor:zoom-out}
.lightbox img{max-width:96vw;max-height:96vh;border-radius:8px}

/* ---- Beitrag-Schnellabstimmung (Ja/Nein/Enthaltung am Beitrag) ---- */
.msgvote:empty{display:none}
.msgvote{margin-top:.35rem}
.msg .bubble .name{display:flex;align-items:center;gap:.35rem}
.mv-start{margin-left:auto;background:transparent;border:none;color:var(--muted);
  font-size:.95rem;line-height:1;cursor:pointer;padding:0 .1rem;opacity:.6}
.mv-start:hover{opacity:1;color:var(--accent)}
.mv-voters{margin-top:.35rem;display:flex;flex-direction:column;gap:.15rem}
.mv-vline{font-size:.76rem;color:var(--muted);line-height:1.35}
.mv-head{display:flex;align-items:center;gap:.35rem;font-size:.78rem;color:var(--muted);margin-bottom:.25rem}
.mv-by{color:var(--muted);opacity:.8}
.mv-stop{margin-left:auto;background:transparent;border:none;color:var(--muted);cursor:pointer;font-size:.8rem;line-height:1}
.mv-stop:hover{color:var(--danger)}
.mv-opts{display:flex;gap:.3rem;flex-wrap:wrap}
.mv-opt{display:flex;align-items:center;gap:.35rem;background:var(--tile2);border:1px solid var(--line);
  color:var(--text);border-radius:12px;padding:.2rem .55rem;font-size:.82rem;cursor:pointer}
.mv-opt b{background:var(--tile);border-radius:8px;padding:0 .35rem;font-size:.78rem;min-width:1.1rem;text-align:center}
.mv-opt.mine{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 18%,var(--tile2))}
.mv-opt:hover{border-color:var(--accent)}

/* ---- Spiel-Assistent (Tiles Survive!) ---- */
.modal-head-actions{display:flex;align-items:center;gap:.25rem}
.game-body{display:flex;flex-direction:column;gap:.6rem;max-height:min(72vh,640px)}
.game-log{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.6rem;padding:.2rem;min-height:180px}
.game-intro{color:var(--muted);text-align:center;padding:1.4rem .6rem;font-size:.9rem;line-height:1.5}
.game-msg{display:flex}
.game-msg.user{justify-content:flex-end}
.game-msg.bot{justify-content:flex-start}
.game-bubble{max-width:88%;border-radius:14px;padding:.55rem .7rem;font-size:.92rem;line-height:1.5}
.game-msg.user .game-bubble{background:var(--mine);border:1px solid var(--mine2)}
.game-msg.bot .game-bubble{background:var(--tile);border:1px solid var(--line)}
.game-sources{margin-top:.5rem;padding-top:.4rem;border-top:1px dashed var(--line);display:flex;flex-wrap:wrap;gap:.3rem;align-items:center}
.game-src-label{font-size:.75rem;color:var(--muted)}
a.game-src{font-size:.75rem;color:var(--accent);text-decoration:none;background:var(--tile2);
  border:1px solid var(--line);border-radius:10px;padding:.1rem .45rem;max-width:220px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
a.game-src:hover{border-color:var(--accent)}
.game-actions{margin-top:.5rem;display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.game-chanpick{display:flex;flex-wrap:wrap;gap:.3rem;align-items:center}
.game-pick-lbl{font-size:.78rem;color:var(--muted)}
.game-input{display:flex;gap:.5rem;align-items:flex-end;border-top:1px solid var(--line);padding-top:.5rem}
.game-input textarea{flex:1;resize:none;background:var(--tile);border:1px solid var(--line);color:var(--text);
  border-radius:14px;padding:.55rem .7rem;font:inherit;max-height:120px}

/* ---- Profil: Abschnitts-Titel (Benachrichtigungen / App) ---- */
.pf-title{font-weight:700;margin:.2rem 0 .3rem;font-size:.98rem}
#notif-hint,#install-hint{margin:0 0 .5rem;line-height:1.45}

/* ---- Themen (Labels) pro Channel ---- */
.topic-bar{display:flex;gap:.4rem;overflow-x:auto;padding:.4rem .6rem;border-bottom:1px solid var(--line);
  background:var(--bar2);-webkit-overflow-scrolling:touch}
.topic-bar::-webkit-scrollbar{height:0}
.topic-fchip{flex:0 0 auto;background:var(--tile2);border:1px solid var(--line);color:var(--muted);
  border-radius:14px;padding:.2rem .7rem;font-size:.82rem;cursor:pointer;white-space:nowrap}
.topic-fchip:hover{color:var(--text)}
.topic-fchip.active{background:var(--accent);border-color:var(--accent);color:#12151d;font-weight:700}
.topic-fchip.topic-add{border-style:dashed;color:var(--accent);font-weight:700}
.topic-fchip.topic-add:hover{background:var(--tile2);color:var(--text)}
.u-name .dotm{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:.25rem;vertical-align:middle}
.u-name .dotm.on{background:var(--ok)}
.u-name .dotm.off{background:var(--muted)}
.topic-chip{display:inline-block;margin-left:.5rem;background:var(--tile2);border:1px solid var(--line);
  color:var(--accent);border-radius:10px;padding:0 .45rem;font-size:.7rem;font-weight:600;vertical-align:middle}
.composer-topic{flex:0 0 auto;max-width:9rem;background:var(--tile);border:1px solid var(--line);color:var(--text);
  border-radius:12px;padding:.3rem .4rem;font:inherit;font-size:.85rem}

/* Kanal-Tab mit ungelesenen Nachrichten */
.chan-tab.has-unread{font-weight:700;color:var(--accent2)}

/* ---- Staatenmap (Planungskarte) ---- */
.map-card{max-width:min(96vw,1100px);width:96vw}
.map-body{display:flex;flex-direction:column;gap:.6rem}
.map-toolbar{display:flex;flex-direction:column;gap:.4rem}
.map-trow{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.map-ally{display:inline-flex;align-items:center;gap:.3rem;background:var(--tile2);border:1px solid var(--line);color:var(--text);border-radius:12px;padding:.2rem .5rem;font-size:.82rem;cursor:pointer}
.map-ally .map-adot{width:.8rem;height:.8rem;border-radius:50%;background:var(--ac,#888);border:1px solid rgba(0,0,0,.35);pointer-events:none}
.map-ally.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.map-ally.erase{color:var(--muted)}
.map-type{background:var(--tile2);border:1px solid var(--line);color:var(--text);border-radius:10px;width:2rem;height:1.9rem;font-size:1rem;cursor:pointer}
.map-type.active{border-color:var(--accent);color:var(--accent)}
.map-step{display:inline-flex;align-items:center;gap:.3rem;font-size:.82rem;color:var(--muted)}
.map-step input{width:56px;background:var(--tile);border:1px solid var(--line);color:var(--text);border-radius:8px;padding:.2rem .3rem}
.map-legend{font-size:.75rem;color:var(--muted);margin-left:auto}
.map-wrap{overflow:auto;max-height:58vh;border:1px solid var(--line);border-radius:12px;background:var(--bg2);padding:.5rem;display:flex;justify-content:center}
.map-grid{--mcell:30px;--mgap:10px;display:grid;gap:var(--mgap)}
.map-hole{width:var(--mcell);height:var(--mcell)}
.map-cell{position:relative;width:var(--mcell);height:var(--mcell);border:1px solid var(--line);background:var(--tile);border-radius:4px;cursor:pointer;padding:0;overflow:visible;color:var(--text)}
.map-cell.filled{background:color-mix(in srgb,var(--cc) 55%,transparent);border-color:var(--cc)}
.map-cell>*{pointer-events:none}
/* Verbindungslinien zwischen benachbarten Kacheln */
.map-cell.cr::after{content:"";position:absolute;top:50%;right:calc(-1*var(--mgap) - 1px);width:calc(var(--mgap) + 2px);height:2px;background:var(--line);transform:translateY(-50%);pointer-events:none;z-index:0}
.map-cell.cd::before{content:"";position:absolute;left:50%;bottom:calc(-1*var(--mgap) - 1px);height:calc(var(--mgap) + 2px);width:2px;background:var(--line);transform:translateX(-50%);pointer-events:none;z-index:0}
.mc-abbr{position:absolute;top:0;left:0;right:0;font-size:.5rem;line-height:1.1;text-align:center;font-weight:700;opacity:.9;overflow:hidden;white-space:nowrap}
.mc-icon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.85rem}
.mc-step{position:absolute;bottom:0;right:2px;font-size:.62rem;font-weight:800;color:#fff;text-shadow:0 0 2px #000,0 0 2px #000}
.map-panel{border:1px solid var(--line);border-radius:12px;background:var(--bg2);padding:.6rem;max-height:42vh;overflow:auto}
.map-panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.4rem}
.map-arow{display:flex;gap:.35rem;align-items:center;margin-bottom:.35rem;flex-wrap:wrap}
.map-arow input[type=color]{width:34px;height:30px;padding:0;border:1px solid var(--line);border-radius:6px;background:none;cursor:pointer}
.map-arow input.ma-abbr{width:74px}
.map-arow input.ma-name{flex:1;min-width:90px}
.map-arow input.ma-abbr,.map-arow input.ma-name{background:var(--tile);border:1px solid var(--line);color:var(--text);border-radius:8px;padding:.25rem .4rem}
.map-own{font-size:.78rem;color:var(--muted);display:inline-flex;align-items:center;gap:.25rem}
.map-hrow{display:flex;justify-content:space-between;align-items:center;gap:.5rem;font-size:.82rem;padding:.3rem 0;border-bottom:1px solid var(--line)}

/* ---- Emoji-Auswahl im Composer ---- */
.emoji-panel{display:flex;flex-wrap:wrap;gap:.15rem;max-height:180px;overflow-y:auto;
  background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:.4rem;margin-bottom:.4rem}
.emoji-opt{background:transparent;border:none;cursor:pointer;font-size:1.25rem;line-height:1;padding:.15rem .25rem;border-radius:8px}
.emoji-opt:hover{background:var(--tile2);transform:scale(1.15)}

/* ---- Staatenmap: Diamant-Ansicht + Zugriff ---- */
.map-stage{position:relative;display:inline-block;margin:auto}
.map-grid.diamond{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg)}
.map-grid.diamond .map-cell{border-radius:3px}
.map-grid.diamond .mc-abbr,.map-grid.diamond .mc-icon,.map-grid.diamond .mc-step{transform:rotate(-45deg)}
.map-ro{font-size:.8rem;color:var(--muted)}

/* ---- Staatenmap v1.14: Grundriss-Bild + interaktiver Marker-Layer ---- */
.map-wrap{overflow:auto;max-height:62vh;border:1px solid var(--line);border-radius:12px;background:#fff;padding:6px;display:block}
.map-stage{position:relative;width:100%;max-width:840px;margin:0 auto;display:block}
.map-bg{display:block;width:100%;height:auto;-webkit-user-drag:none;user-select:none}
.map-layer{position:absolute;inset:0;cursor:crosshair}
.map-layer.ro{cursor:default}
.map-mk{position:absolute;transform:translate(-50%,-50%) rotate(45deg);
  background:color-mix(in srgb,var(--cc) 62%,transparent);border:1.5px solid var(--cc);border-radius:3px;
  cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}
.map-mk>*{pointer-events:none}
.mk-in{transform:rotate(-45deg);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.05}
.mk-abbr{font-size:.42rem;font-weight:800;color:#111;max-width:2.6em;overflow:hidden;white-space:nowrap}
.mk-icon{font-size:.72rem}
.mk-step{font-size:.5rem;font-weight:800;color:#111}
.map-arcadia{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;
  font-size:.8rem;font-weight:800;color:#111;background:rgba(255,255,255,.65);border-radius:6px;padding:1px 6px}

/* ---- Staatenmap: größeres Fenster (fast Vollbild) ---- */
.map-card{width:min(98vw,1500px);max-width:none;height:94vh;max-height:94vh;overflow:hidden;display:flex;flex-direction:column}
.map-card .map-body{flex:1;min-height:0;display:flex;flex-direction:column;gap:.5rem}
.map-card .map-wrap{flex:1;min-height:0;max-height:none}
.map-card .map-stage{max-width:min(100%,1200px)}

/* ---- Staatenmap v1.17: Flächen-Füllung (Canvas) + farbige Symbole ---- */
.map-fill{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.map-sym{position:absolute;transform:translate(-50%,-50%);pointer-events:none;font-weight:800;
  display:flex;flex-direction:column;align-items:center;line-height:1;font-size:.95rem;
  text-shadow:0 0 2px #fff,0 0 2px #fff,0 0 2px #fff}
.map-sym b{font-size:.7rem}

/* ---- Dreipunkt-Dropdown-Menü (rechts, kategorisiert) ---- */
.topbar-right{position:relative}
.menu{position:absolute;top:calc(100% + 8px);right:0;background:var(--bg2);border:1px solid var(--line);
  border-radius:14px;box-shadow:var(--shadow);z-index:40;min-width:232px;max-width:88vw;max-height:78vh;overflow:auto;padding:.35rem}
.menu-group{padding:.1rem 0}
.menu-group+.menu-group{border-top:1px solid var(--line);margin-top:.15rem;padding-top:.25rem}
.menu-h{font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:.2rem .6rem .1rem}
.menu-item{display:flex;align-items:center;gap:.55rem;width:100%;background:transparent;border:none;color:var(--text);
  font:inherit;font-size:.95rem;text-align:left;padding:.5rem .6rem;border-radius:10px;cursor:pointer}
.menu-item:hover{background:var(--tile2)}
.menu-group:not(:has(.menu-item:not(.hidden))){display:none}

/* ---- Benutzerverwaltung: Rang-/Gruppen-Filter ---- */
.user-filter{display:flex;flex-wrap:wrap;gap:.35rem;margin:.5rem 0}
.rf-chip{background:var(--tile2);border:1px solid var(--line);color:var(--muted);border-radius:14px;padding:.2rem .6rem;font-size:.82rem;cursor:pointer}
.rf-chip b{color:var(--text);font-weight:800}
.rf-chip.active{background:var(--accent);border-color:var(--accent);color:#12151d}
.rf-chip.active b{color:#12151d}

/* ---- Marken-Lockup "HOL Cave" ---- */
.brand-lockup{display:inline-flex;align-items:center;gap:.45rem}
.brand-lockup.col{flex-direction:column;gap:.45rem}
.brand-cave{font-weight:900;letter-spacing:.18em;text-transform:uppercase;font-size:1rem;line-height:1;
  background:linear-gradient(180deg,#e7edf7 0%,#aab6cc 55%,#6f7d97 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-cave.lg{font-size:1.7rem;letter-spacing:.28em}
:root[data-theme="light"] .brand-cave{background:linear-gradient(180deg,#5b6577,#2b3444);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---- Composer: Themen-Auswahl in eigener Zeile (mobil kein Platzproblem) ---- */
.composer-topicrow{display:flex;align-items:center;gap:.4rem;margin-bottom:.45rem}
.composer-topicrow .ct-label{font-size:.9rem;opacity:.8}
.composer-topicrow:not(:has(.composer-topic:not(.hidden))){display:none}
.composer-topicrow .composer-topic{max-width:none;width:auto;min-width:10rem;flex:0 1 320px}

/* ---- Benutzerverwaltung: inaktive (soft-deleted) Einträge ---- */
.user-row.inactive{opacity:.5}
.user-row.inactive .u-name{color:var(--muted)}

/* ==== Kommentare (Antwort mit Teaser + Sprungmarke) ==================== */
.msg-reply{cursor:pointer;opacity:.5;font-size:.95rem;margin-left:.15rem}
.msg-reply:hover{opacity:1;color:var(--accent2)}
.reply-quote{border-left:3px solid var(--accent);background:rgba(255,255,255,.05);padding:.25rem .5rem;border-radius:6px;margin:.15rem 0 .3rem;font-size:.8rem;cursor:pointer;max-width:100%}
.reply-quote:hover{background:rgba(255,255,255,.09)}
.reply-quote .rq-who{color:var(--accent2);font-weight:700;margin-right:.35rem}
.reply-quote .rq-snip{color:var(--muted)}
.reply-bar{display:flex;align-items:center;gap:.5rem;background:var(--tile);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;padding:.3rem .5rem;margin-bottom:.4rem;font-size:.82rem}
.reply-bar .rb-txt{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.msg.jump-hl>.bubble{animation:jumphl 2.2s ease}
@keyframes jumphl{0%,60%{box-shadow:0 0 0 2px var(--accent),0 0 12px var(--accent)}100%{box-shadow:none}}

/* ==== Checklisten-Thema (Signalfarbe) ================================= */
.topic-fchip.list{background:linear-gradient(135deg,#ffd166,#ef8a17);color:#3a2400;border-color:#ef8a17;font-weight:800}
.topic-fchip.list.active{box-shadow:0 0 0 2px var(--accent2)}
.user-row.topic-islist{border-left:3px solid #ef8a17}

/* ==== Checklisten-Ansicht ============================================= */
.checklist{flex:1;overflow-y:auto;padding:.6rem;display:flex;flex-direction:column;gap:.4rem}
.cl-head{font-weight:800;color:var(--accent2);padding:.2rem .1rem .4rem}
.cl-sep{margin-top:.6rem;font-size:.8rem;color:var(--muted);border-top:1px dashed var(--line);padding-top:.5rem}
.cl-empty{color:var(--muted);font-size:.85rem;padding:.4rem .1rem}
.cl-item{display:flex;align-items:flex-start;gap:.5rem;background:var(--tile);border:1px solid var(--line);border-left:3px solid #ef8a17;border-radius:10px;padding:.5rem .6rem}
.cl-item.done{opacity:.62;border-left-color:var(--ok)}
.cl-item.done .cl-text{text-decoration:line-through}
.cl-check{background:none;border:none;font-size:1.2rem;cursor:pointer;padding:0;line-height:1}
.cl-check:disabled{cursor:default;opacity:.5}
.cl-body{flex:1;min-width:0;cursor:pointer}
.cl-text{white-space:pre-wrap;word-break:break-word}
.cl-meta{font-size:.72rem;color:var(--muted);margin-top:.2rem}
.cl-del{background:none;border:none;cursor:pointer;opacity:.5;font-size:.9rem}
.cl-del:hover{opacity:1}

/* ==== Wissen / Ankündigungen ========================================= */
.menu-badge{display:inline-block;min-width:16px;padding:0 5px;margin-left:6px;border-radius:9px;background:var(--danger);color:#fff;font-size:.7rem;font-weight:800;text-align:center}
.kb-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.6rem}
.kb-areabar{margin-bottom:.4rem}
.kb-tagbar{display:flex;gap:.3rem;flex-wrap:wrap;margin-bottom:.6rem}
.kb-tagf{border:1px solid var(--line);background:var(--tile);color:var(--muted);border-radius:12px;padding:.15rem .55rem;font-size:.78rem;cursor:pointer}
.kb-tagf.active{border-color:var(--accent);color:var(--accent2)}
.kb-list{display:flex;flex-direction:column;gap:.4rem}
.kb-row{background:var(--tile);border:1px solid var(--line);border-radius:10px;padding:.55rem .7rem;cursor:pointer}
.kb-row:hover{border-color:var(--accent)}
.kb-row.unread{border-left:3px solid var(--accent)}
.kb-row-title{font-weight:700}
.kb-row-meta{font-size:.75rem;color:var(--muted);margin-top:.2rem;display:flex;gap:.3rem;flex-wrap:wrap;align-items:center}
.kb-tag{display:inline-block;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:10px;padding:0 .45rem;font-size:.72rem;color:var(--muted)}
.kb-st{display:inline-block;border-radius:8px;padding:0 .4rem;font-size:.68rem;font-weight:800;margin-left:.35rem;vertical-align:middle}
.kb-st.draft{background:#8a6d1e;color:#fff}
.kb-st.upd{background:var(--danger);color:#fff}
.kb-st.read{background:var(--ok);color:#062}
.kb-h{margin:.3rem 0 .2rem}
.kb-meta{font-size:.78rem;color:var(--muted);margin-bottom:.7rem;display:flex;gap:.35rem;flex-wrap:wrap;align-items:center}
.kb-content{display:flex;flex-direction:column;gap:.6rem}
.kb-text{white-space:pre-wrap;word-break:break-word;line-height:1.5}
.kb-img{max-width:100%;border-radius:10px;cursor:zoom-in}
.kb-confirm{text-align:center;padding:1.2rem .6rem;max-width:520px;margin:0 auto}
.kb-confirm h3{margin-bottom:.5rem}
.kb-confirm p{color:var(--muted);margin-bottom:1rem}

/* Block-Editor */
.ed-form{display:flex;flex-direction:column;gap:.5rem}
.ed-title{font-size:1rem;font-weight:700;padding:.5rem}
.ed-lbl{font-size:.75rem;color:var(--muted);font-weight:700;margin-top:.3rem}
.ed-blocks{display:flex;flex-direction:column;gap:.4rem}
.ed-block{position:relative;background:var(--tile);border:1px solid var(--line);border-radius:10px;padding:.4rem;display:flex;gap:.4rem;align-items:flex-start}
.ed-text{flex:1;min-height:44px;resize:vertical;border:none;background:transparent}
.ed-imgv{max-width:calc(100% - 40px);border-radius:8px}
.ed-ctrl{display:flex;flex-direction:column;gap:.15rem}
.ed-ctrl button{background:none;border:1px solid var(--line);border-radius:6px;cursor:pointer;width:26px;height:24px;line-height:1;font-size:.8rem}
.ed-add{display:flex;gap:.5rem;margin-top:.2rem}
.ed-check{display:flex;align-items:center;gap:.4rem;font-size:.85rem}
.ed-save{display:flex;gap:.5rem;justify-content:flex-end;margin-top:.6rem}
.tag-pick{display:flex;gap:.35rem;flex-wrap:wrap}
.tagchip{border:1px solid var(--line);background:var(--tile);color:var(--muted);border-radius:12px;padding:.15rem .55rem;font-size:.8rem;cursor:pointer}
.tagchip.on{background:linear-gradient(135deg,var(--accent2),var(--accent));color:#141414;border-color:var(--accent);font-weight:700}
.tagchip.add{border-style:dashed}

/* ==== Beitrag löschen: rotes Icon + Slide-to-confirm ================== */
.msg-del{cursor:pointer;opacity:.55;font-size:.9rem;margin-left:.15rem;filter:grayscale(.1)}
.msg-del:hover{opacity:1}
.slide-modal .modal-card.slim{max-width:420px}
.slide-hint{color:var(--muted);font-size:.85rem;margin-bottom:.8rem;text-align:center}
.slide-wrap{--p:0%;position:relative;display:flex;align-items:center;gap:.5rem;background:var(--tile);border:1px solid var(--danger);border-radius:26px;padding:.35rem .7rem;overflow:hidden}
.slide-wrap::before{content:"";position:absolute;inset:0;width:var(--p);background:linear-gradient(90deg,rgba(225,91,91,.15),rgba(225,91,91,.45));transition:width .05s linear;pointer-events:none}
.slide-ic,.slide-arrow{position:relative;z-index:1;font-size:1.1rem;color:var(--danger)}
.slide-range{position:relative;z-index:1;flex:1;-webkit-appearance:none;appearance:none;height:30px;background:transparent;cursor:grab}
.slide-range:active{cursor:grabbing}
.slide-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:34px;height:34px;border-radius:50%;background:var(--danger);border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.4);cursor:grab}
.slide-range::-moz-range-thumb{width:34px;height:34px;border-radius:50%;background:var(--danger);border:2px solid #fff;cursor:grab}