/* ============================================================
   ZoF Website – Layout & Seiten (baut auf zof-theme.css auf)
   ============================================================ */
.page{position:relative;z-index:1;display:flex;flex-direction:column;min-height:100vh}
.wrap{width:100%;max-width:1140px;margin:0 auto;padding:0 18px}
main{flex:1;padding:34px 0 60px}

/* ── Navigation ─────────────────────────────────────────── */
.nav{position:sticky;top:0;z-index:50;background:rgba(11,13,15,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.nav .wrap{display:flex;align-items:center;gap:22px;height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none!important;flex-shrink:0}
.brand img{width:38px;height:38px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(57,217,138,.35))}
.brand span{font-size:17px}
.nav-links{display:flex;align-items:center;gap:4px;flex:1}
.nav-links a{font-family:var(--fh);font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);
  padding:8px 12px;border-radius:8px;text-decoration:none!important;transition:.12s;white-space:nowrap}
.nav-links a:hover{color:var(--text-bright);background:var(--bg-card2)}
.nav-links a.on{color:var(--accent);background:var(--accent-dim)}
.nav-links .ext::after{content:' ↗';font-size:10px;opacity:.6}
.nav-right{display:flex;align-items:center;gap:10px;margin-left:auto}
.nav-toggle{display:none;background:none;border:1px solid var(--border);color:var(--text-bright);border-radius:8px;width:40px;height:40px;font-size:18px;cursor:pointer}

.um{position:relative}
.um-btn{display:flex;align-items:center;gap:9px;background:var(--bg-card);border:1px solid var(--border);border-radius:999px;padding:4px 14px 4px 4px;cursor:pointer;color:var(--text-bright);font-family:var(--fh);font-weight:700;font-size:13px}
.um-btn:hover,.um.open .um-btn{border-color:var(--accent)}
.um-btn .av{width:30px;height:30px;border-radius:50%;font-size:12px}
.um-menu{position:absolute;right:0;top:calc(100% + 8px);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);min-width:210px;padding:6px;display:none}
.um.open .um-menu{display:block}
.um-menu a,.um-menu button{display:block;width:100%;text-align:left;background:none;border:none;color:var(--text);font-family:var(--fb);font-size:15px;font-weight:600;padding:9px 12px;border-radius:7px;cursor:pointer;text-decoration:none!important}
.um-menu a:hover,.um-menu button:hover{background:var(--bg-card2);color:var(--accent)}
.um-menu hr{border:none;border-top:1px solid var(--border);margin:5px 0}

/* ── Flash ─────────────────────────────────────────────── */
.flashes{position:fixed;top:76px;right:18px;z-index:80;display:flex;flex-direction:column;gap:8px;max-width:min(420px,calc(100vw - 36px))}
.flash{background:var(--bg-card);border:1px solid var(--border);border-left:4px solid var(--accent);border-radius:var(--r);padding:12px 38px 12px 14px;box-shadow:var(--shadow);font-size:15px;position:relative;animation:fin .25s ease-out}
.flash.success{border-left-color:var(--green)}
.flash.error{border-left-color:var(--red)}
.flash.info{border-left-color:var(--blue)}
.flash button{position:absolute;right:8px;top:8px;background:none;border:none;color:var(--text-dim);font-size:18px;cursor:pointer;line-height:1}
@keyframes fin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ── Karten / Raster ───────────────────────────────────── */
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);padding:22px}
.card + .card{margin-top:18px}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:10px}
.card-h a{font-family:var(--fm);font-size:11px;letter-spacing:.06em;text-transform:none;color:var(--text-dim)}
.card-h a:hover{color:var(--accent)}
.cols{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:22px;align-items:start}
.cols-half{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.stack > * + *{margin-top:18px}
.page-h{margin-bottom:26px}
.page-h h1{font-size:30px}
.page-h p{color:var(--text-dim);margin-top:6px;font-size:16px}
.crumbs{font-family:var(--fm);font-size:12px;color:var(--text-dim);margin-bottom:10px;letter-spacing:.04em}
.crumbs a{color:var(--text-dim)}
.crumbs a:hover{color:var(--accent)}
.muted{color:var(--text-dim)}
.mono{font-family:var(--fm)}
.tag{display:inline-flex;align-items:center;gap:5px;font-family:var(--fh);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border-radius:999px;border:1px solid var(--border);color:var(--text-dim);white-space:nowrap}
.tag.gold{border-color:rgba(255,215,0,.45);color:var(--accent);background:var(--accent-dim);-webkit-text-fill-color:currentColor;filter:none}
.tag.green{border-color:rgba(57,217,138,.45);color:var(--green);background:rgba(57,217,138,.08)}
.tag.red{border-color:rgba(255,71,87,.45);color:var(--red);background:rgba(255,71,87,.08)}
.tag.blue{border-color:rgba(92,158,255,.45);color:var(--blue);background:rgba(92,158,255,.08)}
.tag.discord{border-color:rgba(88,101,242,.6);color:#aab2ff;background:rgba(88,101,242,.12)}

/* ── Startseite ────────────────────────────────────────── */
.hero{text-align:center;padding:30px 0 10px}
.hero .emblem{width:110px;height:110px;object-fit:contain;margin-bottom:18px;filter:drop-shadow(0 0 26px rgba(57,217,138,0.4))}
.hero h1{font-size:44px}
.hero .kicker{margin-top:10px}
.hero-stats{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:30px 0 14px}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:22px}
.servers{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin:40px 0 28px}
.srv{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.srv-top{display:flex;align-items:center;gap:9px}
.srv-top b{font-family:var(--fh);font-weight:700;font-size:15px;color:var(--text-bright);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dot{width:9px;height:9px;border-radius:50%;background:var(--text-dim);flex-shrink:0}
.dot.on{background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 2s infinite}
.dot.off{background:var(--red)}
@keyframes pulse{50%{box-shadow:0 0 3px var(--green)}}
.srv-pl{display:flex;justify-content:space-between;font-family:var(--fm);font-size:12px;color:var(--text-dim)}
.srv-pl b{color:var(--accent);font-family:var(--fh);font-size:16px}
.srv .bar{max-width:none;margin:0}

/* News-Karten */
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:16px}
.news-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;display:flex;flex-direction:column;color:inherit;text-decoration:none!important;transition:.15s}
.news-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--glow)}
.news-cover{aspect-ratio:16/9;background:var(--bg-card2) center/cover no-repeat;position:relative}
.news-cover.none{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#16191e,#0e1013)}
.news-cover.none img{width:56px;opacity:.25}
.news-cover .tag{position:absolute;top:10px;left:10px;background:rgba(0,0,0,.7)}
.news-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.news-body h3{font-family:var(--fh);font-weight:700;font-size:18px;color:var(--text-bright);line-height:1.25}
.news-body p{color:var(--text-dim);font-size:15px;flex:1}
.news-meta{font-family:var(--fm);font-size:11px;color:var(--text-dim);letter-spacing:.04em}
.news-card.big{grid-column:1/-1;flex-direction:row}
.news-card.big .news-cover{flex:1.3;aspect-ratio:auto;min-height:260px}
.news-card.big .news-body{flex:1;padding:26px}
.news-card.big h3{font-size:24px}

/* Aktivität */
.act{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--bg-card2);color:inherit;text-decoration:none!important}
.act:last-child{border-bottom:none}
.act:hover b{color:var(--accent)}
.act-i{width:34px;height:34px;border-radius:8px;background:var(--bg-card2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:16px}
.act-t{flex:1;min-width:0}
.act-t small{font-family:var(--fm);font-size:10px;color:var(--text-dim);letter-spacing:.06em;text-transform:uppercase;display:block}
.act-t b{font-family:var(--fh);font-weight:700;font-size:14px;color:var(--text-bright);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:.12s}
.act-t span{font-size:14px;color:var(--text-dim);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.act-d{font-family:var(--fm);font-size:10px;color:var(--text-dim);white-space:nowrap}
.mini .row{padding:8px 12px;gap:10px}
.mini .av{width:30px;height:30px;font-size:12px}
.mini .val{font-size:16px}
.mini .rk{font-size:15px;width:20px}

/* ── Markdown-Inhalt ───────────────────────────────────── */
.md{font-size:17px;line-height:1.7;color:var(--text)}
.md > * + *{margin-top:14px}
.md h1,.md h2,.md h3,.md h4{font-family:var(--fh);color:var(--text-bright);line-height:1.25;margin-top:28px}
.md h1{font-size:26px}.md h2{font-size:22px}.md h3{font-size:18px;color:var(--accent)}
.md ul,.md ol{padding-left:24px}
.md li + li{margin-top:4px}
.md code{font-family:var(--fm);background:var(--bg-card2);border:1px solid var(--border);border-radius:5px;padding:1px 6px;font-size:14px}
.md pre{background:#07090b;border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;overflow-x:auto}
.md pre code{background:none;border:none;padding:0}
.md blockquote{border-left:3px solid var(--accent);background:var(--accent-dim);padding:10px 16px;border-radius:0 8px 8px 0;color:var(--text-bright)}
.md img{border-radius:var(--r);border:1px solid var(--border)}
.md table{width:100%;border-collapse:collapse;font-size:15px}
.md th,.md td{border:1px solid var(--border);padding:8px 10px;text-align:left}
.md th{background:var(--bg-card2);font-family:var(--fh)}
.md hr{border:none;border-top:1px solid var(--border)}
.article-cover{width:100%;max-height:420px;object-fit:cover;border-radius:var(--rl);border:1px solid var(--border);margin-bottom:24px}
.article-meta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;font-family:var(--fm);font-size:12px;color:var(--text-dim);margin:12px 0 26px}

/* ── Wiki ──────────────────────────────────────────────── */
.wiki-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:26px}
.wtile{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);padding:22px;color:inherit;text-decoration:none!important;transition:.15s;display:block}
.wtile:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--glow)}
.wtile .ic{font-size:28px}
.wtile b{display:block;font-family:var(--fh);font-weight:900;font-size:18px;color:var(--text-bright);margin-top:10px;text-transform:uppercase;letter-spacing:.05em}
.wtile span{color:var(--text-dim);font-size:15px}
.wtile .n{float:right;font-family:var(--fh);font-weight:900;font-size:26px;color:var(--accent)}
.mod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.mod-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;color:inherit;text-decoration:none!important;transition:.15s;display:flex;flex-direction:column}
.mod-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.mod-card .news-cover{aspect-ratio:21/9}
.mod-card .news-body h3{font-size:16px}
.mod-card .tags{display:flex;gap:6px;flex-wrap:wrap}
.timeline{position:relative;padding-left:22px}
.timeline::before{content:'';position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--border)}
.tl-item{position:relative;padding-bottom:22px}
.tl-item::before{content:'';position:absolute;left:-22px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--bg);border:2px solid var(--accent)}
.tl-item h4{font-family:var(--fh);font-size:16px;color:var(--text-bright)}
.tl-item .md{font-size:15px;margin-top:6px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:15px}
.kv dt{color:var(--text-dim);font-family:var(--fm);font-size:12px;text-transform:uppercase;letter-spacing:.06em;padding-top:2px}
.kv dd{color:var(--text-bright);font-weight:600}
.search{display:flex;gap:8px;margin-bottom:18px}
.search input{flex:1}

/* ── Profil ────────────────────────────────────────────── */
.prof-h{display:flex;gap:22px;align-items:center;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);padding:26px;position:relative;overflow:hidden}
.prof-h::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 0 0,rgba(255,215,0,.08),transparent 55%);pointer-events:none}
.prof-h .av{width:96px;height:96px;border-radius:18px;font-size:34px;border:2px solid var(--accent);box-shadow:var(--glow)}
.prof-h h1{font-size:28px}
.prof-sub{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.prof-ing{font-family:var(--fm);font-size:13px;color:var(--text-dim);margin-top:6px}
.prof-ing b{color:var(--text-bright);font-weight:400}
.prof-actions{margin-left:auto;align-self:flex-start;display:flex;gap:8px}
.socials{display:flex;flex-wrap:wrap;gap:8px}
.ranks{display:flex;flex-wrap:wrap;gap:8px}
.rank-b{display:flex;align-items:center;gap:8px;background:var(--bg-card2);border:1px solid rgba(255,215,0,.35);border-radius:var(--r);padding:8px 12px}
.rank-b b{font-family:var(--fh);font-weight:900;color:var(--accent);font-size:18px}
.rank-b span{font-size:13px;color:var(--text-dim);font-family:var(--fh);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.stats-h{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.stat-lists{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;margin-top:20px}
.ticket-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.ticket-tiles .hstat{min-width:0;padding:14px 10px}
.ticket-tiles .hstat .n{font-size:22px}
.lock{display:flex;align-items:center;gap:12px;color:var(--text-dim);font-family:var(--fm);font-size:13px}
.lock span{font-size:24px}

/* Mitglieder */
.members{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.member{display:flex;align-items:center;gap:12px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:12px 14px;color:inherit;text-decoration:none!important;transition:.12s}
.member:hover{border-color:var(--accent);transform:translateY(-1px)}
.member .av{width:46px;height:46px;border-radius:10px}

/* ── Formulare ─────────────────────────────────────────── */
.form-box{max-width:440px;margin:0 auto}
.form-box .card{padding:30px}
.form-box h1{font-size:26px;text-align:center;margin-bottom:6px}
.form-box .sub{text-align:center;color:var(--text-dim);margin-bottom:24px}
.field{margin-bottom:16px}
.field label{display:block;font-family:var(--fh);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);margin-bottom:6px}
.field small{display:block;color:var(--text-dim);font-size:13px;margin-top:5px}
.inp,textarea.inp,select.inp{width:100%;background:var(--bg-card2);border:1px solid var(--border);border-radius:var(--r);color:var(--text-bright);font-family:var(--fb);font-size:16px;font-weight:600;padding:11px 13px;outline:none;transition:.12s}
.inp:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}
textarea.inp{min-height:120px;resize:vertical;line-height:1.5}
textarea.inp.code{font-family:var(--fm);font-size:14px;font-weight:400;min-height:380px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:15px;cursor:pointer;margin-bottom:12px}
.check input{margin-top:4px;accent-color:var(--accent);width:16px;height:16px;flex-shrink:0}
.or{display:flex;align-items:center;gap:12px;color:var(--text-dim);font-family:var(--fm);font-size:11px;letter-spacing:.14em;margin:22px 0;text-transform:uppercase}
.or::before,.or::after{content:'';flex:1;border-top:1px solid var(--border)}
.form-links{display:flex;justify-content:space-between;margin-top:16px;font-size:14px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.conn{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--bg-card2)}
.conn:last-child{border-bottom:none}
.conn-i{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;background:var(--bg-card2);border:1px solid var(--border)}
.conn-t{flex:1;min-width:0}
.conn-t b{font-family:var(--fh);font-weight:700;color:var(--text-bright);display:block}
.conn-t span{color:var(--text-dim);font-size:14px;word-break:break-all}
.editor-tabs{display:flex;gap:6px;margin-bottom:8px}
.preview{min-height:380px;background:var(--bg-card2);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px}
.drop{border:2px dashed var(--border);border-radius:var(--r);padding:16px;text-align:center;color:var(--text-dim);cursor:pointer;transition:.12s;font-size:14px}
.drop:hover,.drop.over{border-color:var(--accent);color:var(--accent)}
.drop img{max-height:160px;border-radius:8px;display:block;margin:0 auto 8px}
.tbl{width:100%;border-collapse:collapse;font-size:15px}
.tbl th{font-family:var(--fh);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);text-align:left;padding:10px;border-bottom:1px solid var(--border)}
.tbl td{padding:11px 10px;border-bottom:1px solid var(--bg-card2);vertical-align:middle}
.tbl tr:hover td{background:rgba(255,255,255,.015)}
.pager{display:flex;gap:6px;justify-content:center;margin-top:26px}
.msg-box{max-width:520px;margin:30px auto;text-align:center}
.msg-box .ic{font-size:50px;margin-bottom:12px}
.msg-box p{color:var(--text-dim);margin:12px 0 22px;font-size:17px}

/* ── Footer ────────────────────────────────────────────── */
.ft{border-top:1px solid var(--border);padding:26px 0;text-align:center;position:relative;z-index:1}
.ft-brand{font-family:var(--fh);font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--text);text-transform:uppercase}
.ft-links{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:10px;font-family:var(--fm);font-size:11px;letter-spacing:.06em}
.ft-links a{color:var(--text-dim)}
.ft-links a:hover{color:var(--accent)}

/* ── Responsive ────────────────────────────────────────── */
@media (max-width: 960px){
  .cols{grid-template-columns:minmax(0,1fr)}
  .news-card.big{flex-direction:column}
  .news-card.big .news-cover{aspect-ratio:16/9;min-height:0}
}
@media (max-width: 820px){
  .nav-toggle{display:block}
  .nav-links{position:fixed;top:64px;left:0;right:0;background:var(--bg);border-bottom:1px solid var(--border);flex-direction:column;align-items:stretch;padding:10px 16px 16px;display:none}
  .nav-links.open{display:flex}
  .nav-links a{padding:12px}
  .um-btn .um-name{display:none}
  .um-btn{padding:4px}
  .wiki-tiles{grid-template-columns:1fr}
  .cols-half,.form-row{grid-template-columns:1fr}
}
@media (max-width: 600px){
  .hero h1{font-size:30px}
  .hstat{min-width:0;flex:1 1 calc(50% - 12px);padding:14px 10px}
  .hstat .n{font-size:22px}
  .prof-h{flex-direction:column;text-align:center}
  .prof-sub{justify-content:center}
  .prof-actions{margin:0;align-self:center}
  .card{padding:18px}
  .tbl .hide-sm{display:none}
  .brand span{display:none}
}
.card .av.big{width:88px;height:88px;margin:0 auto;border-radius:16px;font-size:30px;border:2px solid var(--accent)}
.news-card.big .news-cover.none img{width:110px}
.cols-half > .card{margin-top:0}

/* ============================================================
   Übersichtlichkeits-Pass (v2)
   Weniger Kästen, klare Abschnitts-Überschriften, ruhigere Labels
   ============================================================ */
main{padding-top:28px}

/* Abschnitts-Überschrift statt Mini-Label in Gold-Caps */
.sh{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}
.sh h2{font-family:var(--fh);font-weight:700;font-size:21px;color:var(--text-bright);letter-spacing:.01em}
.sh > a{font-size:14px;font-weight:600;color:var(--text-dim)}
.sh > a:hover{color:var(--accent);text-decoration:none}

/* Karten-Überschriften überall ruhiger: Satzschreibung, heller statt Gold-Caps */
.card-h{font-family:var(--fh);font-size:16px;font-weight:700;text-transform:none;letter-spacing:.01em;color:var(--text-bright);margin-bottom:14px}
.card-h a{font-family:var(--fb);font-size:14px;font-weight:600}
.dis h4{font-size:14px;text-transform:none;letter-spacing:.01em;color:var(--text-bright)}
.field label{text-transform:none;letter-spacing:.01em;font-size:13px;color:var(--text)}

/* ── Hero: kompakt, linksbündig ── */
.hero2{background:linear-gradient(180deg,rgba(255,215,0,.05),transparent 70%),var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);padding:26px 28px 20px}
.hero2-main{display:flex;align-items:center;gap:20px}
.hero2-logo{width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 0 18px rgba(57,217,138,.35));flex-shrink:0}
.hero2 h1{font-size:34px}
.hero2-sub{color:var(--text-dim);font-size:17px;margin-top:4px}
.hero2-cta{margin-left:auto;display:flex;gap:10px;flex-shrink:0}
.srv-strip{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;padding-top:18px;border-top:1px solid var(--border)}
.srv-pill{display:flex;align-items:center;gap:8px;background:var(--bg-card2);border:1px solid var(--border);border-radius:999px;padding:6px 14px 6px 12px;font-size:15px}
.srv-pill b{font-family:var(--fh);font-weight:700;color:var(--text-bright);font-size:14px}
.srv-pill span:last-child{font-family:var(--fh);font-weight:700;color:var(--accent)}
.srv-pill.off span:last-child{color:var(--text-dim);font-weight:600}

/* ── Zahlenleiste: eine Leiste statt fünf Kacheln ── */
.statbar{display:grid;grid-template-columns:repeat(4,1fr);margin:16px 0 36px;border:1px solid var(--border);border-radius:var(--rl);background:var(--bg-card);overflow:hidden}
.statbar > div{padding:14px 18px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.statbar > div + div{border-left:1px solid var(--border)}
.statbar b{font-family:var(--fh);font-weight:900;font-size:24px;color:var(--accent);line-height:1}
.statbar span{color:var(--text-dim);font-size:15px}

/* ── Startseiten-Raster ── */
.home-grid{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:36px;align-items:start}

/* Aufmacher-News */
.feat{display:grid;grid-template-columns:1.1fr 1fr;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;color:inherit;text-decoration:none!important;transition:border-color .15s}
.feat:hover{border-color:rgba(255,215,0,.5)}
.feat.no-img{grid-template-columns:1fr;border-left:3px solid var(--accent)}
.feat-img{background:var(--bg-card2) center/cover no-repeat;min-height:240px}
.feat-body{padding:24px 26px;display:flex;flex-direction:column;gap:10px}
.feat-body h3{font-family:var(--fh);font-weight:700;font-size:26px;line-height:1.2;color:var(--text-bright)}
.feat-body p{color:var(--text);font-size:16px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.meta{display:flex;align-items:center;gap:10px;color:var(--text-dim);font-size:14px}
.readmore{margin-top:auto;font-weight:700;color:var(--accent);font-size:15px}
.feat:hover .readmore{text-decoration:underline}

/* Weitere News als ruhige Liste */
.nlist{margin-top:14px;border:1px solid var(--border);border-radius:var(--rl);background:var(--bg-card);overflow:hidden}
.nrow{display:flex;align-items:center;gap:14px;padding:14px 18px;color:inherit;text-decoration:none!important}
.nrow + .nrow{border-top:1px solid var(--border)}
.nrow:hover{background:var(--bg-card2)}
.nrow:hover b{color:var(--accent)}
.nrow-img{width:88px;height:56px;border-radius:8px;background:var(--bg-card2) center/cover no-repeat;flex-shrink:0}
.nrow-t{flex:1;min-width:0}
.nrow-t b{display:block;font-family:var(--fh);font-weight:700;font-size:16px;color:var(--text-bright);transition:color .12s}
.nrow-t span{display:block;color:var(--text-dim);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nrow time{color:var(--text-dim);font-size:14px;white-space:nowrap}

/* Wiki-Aktivität: Typ als farbiger Text statt Emoji-Kachel */
.card.tight{padding:6px 18px}
.wact{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:12px 0;color:inherit;text-decoration:none!important}
.wact + .wact{border-top:1px solid var(--border)}
.wact-type{font-size:13px;font-weight:700;color:var(--text-dim)}
.wact-type.t-mod_update{color:var(--blue)}
.wact-type.t-mod{color:var(--green)}
.wact-type.t-howto{color:var(--accent)}
.wact-type.t-changelog{color:#c9a0ff}
.wact b{grid-column:1;font-family:var(--fh);font-weight:700;font-size:15px;color:var(--text-bright);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wact time{grid-column:2;grid-row:1 / span 2;align-self:center;color:var(--text-dim);font-size:13px;white-space:nowrap}
.wact:hover b{color:var(--accent)}

/* Bestenliste: flache Zeilen im Kasten */
.mini .list{gap:0}
.mini .row{border:none;border-radius:0;background:none;padding:10px 0}
.mini .row + .row{border-top:1px solid var(--border)}
.mini .row.t1{border-color:var(--border)}
a.row:hover{transform:none}
.mini a.row:hover b{color:var(--accent)}
.card-foot{display:block;text-align:center;padding:12px 0;border-top:1px solid var(--border);font-size:14px;font-weight:600;color:var(--text-dim)}
.card-foot:hover{color:var(--accent);text-decoration:none}

/* Umschalter */
.seg{display:inline-flex;background:var(--bg-card2);border:1px solid var(--border);border-radius:8px;padding:2px}
.seg button{background:none;border:none;color:var(--text-dim);font-family:var(--fb);font-weight:700;font-size:14px;padding:5px 12px;border-radius:6px;cursor:pointer}
.seg button.on{background:var(--accent);color:#000}

.join{margin-top:22px;padding:16px 18px;border:1px dashed var(--border-hi);border-radius:var(--rl);display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.join p{color:var(--text-dim);font-size:15px}

/* Sichtbarer Tastatur-Fokus */
a:focus-visible,button:focus-visible,.inp:focus-visible,.sel:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

@media (max-width: 960px){
  .home-grid{grid-template-columns:minmax(0,1fr)}
  .hero2-main{flex-wrap:wrap}
  .hero2-cta{margin-left:0;width:100%}
}
@media (max-width: 700px){
  .statbar{grid-template-columns:1fr 1fr}
  .statbar > div:nth-child(3){border-left:none}
  .statbar > div:nth-child(n+3){border-top:1px solid var(--border)}
  .feat{grid-template-columns:1fr}
  .feat-img{min-height:180px}
  .hero2{padding:20px}
  .hero2 h1{font-size:26px}
  .hero2-logo{width:54px;height:54px}
  .nrow-img{display:none}
  .nrow time{display:none}
}

/* ── Profil v2 ── */
.prof-meta{display:flex;flex-wrap:wrap;gap:4px 16px;color:var(--text-dim);font-size:15px;margin-top:6px}
.prof-meta b{color:var(--text-bright);font-weight:700}
.prof-sub{margin-top:12px}
.rank-b{background:var(--accent-dim);border-color:rgba(255,215,0,.3);padding:6px 12px;font-size:14px;font-weight:600;color:var(--text)}
.rank-b b{font-size:15px}
.kstats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r);overflow:hidden}
.kstats > div{background:var(--bg-card2);padding:16px 18px}
.kstats b{display:block;font-family:var(--fh);font-weight:900;font-size:26px;color:var(--accent);line-height:1.1}
.kstats span{color:var(--text-dim);font-size:14px}
.sgroups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:24px}
.sgroups.lists{padding-top:22px;border-top:1px solid var(--border)}
.sgroups h4{font-family:var(--fh);font-size:15px;font-weight:700;color:var(--text-bright);margin-bottom:8px}
.sgroups dl,.kv2{display:grid;grid-template-columns:1fr auto;gap:0;font-size:15px}
.sgroups dt,.kv2 dt{color:var(--text-dim);padding:6px 0;border-bottom:1px solid var(--border);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sgroups dd,.kv2 dd{color:var(--text-bright);font-weight:700;text-align:right;padding:6px 0 6px 12px;border-bottom:1px solid var(--border);white-space:nowrap}
.sgroups dt small{color:var(--blue);font-size:12px;font-weight:700;margin-left:4px}
.kv2 small{color:var(--text-dim);font-weight:400}
.socials .chip{text-transform:none;font-size:14px;letter-spacing:0}
.hero2-cta .btn{white-space:nowrap}
@media (max-width: 700px){
  .kstats{grid-template-columns:1fr 1fr}
  .sgroups{grid-template-columns:1fr}
  .hero2-cta .btn{flex:1;padding:12px 10px}
}

/* ── Server-Karten (v3) ── */
.srv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-top:22px;padding-top:20px;border-top:1px solid var(--border)}
.srv2{background:var(--bg-card2);border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;display:flex;flex-direction:column;gap:9px}
.srv2.off{opacity:.6}
.srv2-top{display:flex;justify-content:space-between;align-items:center}
.srv2-state{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:var(--green)}
.srv2.off .srv2-state{color:var(--red)}
.srv2-pl{color:var(--text-dim);font-size:15px}
.srv2-pl b{font-family:var(--fh);font-weight:900;font-size:20px;color:var(--accent)}
.srv2 h3{font-family:var(--fh);font-weight:700;font-size:18px;color:var(--text-bright);line-height:1.2}
.srv2 .bar{max-width:none;margin:0;height:6px}
.srv2 .bar.full span{background:var(--red)}
.srv2-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:14px;color:var(--text-dim)}
.srv2-ip{background:none;border:1px dashed var(--border-hi);color:var(--text);font-family:var(--fm);font-size:12px;padding:3px 8px;border-radius:6px;cursor:pointer;white-space:nowrap}
.srv2-ip:hover{border-color:var(--accent);color:var(--accent)}

/* ── Einstellungen ── */
.checks{display:flex;gap:6px 22px;flex-wrap:wrap}
.checks .check{margin:0}
.sticky-side{position:sticky;top:84px}
@media (max-width: 960px){ .sticky-side{position:static} }
.field .checks .check{display:flex;align-items:center;gap:8px;margin:0;font-size:15px;font-weight:600;color:var(--text)}
.field .checks .check input{margin:0}
.field .checks small{margin:0 0 0 4px;display:inline}

/* ============================================================
   Community (v5)
   ============================================================ */
.mt{margin-top:32px}
.row-h{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.article-title{font-family:var(--fh);font-weight:700;font-size:30px;line-height:1.2;color:var(--text-bright);margin:6px 0 14px}
h1.gold.article-title{text-transform:none;letter-spacing:.02em}
.linkbtn{background:none;border:none;color:var(--text-dim);font-family:var(--fb);font-size:14px;font-weight:600;cursor:pointer;padding:0}
.linkbtn:hover{color:var(--accent)}
.linkbtn:disabled{opacity:.6;cursor:default}
.empty-cta{padding:28px;text-align:center;color:var(--text-dim)}
.plain{padding-left:18px;font-size:15px}.plain li+li{margin-top:6px}
.note{background:var(--accent-dim);border:1px solid rgba(255,215,0,.3);border-radius:var(--r);padding:12px 16px;margin-top:14px;font-size:15px}
.row-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:14px}
.mbadge{background:var(--red);color:#fff;border-radius:999px;padding:0 7px;font-size:12px;margin-left:4px}

/* Bereichs-Reiter */
.ctabs{display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid var(--border);margin:-6px 0 26px;scrollbar-width:none}
.ctabs::-webkit-scrollbar{display:none}
.ctabs a{padding:10px 14px;color:var(--text-dim);font-weight:700;font-size:15px;white-space:nowrap;border-bottom:2px solid transparent;margin-bottom:-1px;text-decoration:none!important}
.ctabs a:hover{color:var(--text-bright)}
.ctabs a.on{color:var(--accent);border-bottom-color:var(--accent)}

/* Segment-Umschalter mit Links/Radios */
.seg a,.seg label{color:var(--text-dim);font-weight:700;font-size:14px;padding:5px 12px;border-radius:6px;cursor:pointer;text-decoration:none!important;display:inline-flex;align-items:center;gap:6px}
.seg a.on,.seg label:has(input:checked){background:var(--accent);color:#000}
.seg label input{position:absolute;opacity:0;pointer-events:none}
.seg.full{display:flex}.seg.full label{flex:1;justify-content:center}
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}

/* Glocke */
.bell{position:relative}
.bell-btn{position:relative;background:var(--bg-card);border:1px solid var(--border);color:var(--text);width:40px;height:40px;border-radius:999px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.bell-btn:hover,.bell.open .bell-btn{border-color:var(--accent);color:var(--accent)}
.bell-n{position:absolute;top:-4px;right:-4px;background:var(--red);color:#fff;font-size:11px;font-weight:700;min-width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px}
.bell-menu{position:absolute;right:0;top:calc(100% + 8px);width:min(360px,calc(100vw - 24px));max-height:70vh;overflow-y:auto;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);display:none;z-index:60}
.bell.open .bell-menu{display:block}
.bell-h{padding:12px 14px;border-bottom:1px solid var(--border);color:var(--text-bright)}
.bell-i{display:block;padding:11px 14px;border-bottom:1px solid var(--border);color:var(--text);text-decoration:none!important;font-size:15px}
.bell-i:hover{background:var(--bg-card2)}
.bell-i.new{border-left:3px solid var(--accent)}
.bell-i time{display:block;color:var(--text-dim);font-size:13px;margin-top:2px}
.bell-empty{padding:18px 14px;color:var(--text-dim);font-size:14px}

/* Kommentare & Pinnwand */
.comments{margin-top:30px}
.clist{display:flex;flex-direction:column}
.cmt{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--border)}
.cmt .av{width:36px;height:36px;border-radius:50%;font-size:13px}
.cmt-b{flex:1;min-width:0}
.cmt-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:15px}
.cmt-h a{color:var(--text-bright)}
.cmt-h time{color:var(--text-dim);font-size:13px}
.cmt-act{margin-left:auto;display:flex;gap:12px;opacity:0;transition:opacity .12s}
.cmt:hover .cmt-act,.cmt:focus-within .cmt-act{opacity:1}
@media (hover:none){.cmt-act{opacity:1}}
.cmt-t{margin-top:4px;font-size:16px;line-height:1.55;word-wrap:break-word}
.cform{display:flex;gap:12px;align-items:flex-start;margin-top:16px}
.cform .av{width:36px;height:36px;border-radius:50%;font-size:13px;flex-shrink:0}
.cform textarea{min-height:46px;flex:1}
.card .cform{margin:0 0 6px}

/* Reaktionen */
.reacts{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.row-actions .reacts{margin-top:0}
.react{display:inline-flex;align-items:center;gap:5px;background:var(--bg-card);border:1px solid var(--border);border-radius:999px;padding:4px 10px;cursor:pointer;color:var(--text);font-size:15px;line-height:1.2}
.react b{font-size:13px}
.react:hover:not(:disabled){border-color:var(--accent)}
.react.on{border-color:var(--accent);background:var(--accent-dim)}
.react.zero{opacity:.55}
.react.zero:hover{opacity:1}
.react:disabled{cursor:default}

/* Avatar-Reihen */
.avatars{display:flex;flex-wrap:wrap;gap:6px}
.avatars .av{width:36px;height:36px;border-radius:50%;font-size:12px}
.avatars.sm .av{width:28px;height:28px;font-size:11px}
.avatars.dim{opacity:.7}
.who{display:flex;align-items:center;gap:10px}
.who .av{width:32px;height:32px;border-radius:8px;font-size:12px}
.who span{display:block;font-size:13px}
.who a{color:var(--text-bright)}

/* Events */
.ev-list{display:flex;flex-direction:column;gap:8px}
.ev-row{display:flex;align-items:center;gap:14px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:10px 14px;color:inherit;text-decoration:none!important}
.ev-row:hover{border-color:rgba(255,215,0,.5)}
.ev-date{width:50px;text-align:center;flex-shrink:0;border-right:1px solid var(--border);padding-right:12px}
.ev-date b{display:block;font-family:var(--fh);font-weight:900;font-size:22px;color:var(--accent);line-height:1}
.ev-date span{font-size:13px;color:var(--text-dim);font-weight:700}
.ev-date.live b{font-size:14px;color:var(--red)}
.ev-t{flex:1;min-width:0}
.ev-t b{display:block;font-family:var(--fh);font-weight:700;color:var(--text-bright);font-size:16px}
.ev-t span{color:var(--text-dim);font-size:14px}
.ev-row em{font-style:normal;color:var(--text-dim);font-size:14px;white-space:nowrap}
.ev-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:16px}
.ev-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;color:inherit;text-decoration:none!important;display:flex;flex-direction:column}
.ev-card:hover{border-color:rgba(255,215,0,.5)}
.ev-cover{height:150px;background:linear-gradient(135deg,#1c2027,#0e1013) center/cover no-repeat;position:relative}
.ev-badge{position:absolute;left:14px;bottom:-22px;background:var(--bg-card);border:1px solid var(--accent);border-radius:10px;width:56px;text-align:center;padding:6px 0}
.ev-badge b{display:block;font-family:var(--fh);font-weight:900;font-size:22px;color:var(--accent);line-height:1}
.ev-badge span{font-size:12px;font-weight:700;color:var(--text-dim)}
.ev-body{padding:30px 18px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.ev-body h3{font-family:var(--fh);font-weight:700;font-size:19px;color:var(--text-bright)}
.ev-body p{font-size:15px}
.ev-count{margin-top:auto;padding-top:8px;font-weight:700;color:var(--accent);font-size:14px}
.ev-when{display:flex;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;margin-bottom:18px}
.ev-when > div{flex:1;background:var(--bg-card);padding:12px 16px}
.ev-when b{display:block;color:var(--text-bright);font-family:var(--fh);font-weight:700}
.ev-when span{color:var(--text-dim);font-size:14px}
.rsvp{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* Ideen */
.idea{display:flex;align-items:center;gap:14px;padding:12px 16px}
.idea + .idea{border-top:1px solid var(--border)}
.idea.big{padding:0;margin:8px 0 16px;align-items:flex-start}
.upvote{display:flex;flex-direction:column;align-items:center;justify-content:center;width:52px;height:56px;flex-shrink:0;background:var(--bg-card2);border:1px solid var(--border);border-radius:10px;color:var(--text-dim);cursor:pointer}
.upvote span{font-size:12px;line-height:1}
.upvote b{font-family:var(--fh);font-size:18px;color:var(--text-bright)}
.upvote:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}
.upvote.on{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}
.upvote.on b{color:var(--accent)}
.upvote:disabled{cursor:default}
.idea-t{flex:1;min-width:0;color:inherit;text-decoration:none!important}
.idea-t b{display:block;font-family:var(--fh);font-weight:700;font-size:16px;color:var(--text-bright)}
a.idea-t:hover b{color:var(--accent)}
.idea-t span{color:var(--text-dim);font-size:14px}
.kind{font-style:normal;font-weight:700;color:var(--accent)}
.kind.bug{color:#c9a0ff}

/* Screenshots */
.shots-bar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);padding:14px 18px;margin-bottom:18px}
.shots-bar > div:not(.seg) b{display:block;font-family:var(--fh);font-weight:900;color:var(--accent);font-size:18px}
.shots-bar > div:not(.seg) span{color:var(--text-dim);font-size:14px}
.shot-up{margin-left:auto;display:flex;gap:8px;align-items:center}
.shot-up .inp{width:190px;padding:8px 10px;font-size:15px}
.shot-up label.btn{cursor:pointer}
.shot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:14px}
.shot-grid.small{grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr))}
.shot{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden}
.shot.win{border-color:rgba(255,215,0,.4)}
.shot-img{display:block;aspect-ratio:16/10;background:var(--bg-card2) center/cover no-repeat;transition:filter .15s}
.shot-img:hover{filter:brightness(1.1)}
.shot-b{display:flex;align-items:center;gap:10px;padding:10px 12px}
.shot-t{flex:1;min-width:0}
.shot-t b{display:block;color:var(--text-bright);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shot-t span{color:var(--text-dim);font-size:13px}
.vote{display:inline-flex;align-items:center;gap:5px;background:var(--bg-card2);border:1px solid var(--border);border-radius:8px;padding:5px 10px;color:var(--text-dim);font-size:13px;cursor:pointer;white-space:nowrap}
.vote b{color:var(--text-bright);font-size:15px}
.vote:hover:not(.static){border-color:var(--accent);color:var(--accent)}
.vote.on{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}
.vote.on b{color:var(--accent)}
.vote.static{cursor:default}
.vote.big{padding:10px 16px;font-size:15px}.vote.big b{font-size:20px}
.shot-full{margin:0 0 16px;background:#000;border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;text-align:center}
.shot-full img{max-height:78vh;width:auto;display:block;margin:0 auto}
.shot-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.shot-meta a{color:var(--text-bright)}

/* Clans, Duelle, Tabellen */
.tbl tr.click{cursor:pointer}
.clan-tag{font-family:var(--fm);font-size:12px;color:var(--accent);border:1px solid rgba(255,215,0,.4);border-radius:5px;padding:1px 5px}
.clan-av{width:96px;height:96px;border-radius:18px;font-size:30px;border:2px solid var(--accent);color:var(--accent)}
.prof-clans{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.prof-clans .chip{text-transform:none;letter-spacing:0;font-size:13px}
.rank-n{font-family:var(--fh);font-weight:900;color:var(--text-dim)}
.rank-n.r1{color:#ffd700}.rank-n.r2{color:#c8d0dc}.rank-n.r3{color:#cd7f32}
.duel{padding:10px 0;font-size:15px}
.duel + .duel{border-top:1px solid var(--border)}
.duel a{color:var(--text-bright)}
.duel time{display:block;color:var(--text-dim);font-size:13px}

/* Erfolge */
.ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:10px}
.ach{display:flex;gap:14px;align-items:center;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:12px 14px}
.ach-ic{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;background:var(--bg-card2);border:2px solid var(--border)}
.ach.t1 .ach-ic{border-color:#a0704a}.ach.t2 .ach-ic{border-color:#aab4c2}.ach.t3 .ach-ic{border-color:var(--accent);box-shadow:0 0 14px rgba(255,215,0,.25)}
.ach.locked{opacity:.45}.ach.locked .ach-ic{filter:grayscale(1)}
.ach.have{border-color:rgba(255,215,0,.35)}
.ach-t b{display:block;color:var(--text-bright);font-family:var(--fh);font-weight:700}
.ach-t span{display:block;font-size:15px}
.ach-t small{color:var(--text-dim);font-size:13px}
.ach-row{display:flex;flex-wrap:wrap;gap:8px}
.ach-chip{display:inline-flex;align-items:center;gap:7px;background:var(--bg-card2);border:1px solid var(--border);border-radius:999px;padding:5px 12px 5px 6px;font-size:14px;font-weight:700;color:var(--text-bright)}
.ach-chip span{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--bg);font-size:14px}
.ach-chip.t3{border-color:rgba(255,215,0,.5)}.ach-chip.t2{border-color:#6f7885}

/* Profil: Folgen */
.prof-actions{display:flex;align-items:center;gap:14px}
.fcount{text-align:center}
.fcount b{display:block;font-family:var(--fh);font-weight:900;font-size:20px;color:var(--text-bright);line-height:1}
.fcount span{font-size:13px;color:var(--text-dim)}

/* Feed */
.feed-i{display:flex;gap:10px;align-items:flex-start;padding:10px 0;color:inherit;text-decoration:none!important;font-size:15px}
.feed-i + .feed-i{border-top:1px solid var(--border)}
.feed-i b{color:var(--text-bright)}
.feed-i time{margin-left:auto;color:var(--text-dim);font-size:13px;white-space:nowrap}
.feed-ic{width:26px;flex-shrink:0;text-align:center}

/* Meldungen */
.report-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.report blockquote{border-left:3px solid var(--border-hi);padding:6px 12px;color:var(--text);margin-bottom:8px;white-space:pre-wrap;word-wrap:break-word}
.report-a{display:flex;gap:8px;margin-top:10px}

@media (max-width: 700px){
  .ev-when{flex-direction:column}
  .shot-up{margin-left:0;width:100%}
  .shot-up .inp{flex:1;width:auto}
  .cmt-act{margin-left:0}
  .prof-actions{justify-content:center}
  .bell-menu{position:fixed;left:12px;right:12px;top:70px;width:auto}
}
.md > :first-child{margin-top:0}

/* ── Serverliste einklappbar ── */
.srv-box{margin-top:20px;padding-top:16px;border-top:1px solid var(--border)}
.srv-sum{width:100%;display:flex;align-items:center;gap:16px;background:var(--bg-card2);border:1px solid var(--border);border-radius:var(--r);padding:10px 14px;color:var(--text);font-family:var(--fb);font-size:15px;cursor:pointer;text-align:left}
.srv-sum:hover{border-color:rgba(255,215,0,.5)}
.srv-sum > .js-srvsum{flex:1;min-width:0;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.srv-sum-total{white-space:nowrap;color:var(--text-dim)}
.srv-sum-total b{font-family:var(--fh);font-weight:900;font-size:18px;color:var(--accent)}
.srv-sum-list{display:flex;flex-wrap:wrap;gap:6px 14px}
.srv-mini{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--text-bright);white-space:nowrap}
.srv-mini em{font-style:normal;font-weight:600;color:var(--text-dim);font-size:14px}
.srv-mini.off{color:var(--text-dim);font-weight:600}
.srv-mini .dot{width:8px;height:8px}
.srv-sum-tog{display:inline-flex;align-items:center;gap:6px;color:var(--text-dim);font-weight:700;font-size:14px;flex-shrink:0}
.srv-sum-tog svg{transition:transform .2s}
.srv-box.open .srv-sum-tog svg{transform:rotate(180deg)}
.srv-sum:hover .srv-sum-tog{color:var(--accent)}
.srv-box .srv-grid{margin-top:12px;padding-top:0;border-top:none}
@media (max-width: 600px){ .srv-sum-lbl{display:none} }
.srv-box .srv-grid[hidden]{display:none}

/* ============================================================
   Fotoalben
   ============================================================ */
.alb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr));gap:14px}
.alb-grid.small{grid-template-columns:repeat(auto-fill,minmax(min(170px,100%),1fr));gap:10px}
.alb{display:block;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;color:inherit;text-decoration:none!important}
.alb:hover{border-color:rgba(255,215,0,.5)}
.alb-img{position:relative;aspect-ratio:4/3;background:var(--bg-card2) center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:var(--text-dim);font-size:14px}
.alb-vis{position:absolute;left:8px;top:8px;background:rgba(0,0,0,.75);color:var(--text-bright);font-size:12px;font-weight:700;padding:3px 8px;border-radius:999px}
.alb-b{padding:10px 12px}
.alb-b b{display:block;color:var(--text-bright);font-family:var(--fh);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.alb-b span{color:var(--text-dim);font-size:13px}
.alb-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.alb-head a{color:var(--text-bright)}
.alb-actions{display:flex;gap:8px;flex-wrap:wrap}
.upl{margin-bottom:18px}
.upl-drop{border:2px dashed var(--border-hi);border-radius:var(--rl);padding:22px;text-align:center;cursor:pointer;transition:.12s;background:var(--bg-card)}
.upl-drop:hover,.upl-drop.over{border-color:var(--accent);background:var(--accent-dim)}
.upl-drop.busy{pointer-events:none;opacity:.8}
.upl-drop b{display:block;color:var(--text-bright);font-size:16px}
.upl-drop span{color:var(--text-dim);font-size:14px}
.upl-bar{height:6px;background:var(--bg-card2);border-radius:3px;margin:12px auto 0;max-width:420px;overflow:hidden}
.upl-bar span{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.ph-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr));gap:8px}
.ph{position:relative;display:block;aspect-ratio:1;background:var(--bg-card2) center/cover no-repeat;border-radius:8px;border:1px solid var(--border);transition:filter .12s}
.ph:hover{filter:brightness(1.12);border-color:var(--accent)}
.ph-cover{position:absolute;left:6px;bottom:6px;background:var(--accent);color:#000;font-size:11px;font-weight:700;padding:2px 7px;border-radius:999px}
.ph-full{position:relative}
.ph-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:64px;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.55);color:#fff;font-size:34px;text-decoration:none!important;border-radius:8px}
.ph-nav:hover{background:rgba(0,0,0,.8);color:var(--accent)}
.ph-nav.prev{left:10px}.ph-nav.next{right:10px}

/* ============================================================
   Messenger
   ============================================================ */
.msg-btn{text-decoration:none!important}
.msg-btn.on{border-color:var(--accent);color:var(--accent)}
.bell-n[hidden]{display:none}
.chat{display:grid;grid-template-columns:320px 1fr;height:calc(100vh - 64px - 34px - 40px);min-height:480px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden}
.chat-list{border-right:1px solid var(--border);overflow-y:auto}
.chat-list-h{padding:16px 16px 10px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--bg-card);z-index:1}
.chat-list-h h1{font-family:var(--fh);font-size:20px;color:var(--text-bright)}
.chat-li{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--border);color:inherit;text-decoration:none!important}
.chat-li:hover{background:var(--bg-card2)}
.chat-li.on{background:var(--accent-dim);box-shadow:inset 3px 0 0 var(--accent)}
.chat-li .av{width:40px;height:40px;border-radius:50%;font-size:13px}
.chat-li-t{flex:1;min-width:0}
.chat-li-t b{display:block;color:var(--text-bright);font-size:15px}
.chat-li-t span{display:block;color:var(--text-dim);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-li.unread .chat-li-t span{color:var(--text-bright);font-weight:600}
.chat-li-m{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.chat-li-m time{color:var(--text-dim);font-size:12px;white-space:nowrap}
.chat-li-m em{font-style:normal;background:var(--accent);color:#000;font-size:12px;font-weight:700;border-radius:999px;min-width:20px;text-align:center;padding:0 6px}
.chat-main{display:flex;flex-direction:column;min-width:0;min-height:0}
.chat-empty{margin:auto;text-align:center;color:var(--text-dim);padding:30px;max-width:340px}
.chat-h{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border)}
.chat-who{display:flex;align-items:center;gap:10px;color:var(--text-bright);text-decoration:none!important;min-width:0}
.chat-who .av{width:36px;height:36px;border-radius:50%;font-size:12px}
.chat-who b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-h-act{margin-left:auto;display:flex;gap:14px;align-items:center}
.chat-back{display:none;font-size:30px;line-height:1;color:var(--text);text-decoration:none!important;padding:0 6px}
.chat-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:6px;background:radial-gradient(circle at 50% 0,rgba(255,215,0,.03),transparent 60%)}
.chat-hint{margin:auto;color:var(--text-dim)}
.chat-more{align-self:center;background:var(--bg-card2);border:1px solid var(--border);color:var(--text-dim);border-radius:999px;padding:6px 14px;cursor:pointer;font-family:var(--fb);font-weight:700;margin-bottom:6px}
.chat-more:hover{color:var(--accent);border-color:var(--accent)}
.chat-day{align-self:center;font-size:12px;font-weight:700;color:var(--text-dim);background:var(--bg-card2);border-radius:999px;padding:3px 12px;margin:10px 0 4px}
.msg{display:flex}
.msg.mine{justify-content:flex-end}
.msg-b{max-width:min(560px,78%);background:var(--bg-card2);border:1px solid var(--border);border-radius:14px 14px 14px 4px;padding:8px 12px}
.msg.mine .msg-b{background:rgba(255,215,0,.12);border-color:rgba(255,215,0,.3);border-radius:14px 14px 4px 14px}
.msg-t{font-size:16px;line-height:1.45;word-wrap:break-word;white-space:normal}
.msg-m{display:flex;gap:8px;justify-content:flex-end;align-items:center;margin-top:2px;font-size:12px;color:var(--text-dim)}
.msg-m .linkbtn{font-size:12px;opacity:0}
.msg:hover .msg-m .linkbtn{opacity:1}
@media (hover:none){.msg-m .linkbtn{opacity:1}}
.msg-read{letter-spacing:-3px;font-size:11px}
.msg-read.on{color:var(--blue)}
.chat-form{display:flex;gap:10px;padding:12px 16px;border-top:1px solid var(--border);align-items:flex-end}
.chat-form textarea{flex:1;min-height:44px;max-height:160px;resize:none}
.chat-blocked{padding:16px;border-top:1px solid var(--border);color:var(--text-dim);text-align:center}
@media (max-width: 820px){
  .chat{grid-template-columns:1fr;height:calc(100vh - 64px - 20px);margin:-14px -6px 0;border-radius:var(--r)}
  .chat.has-partner .chat-list{display:none}
  .chat:not(.has-partner) .chat-main{display:none}
  .chat-back{display:block}
  .msg-b{max-width:88%}
}
.um-btn{white-space:nowrap}
.um-name{max-width:120px;overflow:hidden;text-overflow:ellipsis}

/* Clan-Zugehörigkeit im Profil: Server + Gruppe */
.prof-clans{gap:8px}
.clan-chip{display:inline-flex;align-items:stretch;border:1px solid var(--border);border-radius:999px;overflow:hidden;font-size:13px;text-decoration:none!important;background:var(--bg-card2)}
.clan-chip:hover{border-color:rgba(255,215,0,.5)}
.clan-chip-srv{background:var(--bg-card3);color:var(--text-dim);font-weight:700;padding:4px 10px;border-right:1px solid var(--border);white-space:nowrap}
.clan-chip-name{color:var(--text-bright);font-weight:700;padding:4px 12px;white-space:nowrap}
.clan-chip-name b{color:var(--accent)}
.clan-chip-name em{font-style:normal;font-weight:600;color:var(--text-dim);margin-left:4px}

/* ── v12: Status, Tagebuch, Clips & Streams, Jahrestage ───── */
.btn-xs{padding:5px 10px;font-size:10px}
.page-h-act{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.gold-link{color:var(--accent)}
.srv-statlink{display:none;margin-top:12px;font-size:14px;font-weight:600;color:var(--text-dim)}
.srv-box.open .srv-statlink{display:inline-block}
.srv-statlink:hover{color:var(--accent)}

/* Status */
.st-notice{display:flex;gap:12px;align-items:flex-start;background:var(--accent-dim);border:1px solid rgba(255,215,0,.35);border-radius:var(--r);padding:12px 16px;margin-bottom:18px;color:var(--text-bright)}
.st-notice.warn{background:rgba(255,71,87,.08);border-color:rgba(255,71,87,.4)}
.st-head{display:flex;align-items:center;gap:16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);padding:20px 22px}
.st-head b{display:block;font-family:var(--fh);font-size:20px;color:var(--text-bright)}
.st-head .muted{font-size:14px}
.st-big{width:18px;height:18px;border-radius:50%;flex-shrink:0;background:var(--text-dim)}
.st-head.st-ok{border-color:rgba(57,217,138,.45)}
.st-head.st-ok .st-big{background:var(--green);box-shadow:0 0 16px var(--green);animation:pulse 2s infinite}
.st-head.st-warn{border-color:rgba(255,215,0,.45)}
.st-head.st-warn .st-big{background:var(--accent);box-shadow:0 0 14px var(--accent)}
.st-head.st-down{border-color:rgba(255,71,87,.5)}
.st-head.st-down .st-big{background:var(--red);box-shadow:0 0 16px var(--red)}
.st-list{padding:4px 18px}
.st-row{padding:14px 0;border-bottom:1px solid var(--border)}
.st-row:last-child{border-bottom:none}
.st-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.st-name{color:var(--text-bright);font-size:16px}
.st-detail{font-size:14px;font-family:var(--fm)}
.st-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;background:var(--text-dim)}
.st-dot.st-ok{background:var(--green);box-shadow:0 0 8px var(--green)}
.st-dot.st-warn{background:var(--accent)}
.st-dot.st-down{background:var(--red);box-shadow:0 0 8px var(--red)}
.st-lbl{margin-left:auto;font-family:var(--fh);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim)}
.st-lbl.st-ok{color:var(--green)}.st-lbl.st-warn{color:var(--accent)}.st-lbl.st-down{color:var(--red)}
.st-bars{display:grid;grid-template-columns:repeat(30,minmax(0,1fr));gap:3px;margin-top:10px;height:28px}
.st-bars i{border-radius:3px;background:var(--bg-card3)}
.st-bars i.b-ok{background:rgba(57,217,138,.75)}
.st-bars i.b-warn{background:var(--accent)}
.st-bars i.b-down{background:var(--red)}
.st-bars i:hover{outline:1px solid var(--text-bright)}
.st-foot{display:flex;justify-content:space-between;margin-top:5px;font-family:var(--fm);font-size:11px;color:var(--text-dim)}
.st-foot span:nth-child(2){color:var(--text)}
.st-inc{display:flex;flex-direction:column}
.st-inc-row{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--border);flex-wrap:wrap}
.st-inc-row:last-child{border-bottom:none}
.st-inc-row .st-dot{margin-top:7px}
.st-inc-t{display:flex;flex-direction:column;flex:1;min-width:200px}
.st-inc-t b{color:var(--text-bright)}
.st-inc-t .muted{font-size:14px}
.st-note{margin-top:4px;font-size:15px;color:var(--text)}
.st-noteform{display:flex;gap:8px;flex:1;min-width:240px}
.st-noteform .inp{padding:7px 10px;font-size:14px}
.st-hint{font-size:14px;margin-top:14px}

/* Tagebuch */
.dateline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-family:var(--fm);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim)}
.story-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px}
.story-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.story-grid.home{grid-template-columns:repeat(3,minmax(0,1fr))}
.story-card{display:flex;flex-direction:column;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;color:inherit;text-decoration:none!important;transition:.15s;position:relative}
.story-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--glow)}
.story-img{aspect-ratio:16/9;background:var(--bg-card3) center/cover no-repeat}
.story-b{padding:16px 18px 14px;display:flex;flex-direction:column;gap:8px;flex:1}
.story-b h3{font-family:var(--fh);font-size:19px;line-height:1.25;color:var(--text-bright);margin:0}
.story-b p{color:var(--text-dim);font-size:15px;line-height:1.45;margin:0;flex:1}
.story-card.no-img .story-b{border-top:3px solid var(--accent-2);background:linear-gradient(180deg,rgba(255,215,0,.04),transparent 60%)}
.story-card.no-img .story-b p{font-family:var(--fb)}
.story-by{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--text);margin-top:4px}
.story-by .av{width:24px;height:24px}
.story-by em{margin-left:auto;font-style:normal;color:var(--text-dim);font-size:13px;white-space:nowrap}
.story-card.big{flex-direction:row}
.story-card.big .story-img{flex:1.3;aspect-ratio:auto;min-height:280px}
.story-card.big .story-b{flex:1;padding:26px}
.story-card.big h3{font-size:26px}
.story-empty p{margin:10px auto 16px;max-width:520px;line-height:1.5}
.story{max-width:780px;margin:0 auto}
.story-hero{aspect-ratio:21/9;border-radius:var(--rl);background:var(--bg-card3) center/cover no-repeat;border:1px solid var(--border);margin-bottom:22px}
.story-h{margin-bottom:22px}
.story-h .article-title{font-size:34px;margin:10px 0 14px}
.story-author{display:inline-flex;align-items:center;gap:10px;color:var(--text);text-decoration:none!important}
.story-author .av{width:34px;height:34px}
.story-author:hover b{color:var(--accent)}
.story-body{font-size:18px;line-height:1.7}
.story-body p{margin:0 0 1.1em}
.story-body img{display:block;max-width:100%;height:auto;border-radius:var(--r);border:1px solid var(--border);margin:1.2em auto}
.story-body blockquote{border-left:3px solid var(--accent);padding:4px 0 4px 16px;color:var(--text-bright);font-style:italic;margin:1.2em 0}
.story-body h2,.story-body h3{font-family:var(--fh);color:var(--text-bright);margin:1.4em 0 .5em}
.story + .comments,.story ~ .comments{max-width:780px;margin-left:auto;margin-right:auto}
.story-ta{min-height:460px;font-size:17px;line-height:1.6;font-family:var(--fb)}
.ed-tools{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.ed-help{display:block;margin-top:8px;font-size:13px;font-family:var(--fm)}
.story-coverbox{width:100%;background:none;font-family:var(--fb)}
.tips ul{padding-left:18px;font-size:15px;display:flex;flex-direction:column;gap:6px}
.story-mini{display:flex;flex-direction:column}
.story-mini a{display:flex;flex-direction:column;padding:10px 0;border-bottom:1px solid var(--border);text-decoration:none!important}
.story-mini a:last-child{border-bottom:none}
.story-mini b{color:var(--text-bright)}
.story-mini a:hover b{color:var(--accent)}
.story-mini .muted{font-size:13px}
.picker{width:min(760px,calc(100vw - 32px));max-height:80vh;background:var(--bg-card);color:var(--text);border:1px solid var(--border-hi);border-radius:var(--rl);padding:0;box-shadow:var(--shadow)}
.picker::backdrop{background:rgba(0,0,0,.7)}
.picker-h{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border)}
.picker-h b{font-family:var(--fh);color:var(--text-bright)}
.picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;padding:16px 18px;max-height:56vh;overflow:auto}
.picker-i{padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;cursor:pointer;background:var(--bg-card3);aspect-ratio:4/3}
.picker-i img{width:100%;height:100%;object-fit:cover;display:block}
.picker-i:hover,.picker-i:focus-visible{border-color:var(--accent)}
.picker-f{padding:10px 18px 14px;font-size:13px;border-top:1px solid var(--border)}

/* Clips & Streams */
.live-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--text-dim);margin-right:9px;vertical-align:middle}
.live-dot.on{background:#ff3b3b;box-shadow:0 0 10px #ff3b3b;animation:pulse 1.6s infinite}
.live-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.live-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;color:inherit;text-decoration:none!important;transition:.15s}
.live-card:hover{border-color:#9146ff;box-shadow:0 0 18px rgba(145,70,255,.3)}
.live-thumb{aspect-ratio:16/9;background:#1a1426 center/cover no-repeat;position:relative}
.live-badge{position:absolute;top:8px;left:8px;background:#e91916;color:#fff;font-family:var(--fh);font-size:10px;font-weight:700;letter-spacing:.08em;padding:3px 7px;border-radius:4px}
.live-view{position:absolute;bottom:8px;left:8px;background:rgba(0,0,0,.75);color:#fff;font-size:12px;padding:2px 7px;border-radius:4px;font-family:var(--fm)}
.live-b{padding:10px 12px 12px;display:flex;flex-direction:column;gap:3px}
.live-b b{color:var(--text-bright);display:flex;align-items:center;gap:6px}
.live-b span{font-size:14px;line-height:1.35}
.live-b em{font-style:normal;font-size:12px;font-family:var(--fm)}
.clip-cols{grid-template-columns:minmax(0,2.2fr) minmax(0,1fr)}
.clip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.clip-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;color:inherit;text-decoration:none!important;transition:.15s}
.clip-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.clip-thumb{aspect-ratio:16/9;background:var(--bg-card3) center/cover no-repeat;position:relative;display:flex;align-items:center;justify-content:center}
.clip-play{width:52px;height:52px;border-radius:50%;background:rgba(0,0,0,.65);border:2px solid rgba(255,255,255,.85);position:relative;transition:.15s}
.clip-play::after{content:'';position:absolute;left:52%;top:50%;transform:translate(-40%,-50%);border-style:solid;border-width:10px 0 10px 16px;border-color:transparent transparent transparent #fff}
.clip-card:hover .clip-play{background:var(--accent);border-color:var(--accent)}
.clip-card:hover .clip-play::after{border-left-color:#000}
.clip-play.big{width:76px;height:76px}
.clip-play.big::after{border-width:14px 0 14px 22px}
.clip-src{position:absolute;bottom:8px;right:8px;font-family:var(--fh);font-size:10px;font-weight:700;letter-spacing:.06em;padding:3px 7px;border-radius:4px;color:#fff}
.clip-src.youtube{background:#c4302b}.clip-src.twitch{background:#9146ff}
.clip-b{padding:10px 12px 12px;display:flex;flex-direction:column;gap:3px}
.clip-b b{color:var(--text-bright);line-height:1.3}
.clip-b .muted{font-size:13px}
.clip-player{aspect-ratio:16/9;border-radius:var(--rl);overflow:hidden;background:#000 center/cover no-repeat;border:1px solid var(--border);margin-bottom:18px;position:relative}
.clip-player iframe{width:100%;height:100%;border:0;display:block}
.clip-consent{position:absolute;inset:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:rgba(0,0,0,.55);border:0;color:#fff;cursor:pointer;font-family:var(--fb);padding:20px;text-align:center}
.clip-consent b{font-family:var(--fh);font-size:18px}
.clip-consent small{opacity:.8;font-size:13px;max-width:420px}
.clip-consent:hover .clip-play{background:var(--accent);border-color:var(--accent)}
.clip-consent:hover .clip-play::after{border-left-color:#000}

/* Jahrestage */
.anniv-banner{display:flex;align-items:center;gap:14px;margin-top:20px;padding:14px 18px;border-radius:var(--rl);border:1px solid rgba(255,215,0,.45);background:linear-gradient(90deg,rgba(255,215,0,.12),rgba(255,215,0,.02));flex-wrap:wrap}
.anniv-banner > div{flex:1;min-width:200px;display:flex;flex-direction:column}
.anniv-banner b{color:var(--text-bright);font-size:17px}
.anniv-banner .muted{font-size:14px}
.anniv-ic{font-size:30px}
.anniv-row{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border)}
.anniv-row:last-child{border-bottom:none}
.anniv-row > div{flex:1;min-width:0;display:flex;flex-direction:column}
.anniv-row b{color:var(--text-bright)}
.anniv-row .muted{font-size:13px}
.anniv-row .av{width:32px;height:32px}

@media (max-width: 960px){
  .story-grid.home{grid-template-columns:repeat(2,minmax(0,1fr))}
  .clip-cols{grid-template-columns:minmax(0,1fr)}
}
@media (max-width: 640px){
  .story-grid.two,.story-grid.home{grid-template-columns:minmax(0,1fr)}
  .story-card.big{flex-direction:column}
  .story-card.big .story-img{aspect-ratio:16/9;min-height:0}
  .story-card.big .story-b{padding:16px 18px}
  .story-card.big h3{font-size:21px}
  .story-h .article-title{font-size:26px}
  .story-body{font-size:17px}
  .st-bars{gap:2px;height:24px}
  .st-lbl{margin-left:0}
  .st-top{row-gap:4px}
  .ed-tools{margin-left:0;width:100%}
  .editor-tabs{flex-wrap:wrap}
}
.story-by .av{font-size:9px;border-radius:6px}
.story-author .av{font-size:12px}
.anniv-row .av{font-size:11px}
@media (max-width: 640px){ .ed-tools .sec{flex:1} }

/* ── v13: Gerade online ─────────────────────────────────── */
.on-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);margin-right:7px;vertical-align:middle;animation:pulse 2s infinite}
.on-txt{color:var(--green)}
.online-h{padding:12px 16px;border-bottom:1px solid var(--border);color:var(--text)}
.online-h b{color:var(--text-bright);font-family:var(--fh)}
.online-list{display:flex;flex-wrap:wrap;gap:6px;padding:12px 14px}
.online-u{display:inline-flex;align-items:center;gap:7px;padding:4px 10px 4px 4px;border:1px solid var(--border);border-radius:999px;background:var(--bg-card2);color:var(--text);font-size:14px;font-weight:600;text-decoration:none!important;max-width:100%}
.online-u:hover{border-color:var(--accent);color:var(--accent)}
.online-u .av{width:24px;height:24px;border-radius:50%;font-size:9px}
.online-u span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}
.av-wrap{position:relative;display:inline-flex;flex-shrink:0}
.av-on{position:absolute;right:-2px;bottom:-2px;width:12px;height:12px;border-radius:50%;background:var(--green);border:2px solid var(--bg-card)}

/* ── v13: Benutzerverwaltung ────────────────────────────── */
.who .av-wrap{display:inline-flex}
.users-tbl .u-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.users-tbl td .tag{margin:2px 4px 2px 0}
.u-links .tag{margin-right:4px}
.ulog{display:flex;flex-direction:column}
.ulog div{display:grid;grid-template-columns:auto 1fr auto;gap:12px;padding:8px 0;border-bottom:1px solid var(--border);font-size:14px;align-items:baseline}
.ulog div:last-child{border-bottom:none}
.ulog time{font-family:var(--fm);font-size:12px;color:var(--text-dim);white-space:nowrap}
.ulog em{font-style:normal;color:var(--text-dim);font-size:13px}
.u-actions{display:flex;flex-direction:column;gap:10px}
.u-del summary{cursor:pointer;color:var(--red);font-weight:600;font-size:14px}
.u-del form{margin-top:10px}
.ban-box{padding:12px 14px;border:1px solid rgba(255,71,87,.3);border-radius:var(--r);background:rgba(255,71,87,.04)}
@media (max-width: 640px){ .ulog div{grid-template-columns:1fr} .users-tbl .u-sub{max-width:150px} }

/* ── v14: Gruppenchats ──────────────────────────────────── */
.chat-list-h{display:flex;align-items:center;justify-content:space-between;gap:10px}
.chat-sec{padding:12px 16px 6px;font-family:var(--fh);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}
.room-ic{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0;background:var(--bg-card3);border:1px solid var(--border)}
.room-ic.k-lounge{background:rgba(88,101,242,.15);border-color:rgba(88,101,242,.45)}
.room-ic.k-clan{background:var(--accent-dim);border-color:rgba(255,215,0,.4)}
.chat-li.archived{opacity:.55}
.chat-li-m em.soft{background:var(--bg-card3);color:var(--text)}
.room-who{display:flex;align-items:center;gap:10px;min-width:0}
.room-who > div{display:flex;flex-direction:column;min-width:0}
.room-who b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.room-who small{font-size:12px}
.room-who .room-ic{width:34px;height:34px;font-size:16px}
.room-menu{position:relative}
.room-menu summary{list-style:none;cursor:pointer}
.room-menu summary::-webkit-details-marker{display:none}
.room-pop{position:absolute;right:0;top:calc(100% + 8px);width:min(300px,82vw);background:var(--bg-card);border:1px solid var(--border-hi);border-radius:var(--r);box-shadow:var(--shadow);padding:12px;z-index:30;max-height:70vh;overflow:auto}
.room-mem{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}
.room-mem-r{display:flex;align-items:center;justify-content:space-between;gap:8px}
.room-mem-r a{display:flex;align-items:center;gap:8px;padding:5px 0;color:var(--text);text-decoration:none!important;min-width:0}
.room-mem-r a span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.room-mem-r .av{width:28px;height:28px;font-size:10px;border-radius:50%}
.room-add{display:flex;flex-direction:column;gap:8px;padding-top:10px;border-top:1px solid var(--border);margin-top:6px}
.room-danger{display:flex;justify-content:space-between;gap:10px;padding-top:10px;border-top:1px solid var(--border);margin-top:10px}
.linkbtn.danger{color:var(--red)}
.room-msgs .msg.other{display:flex;gap:8px;align-items:flex-end}
.room-msgs .msg-av .av{width:30px;height:30px;border-radius:50%;font-size:10px}
.room-msgs .msg.cont .msg-av{visibility:hidden}
.room-msgs .msg.cont .msg-n{display:none}
.room-msgs .msg.cont{margin-top:-4px}
.msg-n{font-size:13px;font-weight:700;color:var(--accent);margin-bottom:2px;display:flex;align-items:center;gap:6px}
.msg-n a{color:var(--accent)}
.msg-n .tag{font-size:9px;padding:1px 6px}
.msg.sys{text-align:center;font-size:13px;color:var(--text-dim);margin:8px 0}
.msg.sys span{background:var(--bg-card2);border:1px solid var(--border);border-radius:999px;padding:3px 12px;display:inline-block}
.pick{position:relative}
.pick-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.pick-chips:empty{display:none}
.pick-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 6px 4px 10px;border-radius:999px;background:var(--accent-dim);border:1px solid rgba(255,215,0,.4);color:var(--accent);font-size:14px;font-weight:600}
.pick-chip button{background:none;border:0;color:inherit;cursor:pointer;font-size:12px;padding:0 2px}
.pick-sug{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--bg-card);border:1px solid var(--border-hi);border-radius:var(--r);box-shadow:var(--shadow);z-index:40;padding:4px;display:flex;flex-direction:column}
.pick-sug button{background:none;border:0;color:var(--text);text-align:left;padding:8px 10px;border-radius:6px;cursor:pointer;font-family:var(--fb);font-size:15px}
.pick-sug button:hover,.pick-sug button:focus{background:var(--bg-card3);color:var(--accent)}
.pick-sug .muted{padding:8px 10px;font-size:14px}
.msg.sys{justify-content:center}
.pick-sug[hidden]{display:none}
@media (max-width: 640px){ .js-mute span{display:none} .chat-h-act{gap:10px} }
.lounge-diag{font-size:13px;padding:8px 16px;border-bottom:1px solid var(--border);background:rgba(255,71,87,.08);color:var(--text)}
.lounge-diag.ok{background:rgba(57,217,138,.06)}

/* ── v15: Spieler-Reports ───────────────────────────────── */
.btn-report:hover{border-color:var(--red);color:var(--red)}
.rep-list{display:flex;flex-direction:column}
.rep-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}
.rep-row:last-child{border-bottom:none}
.rep-row > div{display:flex;flex-direction:column;min-width:0}
.rep-row b{color:var(--text-bright)}
.rep-row .muted{font-size:12px;font-family:var(--fm)}
.rep-card{border-color:rgba(255,71,87,.35)}
.rep-sum{display:flex;align-items:baseline;gap:10px}
.rep-sum b{font-family:var(--fh);font-size:30px;color:var(--red)}
.rep-sum span{color:var(--text-dim);font-size:14px}
.rep-card .chip{font-size:12px;text-transform:none;letter-spacing:0}

/* ── v16: lange Servernamen (Handy) ─────────────────────── */
.srv-mini{min-width:0;max-width:100%}
.srv-mini-n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.srv2 h3{overflow-wrap:anywhere;line-height:1.25}
@media (max-width: 600px){
  .srv-sum{align-items:flex-start;gap:10px}
  .srv-sum > .js-srvsum{flex-direction:column;align-items:flex-start;gap:6px}
  .srv-sum-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;width:100%}
  .srv-mini{font-size:14px}
  .srv-mini em{font-size:12px}
  .srv-sum-tog{margin-top:2px}
  .srv-box .srv-grid{grid-template-columns:minmax(0,1fr)}
  .srv2 h3{font-size:16px}
}

/* ── v17: Spieler gruppiert ─────────────────────────────── */
.mem-views{margin:-6px 0 24px;display:inline-flex;flex-wrap:wrap}
.mem-views a{text-decoration:none!important}
.mem-sec + .mem-sec{margin-top:30px}
.mem-cnt{display:inline-block;margin-left:10px;font-family:var(--fm);font-size:13px;font-weight:400;color:var(--text-dim);background:var(--bg-card2);border:1px solid var(--border);border-radius:999px;padding:1px 9px;vertical-align:middle}
.mem-clan{color:var(--text-bright)}
.mem-clan:hover{color:var(--accent);text-decoration:none}
.mem-srv{font-size:14px}
.mem-sec .sh h2 .on-dot{margin-right:9px}

/* ── v18: DM-Einstellungen, Suche, Neu hier ─────────────── */
.dm-opts{display:flex;flex-direction:column;gap:2px}
.dm-opt{display:flex;gap:12px;align-items:flex-start;padding:9px 10px;border-radius:8px;cursor:pointer}
.dm-opt:hover{background:var(--bg-card2)}
.dm-opt input{margin-top:4px;accent-color:var(--accent);width:17px;height:17px;flex-shrink:0}
.dm-opt span{display:flex;flex-direction:column}
.dm-opt b{color:var(--text-bright);font-size:15px}
.dm-opt small{color:var(--text-dim);font-size:13px;line-height:1.4}
.dm-act{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.search-big .inp{font-size:19px;padding:14px 16px}
.sres{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,460px),1fr));gap:22px;align-items:start}
.sres-i{display:flex;flex-direction:column;gap:3px;padding:12px 16px;border-bottom:1px solid var(--border);color:inherit;text-decoration:none!important}
.sres-i:last-child{border-bottom:none}
.sres-i:hover{background:var(--bg-card2)}
.sres-i b{color:var(--text-bright)}
.sres-i span{color:var(--text-dim);font-size:14px;line-height:1.45}
.sres-i em{font-style:normal;font-family:var(--fm);font-size:12px;color:var(--text-dim)}
.sres-i mark{background:var(--accent-dim);color:var(--accent);border-radius:3px;padding:0 2px}
a.bell-btn{text-decoration:none!important;display:inline-flex;align-items:center;justify-content:center}
.nav-new{color:var(--accent)!important}
.wl-hero{margin-bottom:24px}
.wl-hero h1{font-size:34px}
.wl-hero p{color:var(--text);font-size:18px;max-width:760px;margin-top:8px;line-height:1.55}
.wl-intro{max-width:780px;margin-top:10px}
.wl-steps{margin-bottom:26px}
.wl-bar{height:6px;border-radius:999px;background:var(--bg-card3);overflow:hidden;margin-bottom:6px}
.wl-bar span{display:block;height:100%;background:var(--accent);border-radius:999px}
.wl-step{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.wl-step:last-child{border-bottom:none}
.wl-step > div{flex:1;display:flex;flex-direction:column;min-width:0}
.wl-step b{color:var(--text-bright)}
.wl-step .muted{font-size:14px}
.wl-step.ok b{color:var(--text-dim);text-decoration:line-through}
.wl-check{width:24px;height:24px;border-radius:50%;border:2px solid var(--border-hi);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;flex-shrink:0}
.wl-step.ok .wl-check{background:var(--green);border-color:var(--green);color:#000}
.wl-how{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
.wl-how > li{display:flex;gap:16px;align-items:flex-start}
.wl-how > li > div{flex:1;min-width:0}
.wl-num{width:38px;height:38px;border-radius:50%;background:var(--accent);color:#000;font-family:var(--fh);font-weight:900;font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.wl-how h2{font-family:var(--fh);font-size:20px;color:var(--text-bright);margin-bottom:6px}
.wl-how p{font-size:16px;line-height:1.55}
.wl-sub{font-size:14px;font-weight:400;font-family:var(--fb)}
.wl-srv{display:flex;flex-direction:column;margin-top:10px}
.wl-srv-r{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}
.wl-srv-r:last-child{border-bottom:none}
.wl-srv-r > div{flex:1;min-width:0;display:flex;flex-direction:column}
.wl-srv-r b{color:var(--text-bright)}
.wl-srv-r .muted{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wl-mods summary{cursor:pointer;color:var(--accent);font-weight:700;margin-top:6px}
.wl-mods ul{list-style:none;padding:0;margin-top:8px;columns:2;column-gap:20px}
.wl-mods li{display:flex;justify-content:space-between;gap:10px;padding:4px 0;break-inside:avoid;font-size:15px}
.wl-mods li .muted{font-size:13px}
.wl-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.wl-mini{margin-bottom:26px;border-color:rgba(255,215,0,.4)}
@media (max-width: 640px){ .wl-mods ul{columns:1} .wl-how > li{gap:12px} .wl-num{width:32px;height:32px;font-size:16px} .wl-srv-r{flex-wrap:wrap} }
.wl-launchers{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:10px}
.wl-launcher{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--border);border-radius:var(--r);background:var(--bg-card2);text-decoration:none!important;transition:.12s}
.wl-launcher:hover{border-color:var(--accent)}
.wl-launcher b{color:var(--text-bright)}
.wl-launcher b::after{content:' ↗';color:var(--text-dim);font-weight:400}
.wl-launcher span{color:var(--text-dim);font-size:14px}
.rules{padding:6px 18px}
.rules-intro{padding:12px 0;border-bottom:1px solid var(--border)}
.rule-sec{border-bottom:1px solid var(--border)}
.rule-sec:last-child{border-bottom:none}
.rule-sec summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:14px 0;font-family:var(--fh);font-weight:700;font-size:17px;color:var(--text-bright)}
.rule-sec summary::-webkit-details-marker{display:none}
.rule-sec summary::after{content:'';margin-left:auto;width:9px;height:9px;border-right:2px solid var(--text-dim);border-bottom:2px solid var(--text-dim);transform:rotate(45deg);transition:transform .2s;flex-shrink:0}
.rule-sec[open] summary::after{transform:rotate(-135deg)}
.rule-sec summary:hover{color:var(--accent)}
.rule-sec > .md{padding:0 0 16px 38px}
.rule-n{width:26px;height:26px;border-radius:50%;background:var(--accent-dim);border:1px solid rgba(255,215,0,.4);color:var(--accent);font-size:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
@media (max-width: 640px){ .rule-sec > .md{padding-left:0} }
.rule-n.dot{font-size:16px}
.rule-sec .md td:first-child{white-space:nowrap}

/* ── v22: Rollen-Abzeichen ──────────────────────────────── */
.role-badge.rc{color:var(--rc);border-color:color-mix(in srgb,var(--rc) 55%,transparent);background:color-mix(in srgb,var(--rc) 12%,transparent)}
.roles-tbl td{vertical-align:middle}
.roles-tbl tr.on td{background:rgba(255,215,0,.03)}
.roles-tbl input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}
.role-dot{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:8px;vertical-align:middle}
.inp-sm{padding:6px 9px;font-size:14px}
.inp-emoji{width:70px;text-align:center}
.prof-sub{flex-wrap:wrap}

/* ── v23: Abzeichen auf Spielerkarten in eigener Zeile ─────── */
.member .nm-tags{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0 3px}
.member .nm-tags .tag{font-size:9px;padding:2px 7px;max-width:100%;overflow:hidden;text-overflow:ellipsis}