
*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{font-family:Segoe UI,Arial,sans-serif;background:#0b141a;color:#e9edef}button,input,select,textarea{font:inherit}.hidden{display:none!important}
.auth{height:100%;display:grid;place-items:center;background:radial-gradient(circle at top,#184b45,#081217 60%)}.authCard{width:min(450px,92vw);padding:30px;background:#111b21;border:1px solid #26343c;border-radius:20px;box-shadow:0 25px 80px #0009;text-align:center}.authLogo{width:64px;height:64px;margin:auto;border-radius:18px;background:#00eaff;color:#062414;font-size:32px;font-weight:900;display:grid;place-items:center}.authCard h1{margin:12px 0 2px}.authCard p{color:#8696a0}.authInput{width:100%;padding:13px;margin:6px 0;border:1px solid #344650;background:#202c33;color:white;border-radius:10px}.authPrimary{width:100%;padding:13px;margin-top:8px;border:0;border-radius:10px;background:#00eaff;font-weight:800}.authLink{background:none;border:0;color:#53bdeb;margin:12px}.socialDivider{margin:16px 0;color:#8696a0}.socialGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.socialGrid button{padding:10px;background:#202c33;color:white;border:1px solid #31434d;border-radius:8px}.socialGrid .disabled{opacity:.45}.error{color:#ff8383}.vaultHint{margin:10px;padding:8px;border:1px solid #35515c;border-radius:8px;color:#bcd0d8}

.waShell{height:100vh;display:grid;grid-template-columns:60px 360px minmax(0,1fr) 0;overflow:hidden}.waRail{background:#111b21;border-right:1px solid #26343c;display:flex;flex-direction:column;align-items:center;padding:8px 0;gap:7px}.railTop{padding:4px 0 10px}.railBtn{width:44px;height:44px;border:0;border-radius:12px;background:transparent;color:#aebac1;font-size:20px;cursor:pointer}.railBtn:hover,.railBtn.active{background:#202c33;color:#00eaff}.railSpacer{flex:1}
.waSidebar{min-width:0;background:#111b21;border-right:1px solid #26343c;display:grid;grid-template-rows:62px 50px minmax(0,1fr)}.sideHeader{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:#202c33}.sideHeader b{display:block;font-size:18px}.sideHeader small{color:#8696a0}.sideHeader button{border:0;background:#2a3942;color:white;width:34px;height:34px;border-radius:50%;font-size:20px}.searchWrap{padding:8px 12px}.searchWrap input{width:100%;background:#202c33;border:0;border-radius:8px;color:white;padding:10px 12px;outline:none}.sideContent{min-height:0;overflow-y:auto}.conversation{display:flex;align-items:center;gap:11px;padding:10px 12px;cursor:pointer;border-bottom:1px solid #1c282f}.conversation:hover,.conversation.active{background:#202c33}.convBody{min-width:0;flex:1}.convTop{display:flex;justify-content:space-between;gap:8px}.convTop b,.convBottom span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.convTop time{font-size:11px;color:#8696a0}.convBottom{color:#8696a0;font-size:12px;margin-top:3px}.emptySide,.hubText{padding:20px;color:#8696a0}.roleHead,.hubHeader{padding:12px 14px 6px;color:#7f95a0;font-size:12px;text-transform:uppercase;font-weight:800}.sideAction{padding:10px 12px}
.avatar{position:relative;flex:0 0 44px;width:44px;height:44px;border-radius:50%;background:#48565e;display:grid;place-items:center;font-weight:800;overflow:visible}.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.presence{position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:50%;border:2px solid #111b21}.presence.online{background:#22c55e}.presence.offline{background:#ef4444}.roomAvatar .presence{display:none}.meAvatar{width:42px;height:42px}.msgAvatar{width:32px;height:32px;flex-basis:32px}.profileAvatarImg{width:90px;height:90px}

.waMain{min-width:0;min-height:0;display:grid;grid-template-rows:62px minmax(0,1fr) auto 64px;background:#0b141a}.chatHeader{background:#202c33;display:flex;align-items:center;justify-content:space-between;padding:8px 16px}.chatIdentity{display:flex;align-items:center;gap:10px}.chatIdentity small{display:block;color:#8696a0}.placeholderAvatar{width:42px;height:42px;border-radius:50%;background:#00eaff;color:#062414;display:grid;place-items:center;font-weight:900}.chatActions button{border:0;background:transparent;color:#aebac1;font-size:20px;padding:8px;cursor:pointer}
.messages{min-height:0;overflow-y:auto;overflow-x:hidden;padding:22px 6%;background-image:radial-gradient(#17242c 1px,transparent 1px);background-size:28px 28px}.msgRow{display:flex;align-items:flex-end;gap:7px;margin:8px 0}.msgRow.mine{justify-content:flex-end}.msgBubble{max-width:68%;background:#202c33;padding:8px 10px;border-radius:10px;box-shadow:0 1px 2px #0006}.mine .msgBubble{background:#005c4b}.msgName{font-size:12px;font-weight:800;color:#53bdeb}.msgText{white-space:pre-wrap;word-break:break-word}.msgBubble img,.msgBubble video{display:block;max-width:min(440px,65vw);max-height:420px;border-radius:9px;margin-top:7px}.msgBubble audio{max-width:100%;margin-top:7px}.fileCard{display:block;color:#aee2ff;margin-top:8px}.msgMeta{display:flex;justify-content:flex-end;align-items:center;gap:7px;color:#9aabb4;font-size:10px;margin-top:4px}.msgMenu{opacity:.25}.msgBubble:hover .msgMenu{opacity:1}.msgMenu button{border:0;background:none;color:#cbd5da;cursor:pointer;padding:0 2px}.quoted{border-left:3px solid #00eaff;background:#0d171d80;padding:5px 7px;border-radius:5px;margin-bottom:5px;color:#b6c4ca;font-size:12px}.reacts span{display:inline-block;background:#2a3942;border-radius:999px;padding:2px 6px;margin:4px 2px}.emptyState{height:100%;display:grid;place-items:center;align-content:center;text-align:center;color:#8696a0}.emptyState>div{font-size:52px}.emptyState h2{color:#d9e0e3;margin:8px}
.replybar{background:#1d2d35;border-left:4px solid #00eaff;padding:8px 12px}.replybar button{float:right;border:0;background:none;color:white;font-size:18px}
.composer{display:flex;align-items:center;gap:7px;padding:8px 12px;background:#202c33}.composer button{border:0;background:transparent;color:#aebac1;font-size:20px;cursor:pointer}.composer input[type=text]{flex:1;border:0;background:#2a3942;color:white;padding:12px 14px;border-radius:10px;outline:none}

.infoPanel{width:0;overflow:hidden;background:#111b21;border-left:1px solid #26343c;transition:.2s}.infoPanel.open{width:320px;padding-bottom:20px;overflow-y:auto}.waShell:has(.infoPanel.open){grid-template-columns:60px 360px minmax(0,1fr) 320px}.infoHead{height:62px;padding:16px;display:flex;justify-content:space-between;align-items:center;background:#202c33}.infoHead button{border:0;background:none;color:white;font-size:22px}.infoHero{text-align:center;padding:24px}.bigRoomIcon{width:90px;height:90px;margin:auto;border-radius:50%;background:#2a3942;display:grid;place-items:center;font-size:36px}.member{display:flex;align-items:center;gap:10px;padding:9px 14px}.member small{display:block;color:#8696a0}

.picker{position:fixed;right:20px;bottom:75px;z-index:50;width:min(620px,80vw);max-height:65vh;background:#111b21;border:1px solid #344852;border-radius:14px;box-shadow:0 20px 60px #000b;overflow:hidden}.pickerHead{display:flex;justify-content:space-between;padding:10px 12px;background:#202c33}.pickerHead button{border:0;background:none;color:white;font-size:22px}.emojiGrid{padding:10px;display:flex;flex-wrap:wrap;max-height:50vh;overflow:auto}.emojiGrid button{border:0;background:none;font-size:26px;padding:6px}.gifGrid{padding:10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;max-height:50vh;overflow:auto}.gifGrid img{width:100%;height:110px;object-fit:cover;border-radius:8px;cursor:pointer}

.modal{position:fixed;inset:0;background:#000b;z-index:70;display:grid;place-items:center}.modalbox{width:min(760px,94vw);max-height:90vh;overflow:auto;background:#111b21;border:1px solid #344852;border-radius:16px;padding:20px}.modalbox h2{margin-top:0}.modalbox label{display:block;margin-top:10px;color:#b5c2c8}.field{width:100%;padding:11px;background:#202c33;color:white;border:1px solid #344852;border-radius:8px;margin:5px 0}.primary{border:0;background:#00eaff;color:#05200e;padding:10px 14px;border-radius:9px;font-weight:800}.wide{width:100%;margin-top:8px}.danger{background:#7f1d1d!important;color:white!important}.modalFooter{text-align:right;margin-top:15px}.searchHit{padding:10px;border-bottom:1px solid #283842}.searchHit small{display:block;color:#8696a0}
.adminStats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.adminStats div{background:#202c33;border-radius:10px;padding:14px;text-align:center}.adminStats b{display:block;font-size:26px}.adminStats span{color:#8696a0}.adminUser{display:grid;grid-template-columns:auto minmax(0,1fr) 140px 100px;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid #26343c}.adminUserMain small{display:block;color:#8696a0}.adminUser select,.adminUser button{background:#202c33;color:white;border:1px solid #344852;border-radius:7px;padding:7px}.profileAvatar{text-align:center;margin:10px}
.miniDanger{border:0;background:#6b1d1d;color:white;border-radius:7px;padding:5px 8px}.globalPlayer{position:fixed;left:440px;right:18px;bottom:10px;z-index:55;background:#16262e;border:1px solid #3a525e;border-radius:12px;padding:9px 12px;display:flex;align-items:center;gap:8px}.globalPlayer span{flex:1}.globalPlayer button{border:0;background:#2a3942;color:white;border-radius:7px;padding:7px 10px}.videoFrame{width:100%;height:min(62vh,560px);border:0;background:#000;border-radius:10px}

.mediaViewer{position:fixed;inset:0;z-index:100;background:#000;display:flex;flex-direction:column}.mediaTop{height:56px;display:flex;justify-content:center;align-items:center;gap:8px;background:#111b21}.mediaTop button{background:#2a3942;color:white;border:0;border-radius:7px;padding:8px 12px}.mediaScroll{flex:1;overflow:scroll;padding:20px}.mediaCanvas{min-width:max-content;min-height:max-content}.mediaCanvas img{display:block;max-width:none;max-height:none}
.callOverlay{position:fixed;inset:0;background:#000d;z-index:120;display:grid;place-items:center}.callCard{background:#111b21;border-radius:18px;padding:28px;text-align:center}.callWindow{width:min(960px,94vw);height:min(700px,90vh);background:#05090b;position:relative;border-radius:16px;overflow:hidden}.callTop{height:56px;padding:12px 16px;background:#111b21;display:flex;justify-content:space-between}.callWindow #remoteVideo{width:100%;height:calc(100% - 56px);object-fit:cover}.callWindow #localVideo{position:absolute;right:18px;bottom:82px;width:220px;max-height:160px;object-fit:cover;border:2px solid white;border-radius:10px}.callControls{position:absolute;bottom:15px;left:0;right:0;text-align:center}.callControls button{margin:0 5px;border:0;border-radius:999px;padding:11px 15px;background:#2a3942;color:white}
@media(max-width:1000px){.waShell{grid-template-columns:56px 300px minmax(0,1fr) 0}.waShell:has(.infoPanel.open){grid-template-columns:56px 300px minmax(0,1fr)}.infoPanel{display:none}.msgBubble{max-width:82%}.globalPlayer{left:370px}}
@media(max-width:720px){.waShell{grid-template-columns:52px 115px minmax(0,1fr)}.sideHeader b,.sideHeader small,.searchWrap,.convBody{display:none}.waSidebar{grid-template-rows:62px minmax(0,1fr)}.conversation{justify-content:center}.globalPlayer{left:180px}.msgBubble{max-width:90%}}

/* 6.0 Haupt-Admin Design-Studio */
.messages{position:relative}.messages>.msgRow,.messages>.emptyState{position:relative;z-index:2}.adminDesignLayer{position:absolute;z-index:1;pointer-events:none;text-shadow:0 2px 8px #000;font-weight:800;white-space:nowrap}
.designGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;margin:12px 0}.designCard{min-height:145px;border:2px solid #344852;border-radius:14px;padding:12px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;overflow:hidden}.designCard.selected{border-color:#00eaff;box-shadow:0 0 0 2px #00eaff44}.designCard>div{background:#0009;padding:7px;border-radius:7px}.designCard button{border:0;background:#202c33;color:white;padding:7px;border-radius:7px}.elementRow{display:grid;grid-template-columns:minmax(160px,1fr) 90px 90px 90px;gap:6px}.elementRow .field{min-width:0}

/* MEGA-CHAT PRO 7.0 */
.waMain{grid-template-rows:auto 62px minmax(0,1fr) auto 64px!important}
.announceBar{background:#6b4f00;color:#fff3bf;padding:8px 14px;border-bottom:1px solid #8b6b00}
.msgRow.pinned .msgBubble{box-shadow:0 0 0 2px #d4af37}
.designerOverlay{position:fixed;inset:0;background:#081217;z-index:220;display:grid;grid-template-rows:58px 1fr}
.designerToolbar{display:flex;align-items:center;gap:8px;padding:9px 14px;background:#111b21}.designerToolbar b{flex:1}.designerToolbar button{background:#263942;color:white;border:0;border-radius:8px;padding:8px 11px}
.designerCanvas{position:relative;overflow:hidden}.dragEl{position:absolute;cursor:move;user-select:none;touch-action:none;font-weight:900;text-shadow:0 2px 8px #000;border:1px dashed transparent;padding:4px}.dragEl:hover{border-color:#00eaff}
.rightsRole{display:grid;grid-template-columns:140px repeat(2,minmax(150px,1fr));gap:6px;padding:10px 0;border-bottom:1px solid #26343c}.rightsRole label{font-size:12px}

/* MEGA-CHAT PRO 7.1 - Layout-Reparatur */
.waMain{
  position:relative;
  grid-template-rows:62px minmax(0,1fr) auto 64px!important;
  height:100vh;
  min-height:0;
  overflow:hidden;
}
.announceBar{
  position:absolute;
  z-index:35;
  left:0;
  right:0;
  top:62px;
  min-height:38px;
  max-height:76px;
  overflow:auto;
}
.messages{
  min-height:0!important;
  height:auto!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.composer{
  min-width:0;
  width:100%;
  align-self:stretch;
}
.composer input#msg,
.composer input[type="text"]{
  flex:1 1 auto!important;
  width:auto!important;
  min-width:80px!important;
  max-width:none!important;
  display:block;
}
.composer button{flex:0 0 auto}
.replybar{min-width:0}

/* 7.2 Mehrsprachige komplette Benutzeroberfläche */
.brand{min-width:0}.langSelect{margin-top:5px;max-width:145px;background:#18262e;color:#e9edef;border:1px solid #344852;border-radius:7px;padding:3px 5px;font-size:11px}

/* 7.3 Sprachwahl sichtbar oben in der Mitte */
.chatHeader{position:relative}
.topLanguage{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:20;display:flex;align-items:center;justify-content:center}
.topLanguage .langSelect{margin:0;min-width:155px;max-width:190px;background:#18262e;color:#e9edef;border:1px solid #4b616c;border-radius:9px;padding:7px 10px;font-size:13px;box-shadow:0 2px 8px #0005}
@media(max-width:850px){.topLanguage{left:auto;right:120px;transform:translateY(-50%)}.topLanguage .langSelect{min-width:120px;max-width:135px}}

/* 7.4 International Chat */
.roomLangBadge{font-size:11px;background:#1f333c;border:1px solid #3d5965;border-radius:999px;padding:2px 7px;margin-left:7px;white-space:nowrap}
.translationBox{font-size:12px;margin-top:6px;padding:0}.translationBox[data-open="1"]{background:#0b1f27;border-left:3px solid #00eaff;padding:7px;border-radius:6px}.originalLine{opacity:.65;margin-top:5px;font-size:11px}

/* 7.5 International Auto */
.translationStatus{padding:10px;background:#132129;border:1px solid #314651;border-radius:9px;margin:8px 0 12px}

/* MEGA-CHAT PRO 8.0 · MODERN MEGA UI */
:root{--mc-bg:#081016;--mc-panel:#0f1921;--mc-line:#263b46;--mc-text:#eef4f6;--mc-muted:#8499a4;--mc-accent:#20d5a6;--mc-accent2:#31a9ff}
body{background:linear-gradient(145deg,#071018,#0c1c25 52%,#071116)}
.waShell{grid-template-columns:76px 390px minmax(0,1fr) 0!important;background:#081016}
.waRail{background:linear-gradient(180deg,#0d1820,#091218)!important;border-right:1px solid var(--mc-line)!important;padding:12px 10px!important;gap:9px!important}
.railTop{padding:0 0 12px!important;border-bottom:1px solid var(--mc-line);width:100%;display:flex;justify-content:center}
.railBtn{width:52px!important;height:52px!important;border-radius:15px!important;font-size:21px!important;transition:.18s}
.railBtn:hover{transform:translateY(-1px);background:#172833!important}.railBtn.active{background:linear-gradient(135deg,#173d42,#12313f)!important;color:#5ef5c7!important;box-shadow:inset 3px 0 0 var(--mc-accent),0 7px 18px #0005}
.waSidebar{background:#0f1921!important;border-right:1px solid var(--mc-line)!important;grid-template-rows:74px 60px 32px minmax(0,1fr)!important}
.sideHeader{background:linear-gradient(180deg,#15242e,#111e27)!important;padding:12px 15px!important;border-bottom:1px solid var(--mc-line)}
.brandBlock{display:flex;align-items:center;gap:10px;min-width:0}.brandMark{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:21px;font-weight:900;background:linear-gradient(135deg,var(--mc-accent),var(--mc-accent2));color:#031217;box-shadow:0 8px 20px #0005}
.sideHeader b{font-size:17px!important}.sideHeader small{font-size:10px!important;letter-spacing:.08em}.sideHeader>button{width:39px!important;height:39px!important;border-radius:12px!important;background:#213641!important;border:1px solid #304a56!important}
.searchWrap{padding:10px 13px!important;background:#0f1921}.searchWrap input{padding:12px 14px!important;border-radius:13px!important;background:#182932!important;border:1px solid transparent!important}.searchWrap input:focus{border-color:#315a66!important;box-shadow:0 0 0 3px #20d5a611}
.sideSectionTitle{padding:7px 14px 5px;color:#69818d;font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;background:#0f1921}
.sideContent{background:#0f1921!important;padding:3px 7px 10px}.conversation{border:1px solid transparent!important;border-bottom:0!important;border-radius:14px!important;margin:3px 0!important;padding:10px!important;transition:.16s}.conversation:hover{background:#172832!important;border-color:#223a46!important}.conversation.active{background:linear-gradient(100deg,#17303a,#152731)!important;border-color:#315361!important;box-shadow:0 8px 22px #0003}
.convBottom{display:flex;align-items:center;gap:7px!important}.convBottom span{flex:1}.convBottom em,.miniLang{font-style:normal;font-size:9px;color:#8da1aa;background:#1d3039;padding:2px 5px;border-radius:999px}.statusOnline{color:#4ce7a6!important}.statusOffline{color:#83949c!important}
.avatar{background:linear-gradient(145deg,#374b56,#23353e)!important;box-shadow:0 3px 12px #0004}.presence.online{background:#2be798!important;box-shadow:0 0 0 2px #0f1921,0 0 8px #2be79888}
.waMain{background:linear-gradient(180deg,#0a141b,#091218)!important;border-right:1px solid var(--mc-line)}
.chatHeader{height:68px!important;background:#121f28!important;border-bottom:1px solid var(--mc-line);padding:9px 18px!important;box-shadow:0 5px 18px #0002}.chatActions{display:flex;gap:5px}.chatActions button{width:39px;height:39px;padding:0!important;border-radius:11px!important;background:#1b2d37!important;border:1px solid #2c4652!important;font-size:18px!important}.chatActions button:hover{background:#27424e!important;color:#67f1c7!important}
.topLanguage .langSelect{background:#162831!important;border:1px solid #31505c!important;border-radius:12px!important;padding:8px 12px!important}
.messages{padding:28px max(4%,34px)!important;background-color:#091319!important;background-image:radial-gradient(circle at 15% 20%,rgba(32,213,166,.045),transparent 28%),radial-gradient(circle at 85% 82%,rgba(49,169,255,.035),transparent 26%),linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px)!important;background-size:auto,auto,34px 34px,34px 34px!important}
.msgRow{margin:10px 0!important}.msgBubble{max-width:min(72%,780px)!important;background:linear-gradient(145deg,#172831,#14232b)!important;border:1px solid #243d48;border-radius:16px 16px 16px 5px!important;padding:9px 11px!important;box-shadow:0 7px 20px #0003!important}.mine .msgBubble{background:linear-gradient(145deg,#0d584c,#10493f)!important;border-color:#1b6a5c!important;border-radius:16px 16px 5px 16px!important}
.msgName{font-size:11px!important;color:#65d9f5!important;display:flex;align-items:center;gap:7px}.rolePill{font-size:8px;color:#98abb4;background:#22343d;padding:2px 5px;border-radius:999px;text-transform:uppercase}.msgText{font-size:14px;line-height:1.42}.msgBubble img,.msgBubble video{border-radius:12px!important;border:1px solid #35505b}
.composer{min-height:70px!important;background:#111f27!important;border-top:1px solid var(--mc-line);padding:10px 16px!important;gap:8px!important}.composer button{width:40px;height:40px;border-radius:12px!important;display:grid;place-items:center;font-size:19px!important;background:#1a2e38!important;border:1px solid #29434f!important}.composer button:hover{background:#25424e!important}.composer input#msg{min-height:42px!important;background:#1b2f39!important;border:1px solid #2a4653!important;border-radius:14px!important;padding:10px 15px!important}.gifButton{font-size:11px!important;font-weight:900}.sendButton{background:linear-gradient(135deg,var(--mc-accent),#18b98f)!important;color:#03241a!important;border-color:#42e8bb!important;font-weight:900}
.infoPanel{background:#0e1921!important;border-left:1px solid var(--mc-line)!important;box-shadow:-12px 0 35px #0002}.infoPanel.open{width:350px!important}.waShell:has(.infoPanel.open){grid-template-columns:76px 390px minmax(0,1fr) 350px!important}.infoHead{height:68px!important;background:#15242e!important;border-bottom:1px solid var(--mc-line)}.infoHead small{display:block;color:#8499a4;font-size:10px}.infoTabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:8px;border-bottom:1px solid var(--mc-line)}.infoTabs button{border:0;border-radius:9px;background:#152630;color:#90a4ad;padding:8px 4px;font-size:10px;cursor:pointer}.infoTabs button.active{background:#21404a;color:#5ce7be}
.infoStatGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:12px}.infoStatGrid div{background:#152630;border:1px solid #243d48;border-radius:11px;padding:10px;text-align:center}.infoStatGrid b{display:block;font-size:20px;color:#67e9c2}.infoStatGrid span{font-size:9px;color:#7f959f}
.mediaGallery{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:8px 12px}.mediaGallery img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;cursor:pointer;border:1px solid #29434f}.mediaFile{margin:5px 12px;padding:9px;background:#162832;border-radius:8px;font-size:11px}
.languageCard{margin:14px;padding:16px;background:linear-gradient(145deg,#152933,#112129);border:1px solid #294650;border-radius:15px;text-align:center}.langHero{font-size:54px}.languageStatus{display:inline-block;padding:5px 9px;background:#1d3942;border-radius:999px;color:#67e9c2;font-size:10px}
.globalPlayer{left:480px!important;background:linear-gradient(90deg,#142731,#19353b)!important;border:1px solid #31505c!important;box-shadow:0 18px 50px #0005!important}
@media(max-width:1180px){.waShell{grid-template-columns:68px 330px minmax(0,1fr) 0!important}.waShell:has(.infoPanel.open){grid-template-columns:68px 330px minmax(0,1fr)!important}.infoPanel{display:none!important}.globalPlayer{left:415px!important}}
@media(max-width:820px){.waShell{grid-template-columns:58px 120px minmax(0,1fr)!important}.sideHeader .brandBlock>div:last-child,.searchWrap,.sideSectionTitle,.convBody{display:none!important}.waSidebar{grid-template-rows:74px minmax(0,1fr)!important}.conversation{justify-content:center!important}.globalPlayer{left:190px!important}}

/* 8.1 Hintergrund-Speicherung */
.bgFileLabel{display:block;margin:8px 0 4px;font-weight:700}
.bgPreview{min-height:120px;margin:8px 0 14px;border:1px dashed #3b5965;border-radius:12px;background:#0d1820;display:flex;align-items:center;justify-content:center;gap:12px;overflow:hidden;color:#8298a3}
.bgPreview img{width:180px;height:110px;object-fit:cover;border-radius:9px}.bgPreview div{display:flex;flex-direction:column;gap:5px;max-width:360px}.bgPreview small{color:#8298a3}
.designSaveStatus{min-height:24px;margin:8px 0;font-size:12px;font-weight:700}.primary:disabled{opacity:.55;cursor:wait}

/* 8.2: custom background must override the Modern UI's !important pattern */
.messages.customChatBackground{
  background-image:var(--custom-chat-bg,none);
}
.messages.customChatBackground::before{display:none!important}

/* 8.3: Chat-Hintergrund bleibt beim Scrollen fest stehen */
.messages.customChatBackground{
  background-attachment:fixed!important;
  background-position:center center!important;
}

/* 8.4 Designrechte */
.designRightsRow{display:flex!important;align-items:center;gap:10px;margin:14px 4px 5px!important;padding:10px 12px;border:1px solid #29434f;border-radius:10px;background:#13232c}
.designRightsRow input{width:18px;height:18px;accent-color:#20d5a6}

/* ==========================================================
   MEGA-CHAT PRO 8.7 - GLOBAL SCROLLSYSTEM
   Lange Listen bleiben immer bedienbar
   ========================================================== */

/* Grundregel: Grid-/Flex-Kinder duerfen wirklich kleiner werden */
.waShell,.waSidebar,.waMain,.sideContent,.messages,.infoPanel,.modalbox,
.adminUsers,.designGrid,.mediaGallery,#infoTabBody{
  min-height:0!important;
  min-width:0!important;
}

/* Linke Chat-/Kontakt-/Gruppen-/Sprachraumliste */
.waSidebar{
  height:100vh!important;
  overflow:hidden!important;
}
.sideContent{
  height:100%!important;
  max-height:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  padding-bottom:24px!important;
}

/* Nachrichtenbereich */
.messages{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior-y:contain!important;
  scrollbar-gutter:stable!important;
}

/* Rechtes Info-Center */
.infoPanel.open{
  height:100vh!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
.infoHead,.infoTabs{flex:0 0 auto!important}
#infoTabBody{
  flex:1 1 auto!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  padding-bottom:22px!important;
}

/* Alle grossen Dialoge */
.modalbox{
  max-height:88vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
}

/* Design-Studio kann bei vielen Designs und Einstellungen scrollen */
.designGrid{
  max-height:42vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:6px!important;
}

/* Admin: viele Benutzer */
.adminUsers{
  max-height:48vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  padding-right:5px!important;
}

/* Mitgliederlisten / Medien */
.memberList,.mediaList,.mediaGallery{
  max-height:52vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}

/* Picker fuer GIFs/Emoji */
.picker{
  max-height:72vh!important;
  overflow:hidden!important;
}
.emojiGrid,.gifGrid{
  max-height:58vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}

/* Video-/Radio-/Suche-Listen in Seitenleiste */
.hubList,.searchResults,.roleList{
  max-height:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}

/* Drag Designer bleibt innerhalb des Bildschirms */
.designerCanvas{
  min-height:0!important;
  overflow:auto!important;
}

/* Call-Fenster bei kleinen Monitoren */
.callWindow,.callCard{
  max-height:92vh!important;
  overflow:auto!important;
}

/* Sichtbare moderne Scrollbars */
.sideContent::-webkit-scrollbar,
.messages::-webkit-scrollbar,
#infoTabBody::-webkit-scrollbar,
.modalbox::-webkit-scrollbar,
.adminUsers::-webkit-scrollbar,
.designGrid::-webkit-scrollbar,
.emojiGrid::-webkit-scrollbar,
.gifGrid::-webkit-scrollbar{
  width:10px;
}
.sideContent::-webkit-scrollbar-track,
.messages::-webkit-scrollbar-track,
#infoTabBody::-webkit-scrollbar-track,
.modalbox::-webkit-scrollbar-track,
.adminUsers::-webkit-scrollbar-track,
.designGrid::-webkit-scrollbar-track,
.emojiGrid::-webkit-scrollbar-track,
.gifGrid::-webkit-scrollbar-track{
  background:#0b151c;
  border-radius:10px;
}
.sideContent::-webkit-scrollbar-thumb,
.messages::-webkit-scrollbar-thumb,
#infoTabBody::-webkit-scrollbar-thumb,
.modalbox::-webkit-scrollbar-thumb,
.adminUsers::-webkit-scrollbar-thumb,
.designGrid::-webkit-scrollbar-thumb,
.emojiGrid::-webkit-scrollbar-thumb,
.gifGrid::-webkit-scrollbar-thumb{
  background:#34515d;
  border-radius:10px;
  border:2px solid #0b151c;
}
.sideContent::-webkit-scrollbar-thumb:hover,
.messages::-webkit-scrollbar-thumb:hover,
#infoTabBody::-webkit-scrollbar-thumb:hover,
.modalbox::-webkit-scrollbar-thumb:hover,
.adminUsers::-webkit-scrollbar-thumb:hover,
.designGrid::-webkit-scrollbar-thumb:hover{
  background:#4a6a77;
}

/* Firefox */
.sideContent,.messages,#infoTabBody,.modalbox,.adminUsers,.designGrid,.emojiGrid,.gifGrid{
  scrollbar-width:thin;
  scrollbar-color:#34515d #0b151c;
}

/* Kleine Displays */
@media(max-height:760px){
  .modalbox{max-height:94vh!important}
  .adminUsers{max-height:40vh!important}
  .designGrid{max-height:35vh!important}
}

/* ==========================================================
   8.8 - SCROLL FIX + ANKUENDIGUNG LOESCHEN
   ========================================================== */

/* Wichtig: feste Hoehenkette fuer linke Liste */
html,body,#app,.waShell{
  height:100%!important;
  min-height:0!important;
}
.waShell{
  height:100vh!important;
  overflow:hidden!important;
}
.waSidebar{
  height:100vh!important;
  min-height:0!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:74px 60px 32px minmax(0,1fr)!important;
}
.sideContent{
  min-height:0!important;
  max-height:none!important;
  height:auto!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior-y:contain!important;
  scrollbar-gutter:stable both-edges!important;
  padding-bottom:30px!important;
}

/* Jede lange Unterliste darf ebenfalls scrollen */
.sideContent > *{
  min-height:0;
}
.adminUsers,
.designGrid,
#infoTabBody,
.modalbox,
.emojiGrid,
.gifGrid{
  overscroll-behavior:contain!important;
}

/* Admin-Userliste bei sehr vielen Benutzern */
.adminUsers{
  max-height:50vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:8px!important;
}

/* Gruppen/Kanaele/Kontakte: kein Abschneiden am unteren Rand */
.conversation:last-child{
  margin-bottom:18px!important;
}

/* Ankuendigungsleiste */
.announceBar{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:9px 14px!important;
}
.announceBar.hidden{display:none!important}
.announceText{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#deleteCurrentAnnouncement{
  flex:0 0 auto;
  width:30px;
  height:30px;
  border:0;
  border-radius:9px;
  background:#7a1d1d;
  color:white;
  cursor:pointer;
  font-weight:900;
}
#deleteCurrentAnnouncement:hover{background:#a12828}

/* Admin-Ankuendigungsverwaltung */
.announcementList{
  max-height:240px;
  overflow-y:auto;
  overflow-x:hidden;
  margin-top:10px;
  border:1px solid #29434f;
  border-radius:10px;
}
.announcementAdminRow{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-bottom:1px solid #263b46;
  background:#13232c;
}
.announcementAdminRow:last-child{border-bottom:0}
.announcementAdminRow>div{flex:1;min-width:0}
.announcementAdminRow b{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.announcementAdminRow small{
  display:block;
  color:#8298a3;
  margin-top:3px;
}
.announcementAdminRow button{
  flex:0 0 auto;
  border:0;
  border-radius:8px;
  padding:7px 10px;
  background:#7a1d1d;
  color:white;
  cursor:pointer;
}

/* Deutlich sichtbare Scrollbar links */
.sideContent::-webkit-scrollbar{width:12px!important}
.sideContent::-webkit-scrollbar-thumb{background:#466774!important}
.sideContent::-webkit-scrollbar-track{background:#0b151c!important}

/* 8.9 Radio-Welt */
.radioSidebarActions{display:grid;gap:7px;padding:7px 4px 10px}.radioCategoryBar{display:flex;gap:6px;overflow-x:auto;padding:10px 0}.radioCategoryBar button{flex:0 0 auto;border:1px solid #2d4854;background:#172832;color:#d9e4e8;border-radius:999px;padding:7px 11px;cursor:pointer}.radioCategoryBar button:hover{background:#24505a}.radioFilters{display:grid;grid-template-columns:1fr 260px auto;gap:8px;margin:8px 0}.radioWorldResults{height:min(58vh,590px);overflow-y:auto;border:1px solid #29434f;border-radius:12px;padding:6px;background:#0d1820}.stationCard{display:grid;grid-template-columns:54px minmax(0,1fr) 42px 42px;gap:8px;align-items:center;padding:8px;border-bottom:1px solid #203640}.stationLogoWrap{width:50px;height:50px;border-radius:10px;overflow:hidden;background:#192d37;display:grid;place-items:center}.stationLogo{width:100%;height:100%;object-fit:contain;background:#fff}.stationFallback{width:100%;height:100%;display:grid;place-items:center;font-size:25px}.hiddenFallback{display:none}.stationMain{min-width:0}.stationMain b,.stationMain small,.stationTags{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stationMain small,.stationTags{font-size:10px;color:#80949e}.stationPlay,.stationFav{width:38px;height:38px;border:1px solid #31505c;border-radius:10px;background:#1a303a;color:#65efc5;cursor:pointer}.radioLoading{padding:30px;text-align:center;color:#8298a3}.modernRadioPlayer .stationLogo,.modernRadioPlayer .stationFallback{width:38px;height:38px;border-radius:8px}.gpText{min-width:0;flex:1}.gpText b,.gpText small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:800px){.radioFilters{grid-template-columns:1fr}.stationCard{grid-template-columns:44px minmax(0,1fr) 38px 38px}}

/* ==========================================================
   8.10 RADIO PLAYER + VERSCHIEBBARES RADIO-FENSTER
   ========================================================== */
.floatingRadioPlayer{
  position:fixed!important;
  left:520px;
  top:calc(100vh - 150px);
  right:auto!important;
  bottom:auto!important;
  width:520px;
  min-width:320px;
  max-width:calc(100vw - 20px);
  resize:horizontal;
  overflow:hidden;
  display:flex!important;
  flex-direction:column!important;
  padding:0!important;
  border-radius:14px!important;
  z-index:500!important;
}
.gpDragHandle{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  background:#132832;
  border-bottom:1px solid #31505c;
  cursor:move;
  user-select:none;
  touch-action:none;
}
.gpStationIdentity{display:flex;align-items:center;gap:9px;flex:1;min-width:0}
.gpStationIdentity .stationLogo,.gpStationIdentity .stationFallback{width:40px;height:40px;border-radius:8px;flex:0 0 auto}
.gpWindowButtons{display:flex;gap:4px}
.gpWindowButtons button,.gpControls button{
  border:1px solid #31505c;background:#1b333d;color:#dff8f1;border-radius:8px;cursor:pointer;
}
.gpWindowButtons button{width:30px;height:28px}
.gpControls{display:flex;align-items:center;gap:7px;padding:9px 10px;background:#0f2028}
.gpControls button{height:36px;padding:0 11px;font-weight:800}
.gpPrimary{color:#69f0c6!important}.gpStop{background:#7a1d1d!important;border-color:#a13636!important;color:#fff!important}
.gpVolume{display:flex;align-items:center;gap:6px;flex:1;min-width:100px}.gpVolume input{width:100%}
.floatingRadioPlayer.minimized .gpControls{display:none}.floatingRadioPlayer.minimized{width:340px!important;resize:none}
.floatingRadioPlayer.maximized{left:10px!important;top:10px!important;width:calc(100vw - 20px)!important;max-width:none!important}
.stationPlay.playing{background:#7a1d1d!important;border-color:#a13636!important;color:white!important}

/* Verschiebbares Radio-Welt-Fenster */
.radioWindow{
  position:fixed;
  z-index:460;
  min-width:520px;
  min-height:320px;
  max-width:calc(100vw - 10px);
  max-height:calc(100vh - 10px);
  background:#101c24;
  border:1px solid #31505c;
  border-radius:16px;
  box-shadow:0 24px 70px #0009;
  overflow:hidden;
  resize:both;
  display:flex;
  flex-direction:column;
}
.radioWindowHandle{
  height:48px;
  flex:0 0 48px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 12px;
  background:#162b35;
  border-bottom:1px solid #31505c;
  cursor:move;
  user-select:none;
  touch-action:none;
}
.radioWindowHandle>b{flex:1;font-size:15px}
.radioWindowHandle>div{display:flex;gap:5px}
.radioWindowHandle button{
  width:32px;height:30px;border:1px solid #345663;border-radius:8px;background:#1b333d;color:white;cursor:pointer;
}
.radioWindowBody{flex:1;min-height:0;overflow:auto;padding:14px 18px 18px}
.radioWindow.minimized{height:48px!important;min-height:48px!important;resize:none}
.radioWindow.minimized .radioWindowBody{display:none}
.radioWindow.maximized{left:5px!important;top:5px!important;width:calc(100vw - 10px)!important;height:calc(100vh - 10px)!important;max-width:none!important;max-height:none!important;resize:none}
.radioWindow .radioWorldResults{height:calc(100% - 150px)!important;min-height:220px}
@media(max-width:700px){
  .radioWindow{min-width:300px;width:calc(100vw - 20px)!important;left:10px!important}
  .floatingRadioPlayer{left:10px!important;width:calc(100vw - 20px)!important}
}

/* 8.11 Drag-Fix: kein "Magnet an der Maus" mehr */
body.radioDragging,body.radioDragging *{
  cursor:grabbing!important;
  user-select:none!important;
}
.radioWindowHandle,.gpDragHandle{cursor:grab}
.radioWindowHandle:active,.gpDragHandle:active{cursor:grabbing}

/* 8.12: Start/Pause/Stop fest im Radio-Fenster */
.radioPinnedControls{display:flex!important;gap:5px;margin-left:auto;margin-right:10px}
.radioPinnedControls button{width:38px!important;height:32px!important;font-size:16px!important;font-weight:900}
.radioPinnedControls #radioPinnedPlay{color:#63efc4!important}
.radioPinnedControls #radioPinnedPause{color:#ffd66b!important}
.radioPinnedControls .radioPinnedStop{background:#7b2020!important;border-color:#a63b3b!important;color:#fff!important}
.radioWindowHandle>b{white-space:nowrap}
@media(max-width:650px){.radioPinnedControls{margin-right:4px}.radioPinnedControls button{width:34px!important}}

/* 8.13 Favoritenstern auf jedem Radiosender */
.stationFav{
  font-size:22px!important;
  line-height:1!important;
  color:#8aa0a9!important;
  transition:.15s ease;
}
.stationFav:hover{
  transform:scale(1.08);
  color:#ffd54a!important;
  border-color:#7d6a27!important;
}
.stationFav.isFavorite{
  color:#ffd54a!important;
  background:#4a3d12!important;
  border-color:#8a7427!important;
  text-shadow:0 0 8px #ffd54a66;
}

/* 8.14 Video-Import + Fredy/Mike-Chat */
.brandChatButton{
  border:0!important;
  padding:0!important;
  cursor:pointer!important;
  flex:0 0 42px;
}
.brandChatButton:hover{
  transform:scale(1.06);
  box-shadow:0 0 0 3px #20d5a633,0 8px 20px #0005!important;
}
.videoImportTabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:10px 0 14px}
.videoImportTabs button{border:1px solid #31505c;background:#172832;color:#d9e4e8;border-radius:10px;padding:10px;cursor:pointer}
.videoImportTabs button.active{background:#24505a;color:#6ff0c8;border-color:#43a889}
.videoExternalCard{text-align:center;padding:36px 20px;border:1px solid #31505c;border-radius:14px;background:#10212a}
.videoExternalCard>div{font-size:50px}.videoExternalButton{display:inline-block;text-decoration:none;margin-top:10px;padding:10px 18px;border-radius:10px}

/* 8.15 Branding + Raum löschen */
.brandKL{
  font-size:12px!important;
  letter-spacing:-.5px;
  cursor:default!important;
  flex:0 0 42px;
}
.brandBlock>div:last-child{min-width:0}
.brandBlock>div:last-child b{
  display:block;
  font-size:14px!important;
  white-space:normal;
  line-height:1.05;
  max-width:220px;
}
.roomDeleteBtn{
  flex:0 0 28px!important;
  width:28px!important;
  height:28px!important;
  padding:0!important;
  border:1px solid #5a3538!important;
  border-radius:8px!important;
  background:#2a181b!important;
  color:#ff7c84!important;
  cursor:pointer!important;
  font-size:13px!important;
}
.roomDeleteBtn:hover{
  background:#7a1d27!important;
  color:white!important;
}
.placeholderAvatar{
  min-width:42px;
  font-size:11px!important;
}

/* ==========================================================
   MEGA-CHAT PRO 9.0 - INVITES / MESSAGES / ROLES
   ========================================================== */
.quotedMsg{border-left:3px solid #3bbd9b;background:#10242c;padding:6px 8px;border-radius:7px;margin-bottom:7px;font-size:11px;display:flex;flex-direction:column;gap:2px}
.quotedMsg span{color:#96aab3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:420px}
.editedMark{font-size:9px;color:#7f949e;margin-top:3px;text-align:right}
.messageReactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.reactionChip{border:1px solid #31505c;background:#132630;color:#dce8eb;border-radius:999px;padding:3px 7px;font-size:11px;cursor:pointer}
.reactionChip.mineReaction{background:#1b4a42;border-color:#3a8e79;color:#71edc7}
.adminTwoCols{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.inviteAdminList,.auditAdminList{max-height:300px;overflow:auto;border:1px solid #29434f;border-radius:10px;margin:8px 0 14px}
.inviteRow{display:grid;grid-template-columns:minmax(0,1fr) 38px 38px 38px;gap:6px;align-items:center;padding:9px;border-bottom:1px solid #263b46;background:#12232b}
.inviteRow:last-child{border-bottom:0}.inviteRow>div{min-width:0}.inviteRow b,.inviteRow small{display:block}.inviteRow small{color:#8398a2;font-size:10px;margin:3px 0}.inviteUrl{font-size:10px!important;padding:6px 8px!important}.inviteRow button{height:34px;border:1px solid #31505c;border-radius:8px;background:#1a303a;color:#dce8eb;cursor:pointer}.inviteRow button.danger{background:#662026;color:white}
.auditRow{padding:8px 10px;border-bottom:1px solid #263b46}.auditRow b,.auditRow small{display:block}.auditRow small{color:#8398a2;font-size:9px;margin-top:3px}
@media(max-width:700px){.adminTwoCols{grid-template-columns:1fr}.inviteRow{grid-template-columns:1fr 34px 34px 34px}}

/* 9.1 Login-Branding passend zur Chat-Oberfläche */
.authLogoKL{
  font-size:15px!important;
  font-weight:900!important;
  letter-spacing:-.5px;
  display:grid!important;
  place-items:center!important;
}
.authCard h1{
  margin-bottom:3px!important;
  text-align:center;
  line-height:1.08;
}
.authVersion{
  text-align:center;
  color:#7f98a3;
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  margin-bottom:8px;
}

/* 9.2 SECURITY + SOCIAL LOGIN */
.socialLoginBtn{cursor:pointer!important;opacity:1!important;filter:none!important;border:1px solid #31505c!important;background:#182932!important;color:#dce8eb!important;transition:.15s}
.socialLoginBtn:hover{transform:translateY(-1px);background:#24414c!important}
.socialLoginBtn.socialReady{border-color:#2d8e70!important;box-shadow:inset 0 0 0 1px #2d8e7033}
.socialLoginBtn.socialNeedsSetup{opacity:.65!important}
.socialLoginStatus{min-height:20px;color:#f4c767;font-size:11px;text-align:center;margin-top:7px}
.securityNotice,.secureOk,.secureWarn{padding:9px 11px;border-radius:9px;margin:8px 0;font-size:11px}
.securityNotice{background:#132832;border:1px solid #31505c}.secureOk{background:#13382e;border:1px solid #2a785e;color:#6ce8c0}.secureWarn{background:#493a12;border:1px solid #806a27;color:#ffd66b}
.socialAuthAdmin h4{margin:13px 0 5px;color:#8fdac5}.socialCallbacks{margin-top:10px;padding:10px;background:#0d1820;border:1px solid #29434f;border-radius:10px}.socialCallbacks code{display:block;overflow:auto;padding:5px 0;color:#75d9f3;font-size:10px}

/* 9.3 Offene Registrierung */
.authSwitch{
  width:100%;margin-top:9px;padding:10px 12px;border:1px solid #31505c;border-radius:10px;
  background:#142630;color:#6ee7c2;cursor:pointer;font-weight:800;
}
.authSwitch:hover{background:#1c3842}
.publicRegisterHint{
  margin-top:10px;padding:9px 11px;border-radius:9px;background:#123128;border:1px solid #2f7d63;
  color:#77e9c7;font-size:11px;text-align:center;
}

/* 9.4 Public Login */
.authModeTabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 10px}
.authModeTabs button{padding:11px 8px;border-radius:10px;border:1px solid #31505c;background:#142630;color:#b9c9cf;font-weight:800;cursor:pointer}
.authModeTabs button.active{background:#1e4b41;border-color:#35a985;color:#72ebc7}
.publicAuthCard .vaultHint{display:none!important}

.callIncomingStatus{font-weight:800;margin:12px 0;animation:callPulse 1s infinite}
@keyframes callPulse{50%{opacity:.45}}
.audioCallOnly{min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:72px;gap:12px}
.audioCallOnly div{font-size:18px;font-weight:800}
.callWindow #remoteVideo{background:#050708;object-fit:contain}
.callWindow #localVideo{object-fit:cover}

/* 9.4.3: Telefon/Video schwebend, Chat bleibt bedienbar */
#callLayer{position:fixed;inset:0;z-index:10000;pointer-events:none}
#callLayer:empty{display:none}
.floatingCall{
  position:fixed;right:18px;bottom:18px;width:min(390px,calc(100vw - 24px));
  max-height:calc(100vh - 24px);background:#101c22;border:1px solid #31505c;
  border-radius:14px;box-shadow:0 14px 45px rgba(0,0,0,.48);overflow:hidden;
  pointer-events:auto;resize:both;min-width:270px;min-height:82px
}
.floatingCallHead{
  display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;
  background:#16272f;cursor:move;touch-action:none;user-select:none
}
.floatingCallHead>div{min-width:0;display:flex;flex-direction:column}
.floatingCallHead b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.floatingCallHead #callStatus{font-size:12px;opacity:.78}
.floatingCallHead button{width:34px;height:30px;flex:0 0 auto}
.floatingCallBody{padding:8px}
.hiddenCallBody{display:none!important}
.callMinimized{width:260px!important;height:auto!important;min-height:0!important;resize:none}
.floatingVideoStage{position:relative;width:100%;aspect-ratio:16/9;background:#050708;border-radius:10px;overflow:hidden}
.floatingVideoStage #remoteVideo{width:100%;height:100%;object-fit:contain;background:#050708}
.floatingVideoStage #localVideo{
  position:absolute;right:8px;bottom:8px;width:29%;height:34%;object-fit:cover;
  border-radius:8px;border:1px solid rgba(255,255,255,.35);background:#111
}
.floatingCall .callControls{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;padding-top:8px}
.floatingCall .audioCallOnly{min-height:90px;font-size:38px}
.floatingCall .audioCallOnly div{font-size:14px}
@media(max-width:700px){
  .floatingCall{right:8px;bottom:8px;width:min(330px,calc(100vw - 16px));resize:none}
}

/* 9.4.4: eingehender Anruf muss trotz klickbarem Chat bedienbar bleiben */
#callLayer .incomingCallOverlay{pointer-events:auto!important}
#callLayer .incomingCallCard{pointer-events:auto!important;min-width:300px;max-width:92vw}
.incomingCallButtons{display:flex;gap:10px;justify-content:center;margin-top:14px}
.incomingCallButtons button{min-width:120px;font-weight:900;cursor:pointer}
.incomingCallButtons button:disabled{opacity:.55;cursor:wait}
.incomingBell{font-size:42px;line-height:1;margin-bottom:6px;animation:ringBell .65s ease-in-out infinite alternate}
@keyframes ringBell{from{transform:rotate(-12deg) scale(1)}to{transform:rotate(12deg) scale(1.08)}}
.callIncomingStatus{font-weight:900;color:#ffd76a}

/* 9.4.5 Deutsches TV + Chat Auto-Scroll */
.tvSidebarHead{display:flex;align-items:center;gap:10px;padding:12px;margin:4px 0 10px;border:1px solid #29434d;border-radius:12px;background:#11232a}
.tvSidebarLogo{font-size:30px}
.tvSidebarHead>div:last-child{display:flex;flex-direction:column}
.tvSidebarHead small{opacity:.7;margin-top:2px}
.tvStation{cursor:pointer}
.tvLiveBadge{font-size:10px;font-weight:900;padding:4px 7px;border-radius:999px;background:#b92323;color:#fff;align-self:center;margin-right:8px}
.tvLegalHint{margin:12px 4px;font-size:11px;line-height:1.45;opacity:.75}
.tvStationModal{text-align:center;max-width:520px;margin:auto}
.tvBigIcon{font-size:58px;margin-bottom:5px}
.tvNotice{padding:12px;margin:14px 0;border-radius:10px;background:#10252c;border:1px solid #31505c;font-size:12px;line-height:1.5}
.tvOpenButton{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;padding:12px 18px;border-radius:10px;margin:8px auto}

/* 9.4.7 Große Schreibfelder + Präsenzstatus */
#msg{
  height:68px!important;min-height:68px!important;max-height:150px!important;
  padding:14px 16px!important;font-size:16px!important;border-radius:14px!important
}
.chatComposer,.composer,.messageComposer,.inputBar{min-height:82px!important}
input.field:not([type="file"]),
select.field,
textarea.field,
.authInput,
textarea,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="number"]{
  min-height:58px!important;padding:13px 14px!important;font-size:15px!important;line-height:1.35!important
}
textarea,textarea.field{min-height:110px!important;resize:vertical!important}
.presenceHelp{margin:8px 0 12px;padding:9px 10px;border:1px solid #31505c;border-radius:9px;background:#10242b;font-size:11px;line-height:1.45;opacity:.86}


/* ===== 9.4.8 VARIANTE A =====
   Schmalere linke Chat-/Raumliste + verschiebbare senkrechte Trennlinie.
   Standard 260px, Bereich 210-520px. Doppelklick setzt auf 260px zurück.
*/
:root{--mega-left-panel:260px}

.megaSplitterA{
  position:absolute!important;
  top:0!important;
  right:-5px!important;
  bottom:0!important;
  width:10px!important;
  z-index:9999!important;
  cursor:col-resize!important;
  touch-action:none!important;
  background:transparent!important;
  user-select:none!important
}
.megaSplitterA:before{
  content:""!important;
  position:absolute!important;
  left:4px!important;
  top:0!important;
  bottom:0!important;
  width:2px!important;
  background:rgba(100,210,205,.38)!important;
  transition:background .15s,width .15s!important
}
.megaSplitterA:hover:before,
body.megaResizing .megaSplitterA:before{
  left:3px!important;
  width:4px!important;
  background:rgba(70,235,215,.95)!important
}
.megaSplitterA span{
  position:absolute!important;
  top:46%!important;
  left:-10px!important;
  width:30px!important;
  height:30px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:15px!important;
  background:#10252d!important;
  border:1px solid #315b64!important;
  color:#dff!important;
  font-size:15px!important;
  opacity:0!important;
  pointer-events:none!important;
  transition:opacity .15s!important
}
.megaSplitterA:hover span,
body.megaResizing .megaSplitterA span{opacity:1!important}
body.megaResizing{cursor:col-resize!important;user-select:none!important}

/* Variante A: möglichst viel Platz für Nachrichten */
.chatMain,.chatArea,.mainChat,.conversationMain,.contentMain{
  min-width:0!important;
}

/* Das schwebende Telefon-/Videofenster bleibt über dem Chat und veränderbar. */
.callFloat,.callWindow,.floatingCall,.videoCallWindow{
  resize:both!important;
  overflow:auto!important;
  max-width:calc(100vw - 24px)!important;
  max-height:calc(100vh - 24px)!important
}


/* ===== 9.4.9 VARIANTE A – CHATFENSTER GROESSER =====
   Mehr Platz für den eigentlichen Chat.
   Linke Spalte bleibt per Trennlinie verschiebbar.
*/
@media (min-width: 1000px){
  /* schmalerer Startwert links = mehr Chatfläche */
  :root{--mega-left-panel:225px}

  /* Haupt-/Nachrichtenbereich darf die komplette Restbreite nutzen */
  .chatMain,.chatArea,.mainChat,.conversationMain,.contentMain,
  main,[class*="chat-main"],[class*="conversation-main"]{
    min-width:0!important;
    flex:1 1 auto!important;
  }

  /* unnötige Begrenzungen im Nachrichtenbereich entfernen */
  .messages,.messageList,.chatMessages,.messagesWrap,
  [class*="message-list"],[class*="messages-wrap"]{
    width:100%!important;
    max-width:none!important;
  }

  /* Eingabe unten ebenfalls über die verfügbare Chatbreite */
  .composer,.messageComposer,.chatInput,.inputBar,
  [class*="composer"],[class*="input-bar"]{
    width:100%!important;
    max-width:none!important;
  }
}


/* ===== 9.5.0 – LINIE + CHAT-BG FEST VERBUNDEN / VIDEO OHNE BUTTONS IM BILD ===== */

/* Die verschiebbare Linie steuert jetzt wirklich die zweite Grid-Spalte.
   Dadurch bewegt/vergrößert sich der komplette Chat inkl. Hintergrundbild direkt mit. */
.waShell{
  grid-template-columns:60px var(--mega-left-panel,225px) minmax(0,1fr) 0!important;
}
.waSidebar{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
}
.chatPane,.chatMain,.chatArea,.mainChat,.conversationMain,.contentMain{
  min-width:0!important;
  width:auto!important;
}

/* BG-Bild bleibt an den Chatbereich gekoppelt und passt sich beim Ziehen sofort an. */
.messages{
  width:100%!important;
  min-width:0!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
}
.messages::before{
  max-width:100%!important;
}

/* Splitter optisch exakt auf der Kante zwischen Liste und Chat */
.megaSplitterA{
  right:-6px!important;
  width:12px!important;
}
.megaSplitterA:before{
  left:5px!important;
  height:100%!important;
}
.megaSplitterA span{
  top:50%!important;
  transform:translateY(-50%)!important;
}

/* VIDEO-ANRUF: größere brauchbare Standardgröße */
.floatingCall.floatingVideo{
  width:560px!important;
  min-width:440px!important;
  min-height:390px!important;
  max-width:calc(100vw - 24px)!important;
  max-height:calc(100vh - 24px)!important;
  resize:both!important;
  overflow:hidden!important;
}

/* Körper sauber untereinander: erst Bild, dann Bedienleiste */
.floatingCall.floatingVideo .floatingCallBody{
  display:flex!important;
  flex-direction:column!important;
  padding:8px!important;
  overflow:auto!important;
}

.floatingCall.floatingVideo .floatingVideoStage{
  position:relative!important;
  width:100%!important;
  aspect-ratio:16/9!important;
  min-height:260px!important;
  flex:1 1 auto!important;
  background:#050708!important;
  overflow:hidden!important;
  border-radius:10px!important;
}

/* Gegenüber groß und vollständig sichtbar */
.floatingCall.floatingVideo .floatingVideoStage #remoteVideo{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  background:#050708!important;
}

/* Eigenbild bleibt klein in der Ecke – KEINE Buttons im Bild */
.floatingCall.floatingVideo .floatingVideoStage #localVideo{
  position:absolute!important;
  right:10px!important;
  bottom:10px!important;
  width:24%!important;
  height:28%!important;
  max-width:170px!important;
  object-fit:cover!important;
  border:2px solid rgba(255,255,255,.7)!important;
  border-radius:9px!important;
}

/* Wichtig: alte absolute .callControls-Regel überschreiben.
   Bedienknöpfe sitzen jetzt außerhalb/unterhalb des Videobildes. */
.floatingCall .callControls,
.floatingCall.floatingVideo .callControls{
  position:static!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  width:100%!important;
  min-height:58px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  padding:10px 6px 4px!important;
  background:#101c22!important;
  text-align:center!important;
}

.floatingCall .callControls button{
  margin:0!important;
  min-height:42px!important;
  padding:10px 15px!important;
}

/* Audio-Anruf darf kompakt bleiben */
.floatingCall.floatingAudio{
  width:360px!important;
  min-width:300px!important;
  min-height:150px!important;
}

@media(max-width:700px){
  .waShell{
    grid-template-columns:52px minmax(110px,var(--mega-left-panel,150px)) minmax(0,1fr)!important;
  }
  .floatingCall.floatingVideo{
    width:calc(100vw - 16px)!important;
    min-width:0!important;
    min-height:300px!important;
  }
  .floatingCall.floatingVideo .floatingVideoStage{
    min-height:190px!important;
  }
}


/* ===== 9.5.1 – GROESSERE CHATFENSTER + FREIE SCHRIFTGROESSE ===== */
:root{
  --mega-chat-font:17px;
  --mega-chat-meta-font:13px;
}

/* Nachrichtenkarten deutlich größer */
.message,
.msg,
.messageBubble,
.chatBubble,
.message-card,
[class*="messageBubble"],
[class*="chatBubble"]{
  min-width:240px!important;
  max-width:min(620px,72%)!important;
  padding:14px 16px!important;
  border-radius:15px!important;
}

/* Text im Chat über den Benutzerregler steuerbar */
.message .text,
.msg .text,
.messageBubble .text,
.chatBubble .text,
.messageText,
.msgText,
.message-body,
[class*="messageText"]{
  font-size:var(--mega-chat-font)!important;
  line-height:1.48!important;
}

/* Fallback: direkte Textknoten/Absätze in Nachrichten */
.message p,
.msg p,
.messageBubble p,
.chatBubble p{
  font-size:var(--mega-chat-font)!important;
  line-height:1.48!important;
  margin-top:4px!important;
  margin-bottom:4px!important;
}

/* Name etwas größer */
.message .author,
.msg .author,
.messageBubble .author,
.chatBubble .author,
.messageAuthor,
.msgAuthor{
  font-size:calc(var(--mega-chat-font) - 1px)!important;
  font-weight:800!important;
}

/* Zeit / Reaktionszeile bleibt kleiner */
.message .meta,
.msg .meta,
.messageBubble .meta,
.chatBubble .meta,
.messageMeta,
.msgMeta,
.messageActions,
.msgActions{
  font-size:var(--mega-chat-meta-font)!important;
}

/* Bildnachrichten bekommen ebenfalls mehr Raum */
.message img,
.msg img,
.messageBubble img,
.chatBubble img{
  max-width:min(560px,100%)!important;
  height:auto!important;
}

/* Schriftgrößen-Knopf oben */
.megaFontBtn{
  min-width:42px!important;
  height:38px!important;
  padding:0 10px!important;
  margin-left:8px!important;
  border:1px solid #31505c!important;
  border-radius:10px!important;
  background:#132830!important;
  color:#eaffff!important;
  font-weight:900!important;
  cursor:pointer!important;
  z-index:10002!important;
}

/* Falls kein Header gefunden wurde */
body>.megaFontBtn{
  position:fixed!important;
  right:18px!important;
  top:72px!important;
}

/* Schriftgrößen-Fenster */
.megaFontPanel{
  position:fixed!important;
  right:22px!important;
  bottom:22px!important;
  width:390px!important;
  max-width:calc(100vw - 24px)!important;
  z-index:12000!important;
  padding:15px!important;
  border-radius:15px!important;
  border:1px solid #315c63!important;
  background:#0f2027!important;
  box-shadow:0 16px 55px rgba(0,0,0,.55)!important;
  color:#f0ffff!important;
}
.megaFontTitle{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  margin-bottom:14px!important;
  font-size:18px!important;
}
.megaFontTitle button{
  width:34px!important;
  height:34px!important;
  border-radius:9px!important;
  font-size:20px!important;
}
.megaFontControls{
  display:grid!important;
  grid-template-columns:60px 1fr 60px!important;
  gap:10px!important;
  align-items:center!important;
}
.megaFontControls button{
  min-height:42px!important;
  font-size:17px!important;
  font-weight:900!important;
}
.megaFontControls input[type="range"]{
  width:100%!important;
  min-height:32px!important;
}
.megaFontBottom{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  margin-top:10px!important;
}
.megaFontPreview{
  margin-top:13px!important;
  padding:12px!important;
  border-radius:10px!important;
  background:#132830!important;
  border:1px solid #294952!important;
  font-size:var(--mega-chat-font)!important;
  line-height:1.4!important;
}

@media(max-width:700px){
  .message,
  .msg,
  .messageBubble,
  .chatBubble{
    min-width:180px!important;
    max-width:88%!important;
  }
  .megaFontPanel{
    right:8px!important;
    bottom:8px!important;
    width:calc(100vw - 16px)!important;
  }
}


/* ===== 9.5.2 – VIDEOS DIREKT IM CHAT POSTEN ===== */
.chatVideoPost{
  width:min(720px,100%)!important;
  margin:6px 0 2px!important;
  border-radius:12px!important;
  overflow:hidden!important;
  background:#071116!important;
  border:1px solid #31505c!important;
}
.chatPostedVideo{
  display:block!important;
  width:100%!important;
  max-height:520px!important;
  background:#000!important;
  object-fit:contain!important;
}
.chatVideoCaption{
  padding:8px 10px!important;
  font-size:13px!important;
  color:#d9edf2!important;
  background:#102129!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.message:has(.chatVideoPost),
.msg:has(.chatVideoPost),
.messageBubble:has(.chatVideoPost),
.chatBubble:has(.chatVideoPost){
  max-width:min(760px,82%)!important;
}
@media(max-width:700px){
  .chatVideoPost{width:100%!important}
  .chatPostedVideo{max-height:340px!important}
}

/* ===== 9.5.4 – BG-PALETTE FUER ADMIN + USER, CALL-LOGIK UNVERAENDERT ===== */
.sharedBgGrid .designCard{
  min-height:190px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  gap:9px!important;
  padding:12px!important;
}
.sharedBgGrid .designCard.selected{
  outline:3px solid rgba(60,235,210,.92)!important;
}
.sharedBgName,.sharedBgLocked,.sharedBgNotice{
  padding:8px 10px!important;
  border-radius:9px!important;
  background:rgba(5,15,20,.82)!important;
  color:#efffff!important;
}
.sharedBgNotice{
  margin:10px 0 14px!important;
  border:1px solid #31505c!important;
}

/* ===== 9.4.11 – SMILEY / GIF / STICKER BIBLIOTHEK ===== */
.megaMediaPicker{width:min(720px,calc(100vw - 24px))!important;max-height:min(620px,75vh)!important}
.mediaPickerSearch{padding:8px 10px}
.mediaPickerSearch input{width:100%;min-height:42px;border-radius:10px;border:1px solid #31505c;background:#0b1920;color:#fff;padding:9px 12px;font-size:14px}
.mediaCategoryTabs,.mediaAdminTabs{display:flex;gap:6px;overflow-x:auto;padding:5px 10px 10px}
.mediaCategoryTabs button,.mediaAdminTabs button{white-space:nowrap;border:1px solid #31505c;background:#102129;color:#dcecf0;padding:7px 10px;border-radius:9px;cursor:pointer}
.mediaCategoryTabs button.active,.mediaAdminTabs button.active{background:#1d4d42;color:#7ff0ca;border-color:#3daf91}
.emojiGrid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(54px,1fr))!important;gap:7px!important;padding:10px!important;max-height:390px!important;overflow:auto!important}
.emojiTile{position:relative;min-height:54px}
.emojiUse{width:100%;height:54px;font-size:28px!important;border-radius:10px!important}
.emojiFav{position:absolute;right:1px;top:1px;width:19px!important;height:19px!important;padding:0!important;font-size:11px!important;opacity:.45}
.emojiFav.on,.gifTileFoot button.on{opacity:1!important;color:#ffd65a!important}
.gifGrid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))!important;gap:10px!important;padding:10px!important;max-height:420px!important;overflow:auto!important}
.gifTile{background:#0a171d;border:1px solid #29464f;border-radius:10px;overflow:hidden}
.gifTile img{width:100%!important;height:120px!important;object-fit:cover!important;cursor:pointer}
.gifTileFoot{display:flex;align-items:center;justify-content:space-between;gap:5px;padding:6px 8px;font-size:11px}
.gifTileFoot span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gifTileFoot button{width:28px!important;height:26px!important;padding:0!important}
.mediaEmpty{grid-column:1/-1;padding:25px;text-align:center;opacity:.7}
.mediaAdminTabs{padding-left:0}
.mediaAdminRow{display:grid;grid-template-columns:58px 1fr auto;gap:10px;align-items:center;padding:8px;border-bottom:1px solid #243d45}
.mediaAdminRow img{width:58px;height:48px;object-fit:cover;border-radius:7px}
.mediaAdminRow div{display:flex;flex-direction:column;min-width:0}
.mediaAdminRow small{opacity:.7;margin-top:3px}
@media(max-width:700px){
  .megaMediaPicker{width:calc(100vw - 12px)!important;max-height:82vh!important}
  .gifGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .gifTile img{height:105px!important}
}

/* ===== 9.4.12 – TRANSLATION / PIN / DRAGGABLE PICKER ===== */
.megaMediaPicker .pickerHead.dragHandle{
  cursor:move!important;
  user-select:none!important;
  touch-action:none!important;
}
.translationBox{
  display:none;
  margin-top:8px;
  padding:9px 11px;
  border-radius:9px;
  border-left:3px solid #35b98f;
  background:rgba(7,20,25,.75);
  color:#e4f6f3;
  font-size:13px;
  line-height:1.45;
}
.translationBox.open,.translationBox[data-open="1"]{display:block}
.translationHead{display:flex;align-items:center;gap:6px;margin-bottom:5px}
.translationHead button{margin-left:auto;border:0;background:none;color:#fff;font-size:17px;cursor:pointer}
.translationError{color:#ffcb79}
.originalLine{margin-top:5px;opacity:.62;font-size:11px}
.translationTargetMenu{
  position:fixed;z-index:15000;width:190px;padding:8px;border-radius:11px;
  border:1px solid #31505c;background:#102129;box-shadow:0 12px 35px rgba(0,0,0,.55);
  display:flex;flex-direction:column;gap:5px;color:#fff
}
.translationTargetMenu b{padding:5px 6px 7px}
.translationTargetMenu button{
  text-align:left;min-height:36px;border:1px solid #294751;border-radius:8px;
  background:#132a32;color:#fff;padding:7px 9px;cursor:pointer
}
.translationTargetMenu button:hover{background:#1d4c42}
.msgMenu button.activeTool{color:#ffd45f!important;opacity:1!important}
.msgMenu button:disabled{opacity:.25!important;cursor:not-allowed!important}
.miniNotice{
  position:fixed;left:50%;bottom:90px;transform:translate(-50%,20px);
  z-index:16000;padding:10px 15px;border-radius:10px;background:#102b31;
  border:1px solid #347070;color:#fff;opacity:0;pointer-events:none;
  transition:.18s ease
}
.miniNotice.show{opacity:1;transform:translate(-50%,0)}
.pinned .msgBubble{box-shadow:0 0 0 2px #d4af37,0 5px 18px rgba(0,0,0,.25)!important}

/* 9.4.13 Übersetzer Online-Fallback */
.translatorHint{margin:6px 0 12px;padding:9px 11px;border:1px solid #31505c;border-radius:9px;background:#102129;font-size:11px;line-height:1.45;opacity:.86}

/* ===== 9.4.14 – STERN/FAVORIT + SICHERE UEBERSETZUNG ===== */
.msgMenu button.favoriteOn{
  color:#ffd84d!important;opacity:1!important;
  text-shadow:0 0 8px rgba(255,216,77,.72)!important;
  background:rgba(255,216,77,.10)!important
}
.msgMenu button.favoriteOn:hover{background:rgba(255,216,77,.18)!important}

/* ===== 9.4.16 – HA-ONLY CHAT-TEMPLATES ===== */
:root{
  --tpl-accent:#00eaff;
  --tpl-panel:#102129;
  --tpl-panel2:#142a33;
  --tpl-bubble:#162b35;
  --tpl-own:#47145f;
  --tpl-radius:12px;
  --tpl-shadow:0 10px 18px rgba(0,0,0,.35);
}
.waRail,.waSidebar,.chatHeader,.composer,.infoPanel{background:var(--tpl-panel)!important}
.sideHeader,.searchWrap,.sideContent,.replybar{background:var(--tpl-panel2)!important}
.message .msgBubble,.msg .msgBubble,.messageBubble,.chatBubble{background:var(--tpl-bubble)!important;border-radius:var(--tpl-radius)!important;box-shadow:var(--tpl-shadow)!important}
.message.own .msgBubble,.msg.own .msgBubble,.own .messageBubble,.own.chatBubble{background:var(--tpl-own)!important}
button.primary,.sendButton,.railBtn.active{border-color:var(--tpl-accent)!important}
.sendButton,.railBtn.active{color:var(--tpl-accent)!important}
.templateToolbar{display:flex;justify-content:flex-end;margin:8px 0 14px}
.templateGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-bottom:20px}
.templateCard{border:1px solid #31505c;border-radius:14px;padding:10px;background:#0d1b21}
.templateCard.selected{outline:3px solid var(--tpl-accent)}
.templatePreview{height:118px;border-radius:10px;overflow:hidden;background:var(--pp);display:grid;grid-template-columns:28% 72%;border:1px solid rgba(255,255,255,.08)}
.templatePreview>span{background:var(--pp2);border-right:2px solid var(--pa)}
.templatePreview>div{padding:11px;display:flex;flex-direction:column;gap:8px}
.templatePreview i{height:18px;width:62%;background:var(--pb);border-radius:var(--pr);display:block}
.templatePreview i:nth-child(2){width:76%}
.templatePreview i.own{width:55%;margin-left:auto;background:var(--po)}
.templateText{display:flex;flex-direction:column;gap:4px;padding:9px 2px}
.templateText small{opacity:.68;line-height:1.35}
.sharedBgGrid .designCard{min-height:190px!important}
.sharedBgGrid .designCard.selected{outline:3px solid var(--tpl-accent)!important}

/* ===== 9.4.17 – ANPASSBARE AUFTEILUNGEN (HA ONLY) ===== */
:root{
  --layout-rail:60px;
  --layout-info:330px;
  --layout-msg-width:72%;
  --layout-header:74px;
  --layout-composer:88px;
  --layout-gap:0px;
  --layout-pad:14px;
}
@media(min-width:821px){
  .waShell{
    grid-template-columns:var(--layout-rail) var(--mega-left-panel,245px) minmax(0,1fr) 0!important;
    gap:var(--layout-gap)!important;
    padding:var(--layout-gap)!important;
    box-sizing:border-box!important;
  }
  .waShell:has(.infoPanel.open){
    grid-template-columns:var(--layout-rail) var(--mega-left-panel,245px) minmax(0,1fr) var(--layout-info)!important;
  }
  .waRail{width:auto!important}
  .waSidebar{width:auto!important;min-width:0!important}
  .chatHeader{min-height:var(--layout-header)!important;height:var(--layout-header)!important}
  .composer{min-height:var(--layout-composer)!important;height:auto!important}
  .messages{padding-left:var(--layout-pad)!important;padding-right:var(--layout-pad)!important}
  .msgBubble{max-width:var(--layout-msg-width)!important}
  .infoPanel.open{width:auto!important;min-width:0!important;display:block!important}
}

/* Preset-spezifische sichere Unterschiede – keine DOM-Umbauten */
html[data-chat-layout="floatingGlass"] .waRail,
html[data-chat-layout="floatingGlass"] .waSidebar,
html[data-chat-layout="floatingGlass"] .waMain,
html[data-chat-layout="floatingGlass"] .infoPanel.open{
  border-radius:14px!important;overflow:hidden!important;
}
html[data-chat-layout="controlCenter"] .chatHeader{border-bottom:2px solid var(--tpl-accent)!important}
html[data-chat-layout="truckCockpit"] .waRail{border-right:2px solid var(--tpl-accent)!important}
html[data-chat-layout="cinemaMedia"] .chatVideoPost,
html[data-chat-layout="cinemaMedia"] .message img{max-width:100%!important}

/* HA Layout Editor */
.layoutPresetGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:10px 0 18px}
.layoutPreset{display:flex;flex-direction:column;gap:7px;text-align:left;padding:10px;border:1px solid #31505c;border-radius:12px;background:#0e1c22;color:#fff;cursor:pointer}
.layoutPreset.selected{outline:3px solid var(--tpl-accent);background:#142a31}
.layoutPreset strong{font-size:14px}.layoutPreset small{opacity:.68;line-height:1.35}
.layoutMini{height:58px;display:grid;grid-template-columns:14% 28% 58%;border:1px solid #35505a;border-radius:8px;overflow:hidden;background:#0b151a}
.layoutMini i{background:#17282f}.layoutMini b{background:#122129;border-left:1px solid #35505a;border-right:1px solid #35505a}.layoutMini em{background:linear-gradient(135deg,#102a31,#18353d)}
.layoutAdjustGrid{display:grid;grid-template-columns:repeat(2,minmax(240px,1fr));gap:12px;margin:10px 0}
.layoutAdjustGrid label{display:grid;grid-template-columns:1fr auto;gap:5px;padding:10px;border:1px solid #294750;border-radius:10px;background:#0d1b21}
.layoutAdjustGrid input{grid-column:1/-1;width:100%}
.layoutActions{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
.layoutSafety{padding:10px 12px;border:1px solid #31505c;border-radius:10px;background:#10242b;margin-bottom:18px;font-size:12px}
@media(max-width:760px){.layoutAdjustGrid{grid-template-columns:1fr}}

/* ===== 9.4.18 – ECHTE AUFTEILUNGSVORLAGEN ===== */
.structureGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:10px 0 14px}
.structureCard{display:flex;flex-direction:column;gap:7px;text-align:left;padding:10px;border:1px solid #31505c;border-radius:12px;background:#0e1c22;color:#fff;cursor:pointer}
.structureCard.selected{outline:3px solid var(--tpl-accent);background:#142a31}
.structureCard small{opacity:.7;line-height:1.35}
.structurePreview{height:74px;display:grid;grid-template-columns:9% 24% 1fr 24%;gap:3px;background:#091419;border:1px solid #31505c;border-radius:8px;padding:4px;box-sizing:border-box}
.structurePreview>*{display:block;border-radius:4px;background:#17303a;text-decoration:none}
.structurePreview b{background:#10232b}.structurePreview em{background:#14333d}.structurePreview u{background:#172831}
.structure-standard{grid-template-columns:9% 27% 1fr 0}.structure-standard u{display:none}
.structure-adminRight,.structure-profileRight,.structure-mediaRight,.structure-onlineRight,.structure-communicationRight{grid-template-columns:9% 23% 1fr 26%}
.structure-dashboard{grid-template-columns:8% 20% 1fr 31%}
.moduleChooser{padding:10px;border:1px solid #294750;border-radius:10px;background:#0d1b21;margin-bottom:18px}
.moduleChooser label{display:flex;justify-content:space-between;align-items:center;gap:12px}
.moduleChooser select{min-width:240px;max-width:100%;padding:8px;border-radius:8px;background:#10242b;color:#fff;border:1px solid #31505c}

.layoutRightDock{display:none;background:rgba(10,24,30,.96);border-left:1px solid #31505c;min-width:0;overflow:auto;padding:12px;box-sizing:border-box}
.layoutRightDock[hidden]{display:none!important}
@media(min-width:1050px){
  html[data-structure-layout]:not([data-structure-layout="standard"]) .waShell:has(.layoutRightDock:not([hidden])){
    grid-template-columns:var(--layout-rail) var(--mega-left-panel,245px) minmax(0,1fr) var(--layout-info,330px)!important;
  }
  html[data-structure-layout]:not([data-structure-layout="standard"]) .layoutRightDock:not([hidden]){display:block!important;grid-column:4;grid-row:1}
  html[data-structure-layout]:not([data-structure-layout="standard"]) .waMain{grid-column:3}
}
.dockCard{border:1px solid #31505c;border-radius:14px;padding:14px;background:linear-gradient(180deg,#102832,#0d1d24);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.dockCard h3{margin-top:0}.dockCard p{opacity:.75;font-size:13px;line-height:1.4}
.dockCard button{width:100%;margin:5px 0;padding:9px;border-radius:9px;border:1px solid #31505c;background:#142d36;color:#fff;cursor:pointer}
.dockAvatar{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;margin:8px auto 12px;background:#173b46;border:2px solid var(--tpl-accent);font-size:28px;font-weight:800}
.dockTiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}.dockTiles button{min-height:72px;font-size:22px}.dockTiles small{display:block;font-size:11px;margin-top:5px}
@media(max-width:1049px){.layoutRightDock{display:none!important}}

/* ===== 9.4.19 – AI DASHBOARD CHAT / CHAT-FIRST ===== */
html[data-structure-layout="aiDashboardChat"] body{
  background:radial-gradient(circle at 50% 0%,rgba(44,105,255,.12),transparent 38%),linear-gradient(180deg,#050914,#07101b 55%,#08111c)!important;
}
@media(min-width:1050px){
  html[data-structure-layout="aiDashboardChat"] .waShell{
    grid-template-columns:var(--layout-rail,58px) minmax(190px,var(--mega-left-panel,225px)) minmax(0,1fr) minmax(290px,var(--layout-info,340px))!important;
    gap:12px!important;padding:12px!important;background:transparent!important;
  }
  html[data-structure-layout="aiDashboardChat"] .waRail,
  html[data-structure-layout="aiDashboardChat"] .waSidebar,
  html[data-structure-layout="aiDashboardChat"] .waMain,
  html[data-structure-layout="aiDashboardChat"] .layoutRightDock{
    border-radius:20px!important;border:1px solid rgba(92,132,255,.22)!important;
    background:linear-gradient(180deg,rgba(12,20,39,.94),rgba(8,16,31,.94))!important;
    box-shadow:0 20px 60px rgba(0,0,0,.28)!important;overflow:hidden!important;backdrop-filter:blur(14px)!important;
  }
  html[data-structure-layout="aiDashboardChat"] .chatHeader{
    background:linear-gradient(180deg,rgba(16,29,55,.95),rgba(12,22,43,.92))!important;
    border-bottom:1px solid rgba(116,153,255,.18)!important;
  }
  html[data-structure-layout="aiDashboardChat"] .messages{background-color:rgba(5,12,24,.35)!important}
  html[data-structure-layout="aiDashboardChat"] .composer{
    margin:10px!important;border-radius:16px!important;border:1px solid rgba(92,132,255,.18)!important;background:rgba(14,26,48,.92)!important;
  }
  html[data-structure-layout="aiDashboardChat"] .conversation{border-radius:14px!important;margin:4px 8px!important}
  html[data-structure-layout="aiDashboardChat"] .conversation.active{
    background:linear-gradient(90deg,rgba(43,104,255,.25),rgba(78,38,184,.18))!important;
    border:1px solid rgba(74,130,255,.35)!important;
  }
  html[data-structure-layout="aiDashboardChat"] .msgBubble{
    border:1px solid rgba(92,132,255,.12)!important;backdrop-filter:blur(8px)!important;
  }
}
.structure-aiDashboardChat{grid-template-columns:8% 20% 1fr 30%!important}
.structure-aiDashboardChat>*{border-radius:7px!important}
.structure-aiDashboardChat em{background:linear-gradient(180deg,#152f67,#1d4f91)!important}
.structure-aiDashboardChat u{background:linear-gradient(180deg,#151d39,#212a54)!important}
.aiDock{background:linear-gradient(180deg,rgba(12,23,45,.96),rgba(7,15,31,.96))!important;border:1px solid rgba(103,139,255,.28)!important}
.aiDockHead{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}
.aiDockHead small{letter-spacing:.12em;opacity:.58;font-size:9px}.aiDockHead h3{margin:3px 0 0}
.aiPulse{color:#51e090;text-shadow:0 0 12px #51e090}
.aiTiles{grid-template-columns:1fr 1fr!important}
.aiTiles button{min-height:84px!important;background:linear-gradient(180deg,#14284d,#111d38)!important;border:1px solid rgba(105,145,255,.26)!important;border-radius:14px!important;font-size:24px!important;transition:.18s ease!important}
.aiTiles button:hover{transform:translateY(-2px);border-color:#6694ff!important;box-shadow:0 10px 24px rgba(37,85,180,.22)!important}
.aiTiles small{font-size:11px!important;opacity:.8}
.aiStatusCard{margin-top:12px;padding:12px;border-radius:12px;background:linear-gradient(90deg,rgba(35,88,169,.26),rgba(81,42,153,.24));border:1px solid rgba(100,143,255,.20);display:flex;flex-direction:column;gap:4px}
.aiStatusCard span{font-size:11px;opacity:.68;line-height:1.4}

/* ===== 9.4.20 – SICHTBARE LAYOUT-VORSCHAU-KACHELN ===== */
.layoutPreviewHint{
  margin:8px 0 14px;padding:10px 12px;border-radius:10px;
  background:#10242b;border:1px solid #31505c;font-size:12px;line-height:1.45
}
.visualStructureGrid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important;
  gap:14px!important;
  align-items:stretch!important
}
.visualStructureCard{
  padding:10px!important;
  min-height:255px!important;
  background:linear-gradient(180deg,#0d1820,#0a1319)!important;
  border:1px solid #31505c!important;
  border-radius:14px!important;
  overflow:hidden!important
}
.visualStructureCard:hover{
  border-color:var(--tpl-accent)!important;
  transform:translateY(-2px)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.28)!important
}
.visualStructureCard.selected{
  outline:3px solid var(--tpl-accent)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.05),0 16px 38px rgba(0,0,0,.3)!important
}
.structureCardText{
  display:flex;flex-direction:column;gap:4px;padding:10px 2px 2px!important
}
.structureCardText strong{font-size:15px!important}
.structureCardText small{opacity:.7!important;line-height:1.35!important}
.structureCardText span{margin-top:4px;font-size:10px;color:var(--tpl-accent)!important}

/* Base thumbnail */
.layoutThumb{
  width:100%;height:170px;display:grid;
  grid-template-columns:26px 86px minmax(0,1fr) 92px;
  grid-template-rows:1fr;
  gap:5px;padding:7px;box-sizing:border-box;
  border-radius:11px;
  background:linear-gradient(180deg,#07131c,#0b1b25);
  border:1px solid rgba(120,180,220,.18);
  box-shadow:inset 0 0 30px rgba(0,0,0,.3);
  position:relative;overflow:hidden;
}
.thumbRail,.thumbSidebar,.thumbChat,.thumbRight{
  border-radius:7px;border:1px solid rgba(120,180,220,.14);overflow:hidden
}
.thumbRail{
  background:#0c2028;display:flex;flex-direction:column;align-items:center;gap:7px;padding:8px 4px
}
.thumbRail i{width:11px;height:11px;border-radius:50%;background:#1d5962}
.thumbRail i:first-child{background:var(--tpl-accent)}

.thumbSidebar{background:#0e2029;padding:7px;display:flex;flex-direction:column;gap:6px}
.thumbBrand{height:18px;border-radius:5px;background:#173844}
.thumbSearch{height:12px;border-radius:5px;background:#152f38}
.thumbConversation{height:18px;border-radius:6px;background:#142a33}
.thumbConversation.active{background:linear-gradient(90deg,#1e5f67,#244e63)}

.thumbChat{background:#0b1820;display:grid;grid-template-rows:30px 1fr 25px}
.thumbChatHead{display:flex;align-items:center;gap:6px;padding:6px;background:#11252e;border-bottom:1px solid rgba(120,180,220,.12)}
.thumbChatHead span{width:15px;height:15px;border-radius:50%;background:#2b6972}
.thumbChatHead b{width:46px;height:7px;border-radius:4px;background:#2b4954}
.thumbMessages{display:flex;flex-direction:column;gap:8px;padding:10px 8px}
.thumbMessages i{height:19px;border-radius:9px;background:#17303a;width:58%}
.thumbMessages i.out{margin-left:auto;background:#1c5d50;width:64%}
.thumbMessages i.short{width:42%}
.thumbComposer{margin:4px 7px;border-radius:8px;background:#122b34;border:1px solid rgba(120,180,220,.14)}

.thumbRight{background:#0f2028;padding:8px}
.thumbRightTitle{height:10px;width:68%;background:#28505d;border-radius:5px;margin-bottom:10px}
.thumbRightAvatar{width:34px;height:34px;border-radius:50%;background:#265b67;margin:5px auto 9px;border:2px solid var(--tpl-accent)}
.thumbRightLine{height:7px;border-radius:4px;background:#294650;margin:5px 0}
.thumbRightLine.short{width:65%;margin-left:auto;margin-right:auto}
.thumbRightTiles{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:10px}
.thumbRightTiles i{height:23px;border-radius:6px;background:#173640}

.thumbDashboardTop{display:none;position:absolute;left:120px;right:104px;top:8px;gap:5px}
.thumbDashboardTop i{height:20px;flex:1;border-radius:7px;background:#152b49;border:1px solid rgba(120,150,255,.2)}

/* Real differences between layout previews */
.layoutThumb-standard{grid-template-columns:26px 98px minmax(0,1fr) 0}
.layoutThumb-standard .thumbRight{display:none}

.layoutThumb-adminRight .thumbRight{
  background:linear-gradient(180deg,#172336,#111c2b)
}
.layoutThumb-adminRight .thumbRightAvatar{
  width:42px;height:42px
}

.layoutThumb-profileRight .thumbRight{
  background:linear-gradient(180deg,#1d1932,#151426)
}
.layoutThumb-profileRight .thumbRightAvatar{
  width:48px;height:48px;border-radius:14px
}
.layoutThumb-profileRight .thumbRightTiles{display:none}

.layoutThumb-mediaRight .thumbRight{
  background:#111f2a
}
.layoutThumb-mediaRight .thumbRightAvatar{display:none}
.layoutThumb-mediaRight .thumbRightLine{display:none}
.layoutThumb-mediaRight .thumbRightTiles{
  grid-template-columns:1fr 1fr;margin-top:18px
}
.layoutThumb-mediaRight .thumbRightTiles i{height:36px;background:linear-gradient(135deg,#1f4d5d,#305b72)}

.layoutThumb-onlineRight .thumbRightAvatar{display:none}
.layoutThumb-onlineRight .thumbRightTiles{grid-template-columns:1fr}
.layoutThumb-onlineRight .thumbRightTiles i{height:20px;border-left:3px solid #49d38a}

.layoutThumb-communicationRight .thumbRightTiles i:nth-child(1),
.layoutThumb-communicationRight .thumbRightTiles i:nth-child(2){
  height:38px;background:linear-gradient(180deg,#1e5860,#173f47)
}
.layoutThumb-communicationRight .thumbRightAvatar{display:none}

.layoutThumb-dashboard .thumbRight,
.layoutThumb-aiDashboardChat .thumbRight{
  background:linear-gradient(180deg,#131b34,#10162a)
}
.layoutThumb-dashboard .thumbRightAvatar,
.layoutThumb-aiDashboardChat .thumbRightAvatar{display:none}
.layoutThumb-dashboard .thumbRightTiles i,
.layoutThumb-aiDashboardChat .thumbRightTiles i{
  background:linear-gradient(180deg,#1b3159,#14243e);height:28px
}

.layoutThumb-aiDashboardChat{
  grid-template-columns:24px 76px minmax(0,1fr) 100px;
  padding-top:34px;
  background:
    radial-gradient(circle at 50% 0%,rgba(70,90,255,.2),transparent 45%),
    linear-gradient(180deg,#060a16,#0b1222)
}
.layoutThumb-aiDashboardChat .thumbDashboardTop{
  display:flex
}
.layoutThumb-aiDashboardChat .thumbRail,
.layoutThumb-aiDashboardChat .thumbSidebar,
.layoutThumb-aiDashboardChat .thumbChat,
.layoutThumb-aiDashboardChat .thumbRight{
  border-color:rgba(100,130,255,.2)
}
.layoutThumb-aiDashboardChat .thumbChat{
  background:linear-gradient(180deg,#0b1427,#0d1a30)
}

/* Layout preview responsiveness */
@media(max-width:780px){
  .visualStructureGrid{grid-template-columns:1fr!important}
  .layoutThumb{height:155px}
}

/* ===== 9.4.21 – VORSCHAU IST DAS ECHTE LAYOUT ===== */
.structureRuleNotice{
  margin:8px 0 18px;padding:10px 12px;border-radius:10px;
  background:rgba(34,115,91,.15);border:1px solid rgba(67,190,150,.35);
  font-size:12px;line-height:1.45
}

@media(min-width:1050px){
  .waShell.structureHasRight{
    grid-template-columns:var(--layout-rail,60px) var(--mega-left-panel,245px) minmax(0,1fr) var(--layout-info,330px)!important;
  }
  .waShell:not(.structureHasRight){
    grid-template-columns:var(--layout-rail,60px) var(--mega-left-panel,245px) minmax(0,1fr) 0!important;
  }
  .waShell.structureHasRight .waRail{grid-column:1!important}
  .waShell.structureHasRight .waSidebar{grid-column:2!important}
  .waShell.structureHasRight .waMain{grid-column:3!important;min-width:0!important}
  .waShell.structureHasRight #layoutRightDock{
    grid-column:4!important;grid-row:1!important;
    display:block!important;width:auto!important;min-width:0!important;height:100vh!important
  }
}
@media(max-width:1049px){
  #layoutRightDock{display:none!important}
}

/* Hintergrund nur im Nachrichtenbereich */
#layoutRightDock,.waRail,.waSidebar,.chatHeader,.composer{background-image:none!important}
#layoutRightDock{
  background:var(--tpl-panel,#102129)!important;
  border-left:1px solid rgba(120,180,210,.18)!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  padding:12px!important;box-sizing:border-box!important;
  position:relative!important;z-index:30!important
}
.messages{isolation:isolate!important}

/* Reale rechte Module */
.realDock{display:flex;flex-direction:column;gap:12px;min-height:100%;color:#eef9fb}
.realDockHead{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding-bottom:10px;border-bottom:1px solid rgba(120,180,210,.14)}
.realDockHead small{font-size:9px;letter-spacing:.13em;opacity:.55}.realDockHead h3{margin:2px 0 0}
.realOnline{font-size:11px;color:#56e49b}.realOffline{font-size:11px;color:#a8b3b8}
.realCount{min-width:30px;height:30px;border-radius:999px;display:grid;place-items:center;background:rgba(55,168,137,.2)}
.realProfile{display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px;border-radius:14px;background:rgba(255,255,255,.035);border:1px solid rgba(120,180,210,.12)}
.realAvatar{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;font-size:30px;font-weight:900;background:linear-gradient(135deg,#1b5964,#263b68);border:3px solid var(--tpl-accent,#00eaff);box-shadow:0 12px 28px rgba(0,0,0,.3)}
.realProfile small{opacity:.65}
.realInfo{display:grid;gap:7px}.realInfo>div{display:flex;justify-content:space-between;gap:8px;padding:9px;border-radius:9px;background:rgba(255,255,255,.035)}.realInfo span{opacity:.62}
.realWide{width:100%;padding:10px;border-radius:10px;border:1px solid rgba(80,190,160,.35);background:rgba(35,115,95,.28);color:#fff;cursor:pointer}
.realTiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.realTiles button{min-height:78px;border-radius:12px;border:1px solid rgba(120,180,210,.14);background:rgba(255,255,255,.035);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:23px;cursor:pointer}
.realTiles small{font-size:11px}
.realMediaGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.realMediaGrid button{min-height:95px;border-radius:12px;border:1px solid rgba(120,180,210,.14);background:linear-gradient(135deg,rgba(40,100,120,.3),rgba(25,55,70,.38));color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;font-size:26px;cursor:pointer}.realMediaGrid b{font-size:12px}
.realHint{padding:10px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid rgba(120,180,210,.1);font-size:11px;line-height:1.45;opacity:.72}
.realUserList{display:flex;flex-direction:column;gap:7px}.realUserList button{display:flex;align-items:center;gap:9px;width:100%;padding:8px;border-radius:10px;border:1px solid rgba(120,180,210,.12);background:rgba(255,255,255,.025);color:#fff;text-align:left;cursor:pointer}.realUserList button>span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#173d47;border:2px solid #54df98;font-weight:800}.realUserList button>div{display:flex;flex-direction:column}.realUserList small{opacity:.6}
.realCallGrid{display:grid;gap:10px}.realCallGrid button{min-height:110px;border-radius:13px;border:1px solid rgba(120,180,210,.14);background:rgba(255,255,255,.035);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:30px;cursor:pointer}.realCallGrid b{font-size:14px}.realCallGrid small{font-size:11px;opacity:.6}
.realStatus{padding:12px;border-radius:11px;background:linear-gradient(90deg,rgba(35,88,169,.22),rgba(81,42,153,.18));display:flex;flex-direction:column;gap:4px}.realStatus small{opacity:.65}

/* Struktur bleibt sichtbar, egal ob Wide Chat / Gaming / Carbon gewählt wird */
html[data-structure-layout="adminRight"] #layoutRightDock,
html[data-structure-layout="profileRight"] #layoutRightDock,
html[data-structure-layout="mediaRight"] #layoutRightDock,
html[data-structure-layout="onlineRight"] #layoutRightDock,
html[data-structure-layout="communicationRight"] #layoutRightDock,
html[data-structure-layout="dashboard"] #layoutRightDock,
html[data-structure-layout="aiDashboardChat"] #layoutRightDock{
  display:block!important
}

/* ===== 9.4.22 – VERSCHIEBBARE TRENNLINIEN + ECHTER HAUPT-ADMIN AVATAR ===== */
.layoutSplitter{
  position:absolute;
  top:0;
  bottom:0;
  width:10px;
  z-index:120;
  cursor:col-resize;
  touch-action:none;
  user-select:none;
}
.layoutSplitter::before{
  content:"";
  position:absolute;
  left:4px;
  top:0;
  bottom:0;
  width:2px;
  background:rgba(85,220,200,.18);
  transition:.15s ease;
}
.layoutSplitter:hover::before,
body.layoutDragging .layoutSplitter::before{
  background:var(--tpl-accent,#00eaff);
  box-shadow:0 0 10px color-mix(in srgb,var(--tpl-accent,#00eaff) 60%,transparent);
}
body.layoutDragging{
  cursor:col-resize!important;
  user-select:none!important;
}
body.layoutDragging *{
  cursor:col-resize!important;
}

@media(min-width:1050px){
  .waShell{position:relative!important}

  .splitterLeftMain{
    left:calc(var(--layout-rail,60px) + var(--mega-left-panel,245px) - 5px);
  }

  .splitterRightMain{
    right:calc(var(--layout-info,330px) - 5px);
  }

  .splitterRightMain[hidden]{display:none!important}
}
@media(max-width:1049px){
  .layoutSplitter{display:none!important}
}

.realAvatarImage{
  overflow:hidden!important;
  padding:0!important;
}
.realAvatarImage img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  border-radius:inherit!important;
  display:block!important;
}

/* ===== 9.4.23 – DAUERHAFTES LAYOUT-SPEICHERN ===== */
#layoutSave{box-shadow:0 0 0 2px rgba(45,210,115,.12),0 8px 20px rgba(0,0,0,.22)}

/* ===== 9.4.24 – RELOAD-FESTES LAYOUT ===== */
.layoutSafety::after{
  content:" · 9.4.24: Die komplette Struktur wird nach F5 wiederhergestellt.";
  font-weight:700;
}

/* ===== 9.4.25 – F5-FEST + UNTERE QUERLINIE VERSCHIEBBAR ===== */

@media(min-width:821px){
  .waMain{
    position:relative!important;
    display:grid!important;
    grid-template-rows:var(--layout-header,74px) minmax(0,1fr) var(--layout-composer,88px)!important;
    min-height:0!important;
  }

  .chatHeader{
    grid-row:1!important;
  }

  .messages{
    grid-row:2!important;
    min-height:0!important;
    overflow-y:auto!important;
  }

  .composer{
    grid-row:3!important;
    height:var(--layout-composer,88px)!important;
    min-height:58px!important;
    max-height:260px!important;
    box-sizing:border-box!important;
  }
}

.layoutSplitterHorizontal{
  position:absolute;
  left:0;
  right:0;
  height:12px;
  z-index:140;
  cursor:row-resize;
  touch-action:none;
  user-select:none;
}

.splitterBottomChat{
  bottom:calc(var(--layout-composer,88px) - 6px);
}

.layoutSplitterHorizontal::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:5px;
  height:2px;
  background:rgba(85,220,200,.18);
  transition:.15s ease;
}

.layoutSplitterHorizontal:hover::before,
body.layoutDraggingVertical .layoutSplitterHorizontal::before{
  background:var(--tpl-accent,#00eaff);
  box-shadow:0 0 10px color-mix(in srgb,var(--tpl-accent,#00eaff) 60%,transparent);
}

body.layoutDraggingVertical{
  cursor:row-resize!important;
  user-select:none!important;
}

body.layoutDraggingVertical *{
  cursor:row-resize!important;
}

@media(max-width:820px){
  .layoutSplitterHorizontal{display:none!important}
}

/* ===== 9.4.26 – NEON BG + RECHTE + TEMPLATE-FARBEN ===== */
.bgRights{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px}.bgRights span{padding:7px 9px;border-radius:9px;background:#10242b;border:1px solid #31505c;font-size:11px}
.bgUploadBox{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:center;margin:10px 0 16px}.neonBgGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}.neonBgCard{border:1px solid #31505c;border-radius:13px;background:#0c171d;overflow:hidden;padding-bottom:9px}.neonBgCard.selected{outline:3px solid var(--tpl-accent,#00eaff)}.neonBgCard img{width:100%;height:120px;object-fit:cover;display:block}.neonBgCard>div{display:flex;flex-direction:column;gap:2px;padding:8px}.neonBgCard small{opacity:.62}.neonBgCard button{margin:4px 8px 0;width:calc(100% - 16px)}
.bgEditGrid{display:grid;grid-template-columns:repeat(2,minmax(240px,1fr));gap:10px}.bgEditGrid label{display:grid;grid-template-columns:1fr auto;gap:5px;padding:10px;border:1px solid #294750;border-radius:10px;background:#0d1b21}.bgEditGrid input{grid-column:1/-1;width:100%}
.messages.userPersonalBg{position:relative!important;background-image:none!important;isolation:isolate!important}.messages.userPersonalBg::before{content:"";position:absolute;inset:-22px;background-image:linear-gradient(rgba(0,0,0,var(--user-bg-overlay,.25)),rgba(0,0,0,var(--user-bg-overlay,.25))),var(--user-bg-image);background-position:center,var(--user-bg-pos,50% 50%);background-size:cover,var(--user-bg-size,100%);background-repeat:no-repeat;filter:brightness(var(--user-bg-brightness,.55)) blur(var(--user-bg-blur,0px));z-index:0;pointer-events:none}.messages.userPersonalBg>*{position:relative;z-index:1}
.templateColorEditor{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:10px 0}.templateColorEditor label{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border:1px solid #31505c;border-radius:10px;background:#0d1b21}.templateColorEditor input[type=color]{width:54px;height:36px;border:0;background:none;padding:0;cursor:pointer}
.userBgRights{display:grid;gap:9px;margin:12px 0}.userBgRights label{padding:10px;border:1px solid #31505c;border-radius:10px;background:#0d1b21}
@media(max-width:720px){.bgUploadBox,.bgEditGrid{grid-template-columns:1fr}}

/* 9.4.27 BG visibility/live fix */
.messages.userPersonalBg{overflow:hidden!important;background:transparent!important}.messages.userPersonalBg::before{transform:translateZ(0);will-change:filter,background-position,background-size}.messages.userPersonalBg .message,.messages.userPersonalBg .msg{position:relative;z-index:2}

/* ===== 9.4.28 NEON STUDIO PRO – target layout + functional engines ===== */
.messages{position:relative!important}.messages.userPersonalBg{background:transparent!important;isolation:isolate!important}.userBgLayer{position:absolute!important;inset:0!important;overflow:hidden!important;z-index:0!important;pointer-events:none!important}.userBgLayer img{position:absolute!important;max-width:none!important;max-height:none!important;object-fit:cover!important;min-width:100%!important;min-height:100%!important;transition:filter .08s linear,width .08s linear,height .08s linear,left .08s linear,top .08s linear}.userBgShade{position:absolute;inset:0;z-index:2;pointer-events:none}.messages.userPersonalBg>.msgRow,.messages.userPersonalBg>.emptyState{position:relative!important;z-index:4!important}
.messages.userPersonalBg::before{display:none!important}
.mediaCenterMode>.chatHeader,.mediaCenterMode>.messages,.mediaCenterMode>.replybar,.mediaCenterMode>.composer,.mediaCenterMode>.layoutSplitterHorizontal{display:none!important}.mediaCenterMode{display:block!important;overflow:auto!important;background:var(--tpl-panel,#0b1118)!important}.mediaCenterPanel{min-height:100%;padding:20px;box-sizing:border-box;background:linear-gradient(180deg,var(--tpl-panel,#0b1118),#071019);color:#eef8ff}.mediaCenterHead{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(80,210,220,.25);padding-bottom:14px}.mediaCenterHead small{letter-spacing:.12em;color:var(--tpl-accent);font-size:10px}.mediaCenterHead h2{margin:4px 0}.mediaCenterHead button{background:#12232d;color:#fff;border:1px solid #31505c;border-radius:10px;padding:10px 14px}.mediaStats{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.mediaStats span{padding:8px 11px;border-radius:9px;background:#10212a;border:1px solid #274650}.mediaCenterGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}.mediaCenterCard{overflow:hidden;border-radius:13px;background:#0d1c25;border:1px solid #294a55}.mediaCenterCard img,.mediaCenterCard video{width:100%;height:170px;object-fit:cover;display:block}.mediaCenterCard>div:last-child{padding:10px;display:flex;flex-direction:column}.mediaCenterCard small{opacity:.65}.audioCard{height:170px;display:grid;place-items:center;font-size:38px}.audioCard audio{width:90%}.mediaCenterEmpty{grid-column:1/-1;min-height:430px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;border:1px dashed #31505c;border-radius:16px;background:#0a161d}.mediaCenterEmpty>div{font-size:58px}
.proColors label{display:grid!important;grid-template-columns:1fr 52px 90px!important}.colorHex,.proColorList input:not([type=color]){background:#071018;color:#dff;border:1px solid #294a55;border-radius:7px;padding:6px;font-family:monospace}.templateLiveHint{padding:9px 11px;border-radius:9px;background:rgba(0,220,210,.06);border:1px solid rgba(0,220,210,.22);font-size:11px;margin:8px 0}
.neonStudioPro{width:min(1500px,94vw);max-height:90vh;overflow:auto;background:#050a13;color:#edf8ff;border:1px solid #174a68;border-radius:16px;padding:14px;box-shadow:0 28px 90px rgba(0,0,0,.65)}.neonStudioTitle{display:flex;justify-content:space-between;align-items:center;padding:4px 4px 12px;border-bottom:1px solid #163c52}.neonStudioTitle b{font-size:28px}.neonStudioTitle em{font-style:normal;color:#29e2df}.neonStudioTitle small{display:block;opacity:.65}.neonStudioTitle button{background:#101d2a;color:#fff;border:1px solid #31505c;border-radius:9px;padding:8px}.neonStudioColumns{display:grid;grid-template-columns:.85fr 1.35fr 1.05fr;gap:12px;margin-top:12px}.neonPanel{border:1px solid #14506a;border-radius:12px;background:linear-gradient(180deg,#07131f,#08101a);padding:12px;min-width:0}.neonPanel h3{margin:0 0 10px;color:#c95cff;font-size:14px}.neonTemplateSelect{padding:10px;border-radius:9px;background:#0d1a27;display:flex;justify-content:space-between;margin-bottom:10px}.proColorList{display:grid;gap:7px}.proColorList label{display:grid;grid-template-columns:1fr 40px 88px;gap:7px;align-items:center}.proColorList input[type=color]{width:40px;height:32px;padding:0;border:0;background:none}.proPurple,.proGreen{width:100%;padding:11px;border:0;border-radius:8px;color:#fff;font-weight:900;margin-top:10px}.proPurple{background:linear-gradient(90deg,#5110a5,#8e21dc)}.proGreen{background:linear-gradient(90deg,#7a22ff,#d02cff)}.proBgGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.proBgGrid button{position:relative;padding:0;height:78px;border:1px solid #4e2876;background:#050812;border-radius:7px;overflow:hidden;cursor:pointer}.proBgGrid button.active{outline:3px solid #b542ff}.proBgGrid img{width:100%;height:100%;object-fit:cover}.proBgGrid i{position:absolute;left:3px;top:2px;z-index:2;background:#050812cc;border-radius:4px;padding:2px 4px;font-style:normal;font-size:10px}.proOwnBgButtons{display:flex;gap:7px;margin-top:8px}.proOwnBgButtons button,.neonStudioBottom button{flex:1;background:#0e1c28;border:1px solid #27566a;color:#fff;border-radius:8px;padding:9px}.proPreview{height:180px;overflow:hidden;border-radius:9px;background:#02060b;border:1px solid #173e56;display:flex;align-items:center;justify-content:center}.proPreview img{width:100%;height:100%;object-fit:cover;transition:.1s}.proSliders{display:grid;gap:8px;margin-top:9px}.proSliders label>span{display:flex;justify-content:space-between;font-size:11px}.proSliders input{width:100%}.neonStudioBottom{display:flex;gap:10px;margin-top:12px}.neonStudioBottom button:last-child{background:#b11d39}.neonBgCard img{filter:saturate(1.15) contrast(1.06)}
@media(max-width:1100px){.neonStudioColumns{grid-template-columns:1fr}.proBgGrid{grid-template-columns:repeat(4,1fr)}}


/* ===== 9.4.29 – NEON-BG + TEMPLATE-FARBEN VERBINDLICH ===== */
html body .waRail,html body .waSidebar,html body .chatHeader,html body .composer,html body .infoPanel,html body .layoutRightDock{background-color:var(--tpl-panel,#102129)!important;}
html body .sideHeader,html body .searchWrap,html body .sideContent,html body .replybar,html body .conversation.active{background-color:var(--tpl-panel2,#142a33)!important;}
html body .msgBubble,html body .messageBubble,html body .chatBubble{background-color:var(--tpl-bubble,#162b35)!important;}
html body .msgRow.mine .msgBubble,html body .message.own .msgBubble,html body .msg.own .msgBubble,html body .own .messageBubble,html body .own.chatBubble{background-color:var(--tpl-own,#47145f)!important;}
html body .sendButton,html body .railBtn.active,html body .templateCard.selected,html body .neonBgCard.selected{border-color:var(--tpl-accent,#00eaff)!important;}
html body .sendButton,html body .railBtn.active,html body .msgName{color:var(--tpl-accent,#00eaff)!important;}
.messages.userPersonalBg{background:none!important;background-color:transparent!important;background-image:none!important;}
.messages.userPersonalBg>.userBgLayer{display:block!important;z-index:0!important;}
.messages.userPersonalBg>.userBgLayer img{display:block!important;}

/* 9.4.30: BG-Auswahl breit + Hintergrund sicher sichtbar */
.modalbox.bgWideModal{width:min(1180px,96vw)!important;max-width:1180px!important;}
.modalbox.bgWideModal .neonBgGrid{grid-template-columns:repeat(3,minmax(240px,1fr))!important;}
.messages.userPersonalBg>.userBgLayer{z-index:1!important;opacity:1!important;visibility:visible!important;}
.messages.userPersonalBg>.msgRow,.messages.userPersonalBg>.emptyState{z-index:3!important;}
@media(max-width:900px){.modalbox.bgWideModal .neonBgGrid{grid-template-columns:repeat(2,minmax(190px,1fr))!important;}}


/* ===== 9.4.31 – GETESTETER BG-FALLBACK + BREITE VERSCHIEBBARE FENSTER ===== */
.modalbox.bgWideModal,.modalbox.studioWideModal{
  width:min(1450px,97vw)!important;max-width:1450px!important;
  min-width:min(760px,90vw);max-height:92vh!important;
  resize:both!important;overflow:auto!important;
}
.modalbox.studioWideModal .neonStudioPro{width:100%!important;max-width:none!important;min-width:1080px!important;box-sizing:border-box}
.modalbox.bgWideModal .neonBgGrid{grid-template-columns:repeat(3,minmax(300px,1fr))!important}
.modalMoveHandle{
  position:sticky;top:0;z-index:500;margin:-20px -20px 14px;padding:10px 16px;
  cursor:move;touch-action:none;user-select:none;background:linear-gradient(90deg,#0c2530,#101a28);
  border-bottom:1px solid #2b6670;color:#61e3dc;font-weight:900;letter-spacing:.02em
}
.modalMoveHandle span{float:right;color:#91a5ad;font-size:11px;font-weight:600}
body.movingModal,body.movingModal *{cursor:move!important;user-select:none!important}

/* Sichtbarer Hintergrund: direkte background-image ist Fallback; ::before liefert Blur/Live-Effekt. */
.messages.userPersonalBg{position:relative!important;isolation:isolate!important;overflow-y:auto!important;overflow-x:hidden!important}
.messages.userPersonalBg::before{
  display:block!important;content:""!important;position:absolute!important;inset:-22px!important;
  background-image:var(--user-bg-image)!important;background-size:var(--user-bg-size,100% auto)!important;
  background-position:var(--user-bg-pos,50% 50%)!important;background-repeat:no-repeat!important;
  filter:brightness(var(--user-bg-brightness,.6)) blur(var(--user-bg-blur,0px))!important;
  opacity:1!important;z-index:0!important;pointer-events:none!important
}
.messages.userPersonalBg::after{
  display:block!important;content:""!important;position:absolute!important;inset:0!important;
  background:rgba(0,0,0,var(--user-bg-overlay,.25))!important;z-index:1!important;pointer-events:none!important
}
.messages.userPersonalBg>.msgRow,.messages.userPersonalBg>.emptyState{position:relative!important;z-index:3!important}
@media(max-width:900px){.modalbox.bgWideModal,.modalbox.studioWideModal{min-width:0!important;width:96vw!important}.modalbox.studioWideModal .neonStudioPro{min-width:0!important}.modalbox.bgWideModal .neonBgGrid{grid-template-columns:1fr!important}}

/* ===== 9.4.33 – ALLE GRAU/GRUEN/SILBER-FARBEN PRO TEMPLATE ===== */
:root{
 --tpl-sidebar:#0f1921;--tpl-main:#091319;--tpl-header-bg:#121f28;--tpl-composer-bg:#111f27;
 --tpl-input-bg:#1b2f39;--tpl-button-bg:#1a2e38;--tpl-border:#29434f;--tpl-text:#e9edef;
 --tpl-muted:#8696a0;--tpl-silver:#aebac1;
}
body,.waShell{color:var(--tpl-text)!important}
.waRail,.waSidebar,.sideContent,.searchWrap,.infoPanel{background:var(--tpl-sidebar)!important}
.waMain,.messages:not(.userPersonalBg){background-color:var(--tpl-main)!important}
.chatHeader,.sideHeader,.infoHead,.pickerHead{background:var(--tpl-header-bg)!important}
.composer{background:var(--tpl-composer-bg)!important;border-color:var(--tpl-border)!important}
.composer input[type=text],.searchWrap input,.field,.authInput,.modal input,.modal select,.modal textarea{background:var(--tpl-input-bg)!important;border-color:var(--tpl-border)!important;color:var(--tpl-text)!important}
.composer button,.chatActions button,.sideHeader>button,.infoTabs button,.modal button:not(.primary):not(.danger),.railBtn:hover,.railBtn.active{background:var(--tpl-button-bg)!important;border-color:var(--tpl-border)!important;color:var(--tpl-silver)!important}
.msgBubble{background:var(--tpl-bubble)!important;border-color:var(--tpl-border)!important;color:var(--tpl-text)!important}
.mine .msgBubble{background:var(--tpl-own)!important;border-color:var(--tpl-accent)!important}
.conversation,.templateCard,.layoutCard,.structureCard,.neonBgCard,.bgEditGrid label,.templateColorEditor label{border-color:var(--tpl-border)!important}
.convBottom,.convTop time,.chatIdentity small,.hubText,.emptySide,.member small,.msgMeta,.templateText small{color:var(--tpl-muted)!important}
.railBtn,.composer button,.chatActions button{color:var(--tpl-silver)!important}
.primary,.sendButton,.infoTabs button.active{background:var(--tpl-accent)!important;color:#031713!important}
.templateColorEditor{grid-template-columns:repeat(auto-fit,minmax(235px,1fr))!important}

/* ===== SAFE BG BUTTONS ===== */
.neonBgCard .bgEditBtn,
.neonBgCard .bgDeleteBtn{
  margin:5px 8px 0;
  width:calc(100% - 16px);
  min-height:38px;
  border-radius:9px;
  font-weight:800;
  cursor:pointer;
}
.neonBgCard .bgEditBtn{
  border:1px solid var(--tpl-accent,#00eaff);
  background:#17313a;
  color:#fff;
}


/* ===== 9.4.39 TEMPLATE-/BG-KONSOLIDIERUNG ===== */
@media(min-width:821px){
  html body .waMain{position:relative!important;display:grid!important;grid-template-rows:var(--layout-header,74px) minmax(0,1fr) var(--layout-composer,88px)!important;min-width:0!important;min-height:0!important;overflow:hidden!important}
  html body .waMain>.chatHeader{grid-row:1!important;height:var(--layout-header,74px)!important;min-height:0!important}
  html body .waMain>.messages{grid-row:2!important;min-width:0!important;min-height:0!important;height:auto!important;overflow-y:auto!important;overflow-x:hidden!important}
  html body .waMain>.composer{grid-row:3!important;height:var(--layout-composer,88px)!important;min-height:58px!important;max-height:260px!important;margin-top:0!important}
}
@media(min-width:1050px){html body .waShell.structureHasRight #layoutRightDock{display:block!important;min-width:0!important;min-height:0!important;height:100vh!important;overflow-y:auto!important;overflow-x:hidden!important;position:relative!important}}
html body .messages.userPersonalBg::before,html body .messages.userPersonalBg::after{display:none!important;content:none!important}
html body .messages.userPersonalBg{position:relative!important;isolation:isolate!important;overflow-y:auto!important;overflow-x:hidden!important;background:transparent!important;background-image:none!important;background-color:transparent!important;background-attachment:scroll!important}
html body .messages.userPersonalBg>.userBgLayer{display:block!important;position:absolute!important;left:0!important;top:0!important;width:100%!important;height:100%!important;z-index:0!important;overflow:hidden!important;pointer-events:none!important;will-change:transform!important}
html body .messages.userPersonalBg>.userBgLayer>.userBgImage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;object-fit:cover!important;display:block!important;transition:filter .08s linear,transform .08s linear,object-position .08s linear!important}
html body .messages.userPersonalBg>.userBgLayer>.userBgShade{position:absolute!important;inset:0!important;z-index:1!important;pointer-events:none!important}
html body .messages.userPersonalBg>.msgRow,html body .messages.userPersonalBg>.emptyState,html body .messages.userPersonalBg>.typingBar,html body .messages.userPersonalBg>.announcementBar{position:relative!important;z-index:3!important}
html body .messages.userPersonalBg.customChatBackground{background-image:none!important}
html body .messages.customChatBackground{background-attachment:scroll!important}
html[data-chat-layout] .messages{overflow-y:auto!important;overflow-x:hidden!important}
html[data-structure-layout] .waMain{min-height:0!important}
:root{--tpl-sidebar:#0f1921}

/* ===== 9.4.40 – USER-BG AUCH IM ALLGEMEIN-CHAT ===== */
.waMain.hasUserChatBg,
.chatMain.hasUserChatBg,
.messagesWrap.hasUserChatBg,
.chatMessages.hasUserChatBg,
.messageArea.hasUserChatBg,
.chatArea.hasUserChatBg{
  position:relative;
  isolation:isolate;
  background:transparent !important;
}
.waMain.hasUserChatBg::before,
.chatMain.hasUserChatBg::before,
.messagesWrap.hasUserChatBg::before,
.chatMessages.hasUserChatBg::before,
.messageArea.hasUserChatBg::before,
.chatArea.hasUserChatBg::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background-image:var(--user-chat-bg);
  background-repeat:no-repeat;
  background-position:var(--user-chat-bg-x,50%) var(--user-chat-bg-y,50%);
  background-size:var(--user-chat-bg-size,100%);
  filter:brightness(var(--user-chat-bg-brightness,0.55)) blur(var(--user-chat-bg-blur,0px));
  transform:scale(1.01);
}
.waMain.hasUserChatBg::after,
.chatMain.hasUserChatBg::after,
.messagesWrap.hasUserChatBg::after,
.chatMessages.hasUserChatBg::after,
.messageArea.hasUserChatBg::after,
.chatArea.hasUserChatBg::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:rgba(0,0,0,var(--user-chat-bg-overlay,0.25));
}

/* ===== 9.4.42 – ALTES BG-SYSTEM KOMPLETT ENTFERNT ===== */
.messages.customChatBackground,
.chatMessages.customChatBackground,
.waMain.customChatBackground,
[data-design-bg]{
  background:none!important;
  background-image:none!important;
  background-attachment:initial!important;
}
.adminDesignLayer{
  display:none!important;
}

/* Alte Doppel-Layer auf .messages abschalten */
.messages.userPersonalBg::before,
.messages.userPersonalBg::after{
  content:none!important;
}

/* Persönlicher BG-Layer bleibt einzige BG-Quelle */
.userBgLayer{
  display:block!important;
}

/* ===== 9.4.44 BG ROOT FIX ===== */
.messages{position:relative!important;isolation:isolate!important}
.messages > .userBgLayer{
  position:absolute!important;inset:0!important;overflow:hidden!important;
  z-index:0!important;pointer-events:none!important
}
.messages > .userBgLayer .userBgImage{
  position:absolute!important;max-width:none!important;max-height:none!important
}
.messages > .userBgLayer .userBgShade{
  position:absolute!important;inset:0!important;pointer-events:none!important
}
.messages > :not(.userBgLayer){position:relative;z-index:1}
.bgConfirmOverlay{
  position:fixed;inset:0;z-index:999999;background:rgba(0,0,0,.68);
  display:flex;align-items:center;justify-content:center
}
.bgConfirmBox{
  width:min(460px,calc(100vw - 36px));background:#12232c;color:#fff;
  border:1px solid #385663;border-radius:14px;padding:22px;
  box-shadow:0 20px 70px rgba(0,0,0,.55)
}
.bgConfirmActions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
.bgConfirmActions button{padding:10px 16px;border-radius:8px;font-weight:800;cursor:pointer}
.bgConfirmActions .danger{background:#92252a;color:#fff;border:1px solid #d34b53}
.roomBgManager{margin:10px 0 16px;padding:12px;border:1px solid #3b6b79;border-radius:10px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:rgba(5,18,25,.86)}.roomBgManager b{margin-right:auto}.roomBgManager button,.roomBgUseBtn{padding:8px 10px;border-radius:8px;border:1px solid #3d7180;background:#12323c;color:#eff;font-weight:800;cursor:pointer}
/* ===== 9.4.47 – RAUMAUSWAHL FUER BG ===== */
.roomBgManager{align-items:flex-end!important}
.roomBgSelectorBlock{display:flex;flex-direction:column;gap:6px;min-width:320px;flex:1 1 420px}
.roomBgSelectorBlock select{min-height:42px;font-weight:800;background:#0f2831;color:#fff;border:1px solid #3f7282;border-radius:8px;padding:8px 10px}
.roomBgUseBtn{min-width:130px}

/* ===== 9.4.48 BG-RAUM + PERSOENLICHE 10ER-GALERIE ===== */
.bgTopActions{position:sticky;top:0;z-index:30;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;margin:-4px -2px 14px;background:#102630;border:1px solid #2f6472;border-radius:9px}
.bgTopActions>div{display:flex;gap:8px;align-items:center}.bgTopActions small{opacity:.75;margin-left:8px}
.myBgGallery{border:1px solid #2f6472;border-radius:10px;padding:12px;margin:12px 0;background:#0c1d25}
.myBgGallery h3{display:flex;justify-content:space-between;margin:0 0 6px}.bgPublicCheck{display:flex;align-items:center;gap:6px;white-space:nowrap}
.bgLegend{padding:10px 12px;margin:10px 0;border:1px solid #3a7d89;border-radius:8px;background:#102a32}
.neonBgCard.roomSelected{outline:3px solid #39d6ca;outline-offset:1px}
.roomBgUseBtn{font-weight:800}

/* 9.4.50 – nur eigene Raum-BGs */
.neonBuiltins,.builtinNeonSection{display:none!important}

.roomBgSection,.myBgGallery,.bgEditSection{border:1px solid #315e6b;border-radius:12px;padding:14px;margin:12px 0;background:#0b1c24}
.bgStrictInfo,.mainAdminRightsNote{padding:10px 12px;border:1px solid #347985;border-radius:8px;background:#102a32;color:#d8fbff}
.adminRoleBadge{display:block;margin-top:4px;font-weight:800;color:#6fe8df}
.adminBenutzer select:disabled{opacity:1;color:#fff;background:#17313a;border-color:#5caaa3}

.proPreview{overflow:hidden!important;position:relative!important;background:#061018!important}
.proPreview img{width:100%;height:100%;object-fit:cover;display:block;transform-origin:50% 50%}
.bgShareDialog{min-width:min(900px,92vw)}
.shareQuick{display:flex;gap:10px;margin:12px 0}
.shareRoomGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px;max-height:52vh;overflow:auto;padding:10px;border:1px solid #315e6b;border-radius:10px}
.shareRoomGrid label{padding:10px;border:1px solid #315e6b;border-radius:8px;background:#0d222b}

.mainAdminRoleRights{border:1px solid #39d8cf!important;background:#10272e!important}
.mainAdminRoleRights input:disabled{opacity:1}
.proPreview{position:relative!important;overflow:hidden!important}
.proPreview #proBgPreview{position:absolute!important;max-width:none!important;max-height:none!important}

/* 9.4.56 Raum-Symbole */
.roomAvatar.roomPicture{overflow:hidden;padding:0}
.roomAvatar.roomPicture img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.roomAvatar.roomFlag span{font-size:24px;line-height:1}
.bigRoomIcon img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.roomIconManage{margin:14px 0;padding:12px;border:1px solid var(--line);border-radius:12px}
.roomIconBtns{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}

/* 9.4.57 */
.langFlagSvg{display:inline-flex;width:25px;height:17px;vertical-align:middle;border-radius:2px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.22)}
.langFlagSvg svg{display:block;width:100%;height:100%}
.roomFlag .langFlagSvg{width:30px;height:20px;box-shadow:none}
.railCallControl{display:flex;flex-direction:column;gap:3px;margin:5px 4px;padding:4px;border:1px solid #2bcfc7;border-radius:10px;background:#102a30}
.railCallControl[hidden]{display:none!important}
.railCallControl button{width:38px;height:34px;border:0;border-radius:8px;cursor:pointer;font-weight:900}
#railCallOpen{background:#35d0c8;color:#061314} #railCallEnd{background:#8d2424;color:#fff}
.floatingCall.callRailDocked{right:72px!important;bottom:18px!important;width:260px!important;min-width:220px!important;min-height:0!important;resize:none!important}

/* 9.4.58 – nur Gruppen-Icon-Schnellwahl + Telefon neben Übersetzer */
.topCenterTools{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:25;display:flex;align-items:center;gap:10px}
.topCenterTools .topLanguage{position:static!important;left:auto!important;right:auto!important;top:auto!important;transform:none!important;z-index:auto!important}
.topPhoneTools{display:flex;align-items:center;gap:6px;padding:4px 7px;border:1px solid #31505c;border-radius:12px;background:#162831}
.topPhoneTools button{width:34px;height:34px;border:0;border-radius:9px;font-size:18px;font-weight:900;cursor:pointer}
.topPhoneCall{background:#1fa85a!important;color:#fff!important}.topPhoneCall:hover{background:#28c76f!important}
.topPhoneEnd{background:#b62d34!important;color:#fff!important}.topPhoneEnd:hover{background:#d43a43!important}
.topPhoneTools button:disabled{opacity:.38;cursor:not-allowed}
.topPhoneVolume{display:flex;align-items:center;gap:4px;color:#dce7eb;font-size:14px}
.topPhoneVolume input{width:92px;accent-color:#35d0c8}
#roomIconBtn{border-color:#35d0c8!important}
@media(max-width:1050px){.topPhoneVolume input{width:60px}.topCenterTools{gap:5px}.topPhoneTools{gap:3px;padding:3px}.topLanguage .langSelect{min-width:110px!important;max-width:130px!important}}

#topPhoneVolume:disabled{opacity:.35;cursor:not-allowed}
.historyAdminBox{border:1px solid #315e6b;border-radius:12px;padding:14px;background:#0b1c24;margin-bottom:18px}
.historyPolicyRow,.historyManualGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin:10px 0}
.historyPolicyRow label,.historyManualGrid label{display:flex;flex-direction:column;gap:6px}
.historyRoomStatus{padding:8px 10px;margin:8px 0;border-radius:8px;background:#112a32}
.historyWarning{margin-top:10px;padding:10px;border:1px solid #916d25;border-radius:8px;background:#2c2412;color:#ffe3a3}
.historyAuditList{max-height:220px;overflow:auto;margin-top:12px}.historyAuditList>div{padding:7px 4px;border-bottom:1px solid rgba(255,255,255,.08)}.historyAuditList small{display:block;opacity:.7}

/* 9.4.60 Sprach-Gruppenordner */
.langFolder{margin:7px 0;border:1px solid #2c5662;border-radius:11px;overflow:hidden;background:#0a1b22}
.langFolderHead{display:flex;align-items:center;justify-content:space-between;padding:9px 10px;cursor:pointer;background:#10272f}
.langFolderTitle{display:flex;align-items:center;gap:9px;min-width:0}.langFolderTitle b{overflow:hidden;text-overflow:ellipsis}.langFolderTitle>span:last-child{margin-left:auto;opacity:.7;font-size:12px}
.langFolderActions{display:flex;gap:5px}.langFolderActions button{width:30px;height:28px;border:1px solid #376d78;border-radius:7px;background:#14343d;color:#eaffff;cursor:pointer}
.langFolderChildren{padding:5px 5px 7px}.langFolderChildren[hidden]{display:none!important}
.langChild{margin-left:10px!important;border-left:2px solid #2aa7a0}.langFolderEmpty{padding:10px 12px;opacity:.65;font-size:12px}
.languageFolderList{margin-bottom:12px}

.languageFolderHero{position:relative;margin:6px 4px 10px;border:1px solid #315e6b;border-radius:10px;overflow:hidden;background:#08171d}
.languageFolderHero>img{display:block;width:100%;height:130px;object-fit:cover}
.languageFolderHeroPlaceholder{height:105px;display:flex;align-items:center;justify-content:center;gap:10px;flex-direction:column;background:#10272f;opacity:.85}
.languageFolderHeroPlaceholder .langFlagSvg{width:42px;height:28px}
.languageFolderHeroBar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;background:#10272f}
.languageFolderHeroBar>div{display:flex;gap:5px}.languageFolderHeroBar button{border:1px solid #376d78;border-radius:7px;background:#14343d;color:#eaffff;padding:6px 8px;cursor:pointer}
.createRoomHint{display:block;opacity:.7;margin:-4px 0 8px}

/* 9.4.62: eigener Raum-BG direkt beim Anlegen, Sprachgruppen-Original bleibt unverändert */
.newRoomBgBox{margin:12px 0;padding:12px;border:1px solid #315e6b;border-radius:10px;background:#0b1c24}
.newRoomBgBox>b{display:block;margin-bottom:9px}.newRoomBgBox small{display:block;opacity:.72;margin-top:7px}
.newRoomBgOr{text-align:center;opacity:.65;margin:8px 0}

/* 9.4.63 Artikelbereich nur für neu angelegte Untergruppen */
.articleHead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.articleHead small{display:block;opacity:.7}
.articleUploadBox{display:grid;gap:9px;padding:12px;margin-bottom:14px;border:1px solid #315e6b;border-radius:10px;background:#0b1c24}
.articleUploadBox.hidden{display:none!important}.articleUploadBox label{display:grid;gap:5px}
.roomArticleGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.roomArticleCard{overflow:hidden;border:1px solid #315e6b;border-radius:12px;background:#0b1c24}
.roomArticleCard>img{width:100%;height:150px;object-fit:cover;display:block;background:#061018}
.roomArticleBody{padding:10px;display:grid;gap:6px}.roomArticleBody>span{font-size:12px;font-weight:800;opacity:.75}.roomArticleBody p{margin:0;white-space:pre-wrap}
.roomArticleBody small{opacity:.65}.roomArticleActions{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-top:4px}
.articleDownload{display:inline-flex;text-decoration:none;padding:7px 10px;border-radius:8px}

.topArticleTools{display:flex;gap:6px;align-items:center}
.topArticleTools[hidden]{display:none!important}
.topArticleBtn{border:1px solid #315e6b;border-radius:9px;padding:7px 10px;font-weight:800;cursor:pointer;white-space:nowrap}
.topArticleBtn.upload{background:#00eaff;color:#071713}
.topArticleBtn.download{background:#203744;color:#efffff}
.topArticleBtn:hover{filter:brightness(1.08)}
@media(max-width:1150px){.topArticleBtn{padding:6px 8px;font-size:12px}}

/* 9.4.65 - echte Artikelbibliothek als eigenes Fenster */
.articleModalTop{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.articleModalTop h2{margin:0 0 4px}.articleModalTop p{margin:0;opacity:.75}
.closeArticleModal{border:1px solid #375c67;background:#142b34;color:#fff;border-radius:9px;width:38px;height:38px;cursor:pointer}
.articleAdminBar{display:flex;justify-content:flex-end;margin-bottom:10px}
.directArticleUploadBox{display:grid;grid-template-columns:repeat(2,minmax(220px,1fr));gap:10px;padding:14px;border:1px solid #315e6b;border-radius:12px;background:#0b1c24;margin-bottom:15px}
.directArticleUploadBox.hidden{display:none!important}
.directArticleUploadBox label{display:grid;gap:5px}
.directArticleUploadBox label:nth-child(3),.directArticleUploadBox label:nth-child(4),.directArticleUploadBox label:nth-child(5),.directArticleUploadBox .wide{grid-column:1/-1}
.articleLibraryGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;max-height:65vh;overflow:auto;padding-right:4px}
.articleLibraryCard{border:1px solid #315e6b;border-radius:12px;overflow:hidden;background:#0b1c24}
.articleLibraryImage{height:170px;background:#071116}
.articleLibraryImage img{width:100%;height:100%;display:block;object-fit:cover}
.articleNoImage{height:100%;display:grid;place-items:center;font-size:42px;opacity:.6}
.articleLibraryInfo{padding:11px;display:grid;gap:7px}
.articleLibraryInfo>b{font-size:17px}.articleCategory{display:inline-flex;width:max-content;padding:3px 7px;border-radius:999px;background:#18343d;font-size:12px}
.articleLibraryInfo p{margin:0;white-space:pre-wrap}
.articleLibraryInfo small{opacity:.7}
.articleLibraryActions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.articleDirectDownload{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;background:#00eaff;color:#071713;font-weight:900;padding:9px 12px;border-radius:8px}
.articleEmptyState{grid-column:1/-1;min-height:220px;display:grid;place-items:center;text-align:center;border:1px dashed #315e6b;border-radius:12px;padding:25px}
.articleEmptyState>b{display:block;font-size:18px}.articleEmptyState span{opacity:.7}
@media(max-width:850px){.directArticleUploadBox{grid-template-columns:1fr}.directArticleUploadBox label,.directArticleUploadBox .wide{grid-column:1!important}}

/* 9.4.66 - zentraler ETS2/ATS Download-Reiter */
.downloadsSideHead{padding:10px 12px;font-weight:900;opacity:.85}
.downloadCategoryBtn{width:calc(100% - 12px);margin:3px 6px;padding:10px 11px;border:1px solid #2c5662;border-radius:9px;background:#10272f;color:#eef;display:flex;justify-content:space-between;cursor:pointer;text-align:left}
.downloadCategoryBtn.active{border-color:#00eaff;background:#16363b}
.downloadCategoryBtn span{opacity:.65}
.globalDownloadsPage{height:100%;overflow:auto;padding:18px 20px 24px;background:#07141b}
.globalDownloadsHeader{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}
.globalDownloadsHeader h2{margin:0 0 6px}.globalDownloadsHeader p{margin:0;opacity:.72}
.downloadCount{padding:8px 11px;border:1px solid #315e6b;border-radius:9px;background:#10272f;white-space:nowrap}
.globalDownloadsGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:14px}
.globalDownloadCard{border:1px solid #315e6b;border-radius:12px;overflow:hidden;background:#0b1c24}
.globalDownloadImage{height:180px;background:#061017;display:grid;place-items:center;font-size:40px}
.globalDownloadImage img{width:100%;height:100%;object-fit:cover;display:block}
.globalDownloadInfo{padding:12px;display:grid;gap:7px}
.globalDownloadTop{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.globalDownloadTop b{font-size:17px}.globalDownloadTop span{font-size:12px;padding:3px 7px;border-radius:999px;background:#18343d;white-space:nowrap}
.globalDownloadInfo p{margin:0;white-space:pre-wrap}.globalDownloadInfo small{opacity:.68}.globalDownloadFile{font-size:13px;opacity:.8}
.globalDownloadButton{display:inline-flex;align-items:center;justify-content:center;padding:10px 12px;border-radius:8px;background:#00eaff;color:#071713;text-decoration:none;font-weight:900}
.downloadHubLoading{height:100%;display:grid;place-items:center;font-size:20px}

/* 9.4.67 - Downloads bleiben im Chat; kein Seitenwechsel */
.articleDirectDownload,.globalDownloadButton{
  border:0;cursor:pointer;font-family:inherit
}
.articleDirectDownload:disabled,.globalDownloadButton:disabled{opacity:.65;cursor:wait}

/* 9.4.68 hierarchical ETS2/ATS download catalog */
.downloadCategoryBtn b,.downloadSubCategoryBtn b{font-size:11px;opacity:.72;white-space:nowrap}
.downloadSubCategoryBtn{width:calc(100% - 24px);margin:3px 12px;padding:8px 10px;border:1px solid #274a55;border-radius:8px;background:#0d2027;color:#eef;display:flex;justify-content:space-between;cursor:pointer;text-align:left}
.downloadSubCategoryBtn.active{border-color:#00eaff;background:#15343a}
.downloadsSideHead.sub{margin-top:10px;padding-top:12px;border-top:1px solid #294a54}
.globalDownloadsHeaderActions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.categoryManagerAdd{display:flex;gap:8px;align-items:center;margin:8px 0}
.categoryManagerList{display:grid;gap:10px;max-height:58vh;overflow:auto;margin:12px 0}
.categoryManagerCard{padding:12px;border:1px solid #315e6b;border-radius:10px;background:#0b1c24}
.categoryManagerCard>div:first-of-type{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.categoryManagerCard span{padding:4px 7px;border-radius:999px;background:#17343c;font-size:12px}

.downloadGameSwitch{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px}.downloadGameSwitch button{padding:10px;border:1px solid #315e6b;border-radius:9px;background:#10272f;color:#fff;font-weight:900;cursor:pointer}.downloadGameSwitch button.active{background:#00eaff;color:#071713}
.catalogManagerTop{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.catalogManagerTop h2{margin:0 0 5px}.catalogManagerTop p{margin:0;opacity:.72}
.catalogNewMain{display:grid;grid-template-columns:1fr auto;gap:8px;margin-bottom:14px}.catalogManagerList{display:grid;gap:12px;max-height:60vh;overflow:auto;padding-right:4px}.catalogCategoryCard{border:1px solid #315e6b;border-radius:12px;padding:12px;background:#0b1c24}.catalogCategoryHeader{display:grid;grid-template-columns:1fr auto;gap:8px}.catalogActions{display:flex;gap:6px}.catalogChildList{display:grid;gap:7px;margin:10px 0}.catalogChildRow{display:grid;grid-template-columns:1fr auto auto;gap:6px}.catalogAddChild{display:grid;grid-template-columns:1fr auto;gap:8px}.catalogManagerFooter{display:flex;justify-content:flex-end;margin-top:14px}
.globalDownloadsHeaderActions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.globalUploadForm{display:grid;grid-template-columns:1fr 1fr;gap:10px}.globalUploadForm label{display:grid;gap:5px}.globalUploadForm label:nth-child(5),.globalUploadForm label:nth-child(6),.globalUploadForm label:nth-child(7),.globalUploadForm .wide{grid-column:1/-1}.secondary{background:#20343e;color:#fff;border:1px solid #315e6b;border-radius:8px;padding:10px;cursor:pointer}

/* 9.4.70 - vereinfachte, bedienbare Kategorienverwaltung */
.catalogGameTabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.catalogGameTabs button{padding:10px;border:1px solid #315e6b;border-radius:9px;background:#10272f;color:#fff;font-weight:900;cursor:pointer}
.catalogGameTabs button.active{background:#00eaff;color:#071713}
.catalogCreateMain{display:grid;grid-template-columns:1fr auto;gap:8px;margin-bottom:14px}
.catalogEditorLayout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:12px;min-height:440px;max-height:62vh}
.catalogMainList{border:1px solid #315e6b;border-radius:10px;padding:10px;overflow:auto;background:#08171e}
.catalogMainList>b{display:block;margin:2px 4px 9px}
.catalogMainSelect{width:100%;display:grid;gap:2px;text-align:left;padding:10px;margin:0 0 6px;border:1px solid #294b55;border-radius:8px;background:#10272f;color:#fff;cursor:pointer}
.catalogMainSelect small{opacity:.65}.catalogMainSelect.active{border-color:#00eaff;background:#16363b}
.catalogEditPane{border:1px solid #315e6b;border-radius:10px;padding:12px;overflow:auto;background:#0b1c24}
.catalogEditTitle{font-weight:900;font-size:16px;margin-bottom:8px}.catalogEditTitle.subTitle{margin-top:18px}
.catalogMainEditRow{display:grid;grid-template-columns:minmax(180px,1fr) auto auto;gap:7px}
.catalogSubRows{display:grid;gap:7px}.catalogSubRow{display:grid;grid-template-columns:minmax(180px,1fr) auto auto;gap:7px}
.catalogAddSubRow{display:grid;grid-template-columns:minmax(180px,1fr) auto;gap:7px;margin-top:12px;padding-top:12px;border-top:1px solid #294b55}
.catalogEmptySelection{display:grid;place-items:center;height:100%;opacity:.7;text-align:center;padding:20px}
.catalogManagerFooter{display:flex;justify-content:flex-end;margin-top:12px}
@media(max-width:900px){
 .catalogEditorLayout{grid-template-columns:1fr;max-height:none}.catalogMainList{max-height:220px}
 .catalogMainEditRow,.catalogSubRow,.catalogAddSubRow,.catalogCreateMain{grid-template-columns:1fr}
}

/* 9.4.71 - ETS2/ATS switch + article editing */
.catalogGameTabs button{pointer-events:auto!important;position:relative;z-index:2}
.globalDownloadCardActions{display:flex;gap:8px;flex-wrap:wrap}
.globalEditDownloadButton{border:1px solid #315e6b;border-radius:8px;background:#203744;color:#fff;font-weight:800;padding:9px 12px;cursor:pointer}
.globalEditDownloadButton:hover{filter:brightness(1.08)}

/* 9.4.72 - Kategorienfenster breit/ziehbar + feste Bedienbereiche */
.modalbox:has(.catalogManagerShell){
  width:min(1180px,94vw)!important;
  max-width:none!important;
  height:min(760px,88vh)!important;
  max-height:none!important;
  resize:both!important;
  overflow:hidden!important;
  min-width:760px;
  min-height:520px;
}
.catalogManagerShell{height:100%;display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;gap:10px}
.catalogManagerTop{margin-bottom:0}
.catalogEditorLayout{min-height:0;height:100%;max-height:none}
.catalogMainList,.catalogEditPane{min-height:0;height:100%;overflow:auto}
.catalogManagerFooter{
  position:static!important;
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center;
  margin:0!important;
  padding-top:8px;
  border-top:1px solid #294b55;
}
.catalogManagerFooter #closeCatManager{min-width:130px}
.catalogAddSubRow{
  position:sticky;
  bottom:0;
  background:#0b1c24;
  padding-bottom:4px;
  z-index:2
}
.globalDeleteDownloadButton{
  border:1px solid #9b2d2d;border-radius:8px;background:#8e2222;color:#fff;font-weight:800;padding:9px 12px;cursor:pointer
}
.globalEditDownloadButton{background:#1f3e49}
.globalDownloadCardActions{margin-top:4px}

.movableResizableModal{width:min(1180px,94vw)!important;height:min(760px,88vh)!important;max-width:none!important;max-height:none!important;min-width:700px!important;min-height:460px!important;resize:both!important;overflow:auto!important;box-sizing:border-box!important;z-index:72!important}
.downloadCategoryShell{height:100%;min-height:420px;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:10px}
.downloadCategoryDrag{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:9px;border-bottom:1px solid #294b55;user-select:none}
.downloadCategoryDrag h2{margin:0 0 4px}.downloadCategoryDrag p{margin:0;opacity:.7}
.downloadCategoryToolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.downloadSubChips{display:flex;gap:6px;flex-wrap:wrap;max-height:80px;overflow:auto}.downloadSubChips span{padding:5px 8px;border-radius:999px;background:#17343c;font-size:12px}
.downloadCategoryContent{overflow:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:12px;align-content:start;padding-right:3px}
.categoryArticleCard{border:1px solid #315e6b;border-radius:12px;overflow:hidden;background:#0b1c24}.categoryArticleImage{height:180px;background:#071116;display:grid;place-items:center;font-size:42px}.categoryArticleImage img{width:100%;height:100%;object-fit:cover}.categoryArticleBody{padding:11px;display:grid;gap:7px}.categoryArticleHead{display:flex;justify-content:space-between;gap:8px}.categoryArticleHead b{font-size:17px}.categoryArticleHead span{padding:3px 7px;border-radius:999px;background:#17343c;font-size:12px}.categoryArticleBody p{margin:0;white-space:pre-wrap}.categoryArticleBody small{opacity:.7}.categoryArticleActions{display:flex;gap:7px;flex-wrap:wrap}
.categoryEmptyState{grid-column:1/-1;min-height:240px;display:grid;place-items:center;text-align:center;border:1px dashed #315e6b;border-radius:12px;padding:25px}
.downloadCategoryFooter{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding-top:9px;border-top:1px solid #294b55;position:static!important}
.createArticleShell{grid-template-rows:auto minmax(0,1fr) auto}.categoryCreateForm{overflow:auto}

/* 9.4.74 - PayPal Unterstützung */
.donationRailBtn img{width:26px;height:26px;object-fit:contain;border-radius:7px;display:block;margin:auto}
.donationDialog{display:grid;gap:14px;min-width:min(520px,80vw)}
.donationHeader{display:flex;gap:13px;align-items:center}.donationHeader img{width:64px;height:64px;object-fit:contain;border-radius:12px}.donationHeader>span{font-size:46px}.donationHeader h2{margin:0 0 4px}.donationHeader p{margin:0;opacity:.75}
.donationAmounts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.donationAmounts button{padding:13px 8px;border:1px solid #315e6b;border-radius:9px;background:#12303a;color:#fff;font-weight:900;cursor:pointer}.donationAmounts button:hover{border-color:#00eaff;background:#173d43}
.donationCustom{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.donationCustom span{font-weight:900}
.donationNote{font-size:12px;opacity:.65;padding:9px;border:1px solid #294b55;border-radius:8px}.donationFooter{display:flex;justify-content:flex-end;gap:8px}
.donationAdminBox{display:grid;gap:9px;padding:12px;border:1px solid #315e6b;border-radius:10px;background:#0b1c24}
.donationAdminIconRow{display:grid;grid-template-columns:70px minmax(180px,1fr) auto auto;gap:8px;align-items:center}.donationIconPreview{width:64px;height:64px;border:1px solid #315e6b;border-radius:10px;display:grid;place-items:center;font-size:34px;overflow:hidden}.donationIconPreview img{width:100%;height:100%;object-fit:contain}.donationAdminHint{font-size:12px;opacity:.7}
@media(max-width:800px){.donationAmounts{grid-template-columns:1fr 1fr}.donationAdminIconRow{grid-template-columns:1fr}}

/* 9.4.75 - Rollenanzeige/Zentrale */
.compactRoleProfile{margin-bottom:10px}
.realDockHead small{letter-spacing:.08em}

/* 9.4.76 Rollenmatrix + getrennte PayPal-Systeme */
#rightsBox{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
.rightsRole{border:1px solid #315e6b;border-radius:10px;padding:10px;display:grid;gap:5px;align-content:start}
.rightsRoleHead{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-bottom:7px;border-bottom:1px solid #294b55}
.rightsRole label{font-size:13px;padding:3px 0}
.donationRecipients{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.donationRecipient{display:grid;place-items:center;gap:4px;padding:10px;border:1px solid #315e6b;border-radius:10px;background:#0b1c24;color:#fff;cursor:pointer}
.donationRecipient.selected{outline:2px solid #00eaff}.donationRecipient img{width:48px;height:48px;object-fit:contain;border-radius:8px}.donationRecipient>span{font-size:35px}

/* 9.4.77 - lesbare Rollenverwaltung */
#rightsBox{
  display:block!important;
  width:100%;
  min-width:0;
}
.rightsTabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-bottom:12px;
}
.rightsTab{
  min-height:44px;
  border:1px solid #315e6b;
  border-radius:10px;
  background:#10272f;
  color:#fff;
  font-weight:900;
  font-size:15px;
  cursor:pointer;
}
.rightsTab.active{
  background:#00eaff;
  color:#061315;
  border-color:#00eaff;
}
.rightsSingleRole{
  border:1px solid #315e6b;
  border-radius:12px;
  background:#0b1c24;
  padding:14px;
  min-width:0;
}
.rightsSingleHeader{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding-bottom:12px;
  margin-bottom:12px;
  border-bottom:1px solid #294b55;
}
.rightsSingleHeader h3{
  margin:0 0 4px;
  font-size:21px;
}
.rightsSingleHeader p{
  margin:0;
  opacity:.72;
  line-height:1.35;
}
.rightsResetBtn{
  border:1px solid #315e6b;
  border-radius:9px;
  background:#17343c;
  color:#fff;
  padding:10px 13px;
  font-weight:800;
  cursor:pointer;
  white-space:nowrap;
}
.rightsGrid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 14px;
}
.rightsItem{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:start;
  gap:9px;
  min-width:0;
  padding:8px 10px;
  border:1px solid #23414b;
  border-radius:8px;
  background:#10242c;
  line-height:1.3;
}
.rightsItem input{
  margin-top:2px;
}
.rightsItem span{
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
}
#saveRightsAdmin{
  margin-top:12px;
  min-height:44px;
  font-size:15px;
  font-weight:900;
}
@media(max-width:900px){
  .rightsGrid{grid-template-columns:1fr}
  .rightsSingleHeader{align-items:flex-start;flex-direction:column}
  .rightsResetBtn{width:100%}
}

/* 9.4.78 Social Login & Kontoverknüpfung */
.profileSocialBox{margin-top:16px;padding:12px;border:1px solid #315e6b;border-radius:10px;background:#0b1c24}
.profileSocialBox h3{margin:0 0 5px}.profileSocialBox p{margin:0 0 10px;opacity:.72}
.profileSocialRow{display:grid;grid-template-columns:minmax(90px,1fr) minmax(130px,1fr) auto;gap:8px;align-items:center;padding:8px;border-top:1px solid #23414b}
.profileSocialRow button{border:1px solid #315e6b;border-radius:8px;background:#17343c;color:#fff;padding:7px 10px;cursor:pointer}
.socialLoginBtn.socialReady{font-weight:800}.socialLoginBtn.socialNeedsSetup{opacity:.55}
@media(max-width:650px){.profileSocialRow{grid-template-columns:1fr}.profileSocialRow button{width:100%}}

/* 9.4.97: Nur Google, Facebook und Telegram – mittig untereinander */
.authCard .socialGrid{grid-template-columns:minmax(220px,320px)!important;justify-content:center!important;align-items:center!important;gap:9px!important}.authCard .socialGrid .socialLoginBtn{width:100%!important}


/* 9.5 SCS-WERKSTATT – nur additive Styles */
.scsRailBtn{position:relative}.scsRailBadge{position:absolute;right:2px;top:2px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:#e53935;color:#fff;font:700 10px/16px Arial;text-align:center}.scsRailBadge.scsReadyBadge{background:#16a36a;box-shadow:0 0 0 2px rgba(22,163,106,.18),0 0 10px rgba(22,163,106,.7)}.scsWorkshopMode .composer{display:none!important}.scsWorkshopMode #messages{padding:0!important;overflow:auto!important}.scsWorkshop{min-height:100%;background:#0c151a}.scsBgPreview{height:520px;min-height:260px;max-height:900px;background-color:#081116;background-image:linear-gradient(135deg,#16252b,#2b454b);background-size:contain;background-repeat:no-repeat;background-position:center;position:relative;border-bottom:0;transition:height .08s linear}.scsBgResizeHandle{height:14px;cursor:ns-resize;display:flex;align-items:center;justify-content:center;background:#0b171c;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.13);user-select:none;touch-action:none}.scsBgResizeHandle span{display:block;width:120px;height:4px;border-radius:4px;background:#456771;box-shadow:0 0 8px rgba(82,216,202,.28)}.scsBgResizeHandle:hover span{background:#55e7ff}.scsResizing,.scsResizing *{cursor:ns-resize!important;user-select:none!important}.scsBgPreview:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,10,13,.72),rgba(4,10,13,.16) 58%,rgba(4,10,13,.28))}.scsBgCaption{position:absolute;z-index:1;left:26px;bottom:24px;max-width:650px;padding:15px 18px;border-radius:14px;background:rgba(9,18,22,.72);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(3px)}.scsBgCaption small{letter-spacing:.18em;color:#7fefff}.scsBgCaption h2{margin:5px 0 4px;font-size:28px}.scsBgCaption p{margin:0;color:#d7e2e5}.scsContent{padding:18px 24px 28px;background:#0c151a}.scsUploadCard,.scsOrders{background:#111e24;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px;margin:0 0 16px}.scsUploadCard h3,.scsOrders h3{margin:0 0 14px}.scsGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.scsUploadCard label{display:grid;gap:6px;margin:10px 0;color:#c9d6da}.scsProgress{margin-top:10px;color:#64eaff;font-weight:700}.scsOrder{border:1px solid rgba(255,255,255,.1);border-radius:13px;padding:14px;margin:10px 0;background:#16262d}.scsOrderHead{display:flex;gap:12px;justify-content:space-between;align-items:flex-start}.scsOrderHead>div{display:grid;gap:3px}.scsOrderHead small{color:#91a3a9}.scsStatus{padding:6px 9px;border-radius:10px;background:#223840;white-space:nowrap}.scsMeta{display:flex;gap:12px;flex-wrap:wrap;margin:10px 0;color:#a9bac0}.scsActions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}.scsActions button,.scsRepairUpload{border:1px solid #38535d;background:#1a3038;color:#eef7f8;border-radius:9px;padding:9px 12px;cursor:pointer}.scsActions button:hover,.scsRepairUpload:hover{filter:brightness(1.15)}.scsActions .paid{background:#20583f;border-color:#388c67}.scsActions .scsDeleteBtn{background:#3a1d22;border-color:#7b3640;color:#ffdce0}.scsDonate{display:flex;gap:8px;flex-wrap:wrap;align-items:center;width:100%;padding:10px;border-radius:10px;background:rgba(16,49,45,.7)}.scsDonate label{display:flex;gap:6px;align-items:center}.scsDonate input{width:80px;background:#0f1b20;color:white;border:1px solid #46616a;border-radius:7px;padding:7px}.scsDonate small{width:100%;color:#a8b9bd}.scsSideBox{display:grid;gap:10px;padding:14px}.scsSideBox small{color:#8fa4aa}.scsSideCount{padding:10px;border-radius:10px;background:#17282f}.scsEmpty{padding:24px;text-align:center;color:#91a3a9}@media(max-width:850px){.scsGrid{grid-template-columns:1fr}.scsOrderHead{display:grid}.scsBgPreview{height:360px;min-height:220px}.scsBgCaption{left:12px;right:12px;bottom:12px}.scsContent{padding:12px}}


/* ================================================================
   K&L WERKSTATT - EXAKTER NEON LOOK (global, additive override)
   Nur Darstellung. Funktionslogik bleibt unangetastet.
   ================================================================ */
:root{
  --kl-black:#02030a;
  --kl-black2:#050711;
  --kl-panel:#080b17;
  --kl-panel2:#0d1020;
  --kl-blue:#0b1730;
  --kl-cyan:#00eaff;
  --kl-cyan2:#4cf6ff;
  --kl-violet:#7a22ff;
  --kl-purple:#a100ff;
  --kl-magenta:#ff2bd6;
  --kl-text:#f4f7ff;
  --kl-muted:#aab4cf;
  --kl-border:#183a68;
  --kl-glow-c:0 0 8px rgba(0,234,255,.72),0 0 20px rgba(0,234,255,.24);
  --kl-glow-m:0 0 8px rgba(255,43,214,.68),0 0 20px rgba(161,0,255,.22);
}
html,body,#app{background:var(--kl-black)!important;color:var(--kl-text)!important}
body{background:
  radial-gradient(circle at 18% 8%,rgba(0,234,255,.10),transparent 30%),
  radial-gradient(circle at 84% 10%,rgba(161,0,255,.14),transparent 36%),
  linear-gradient(135deg,#02030a 0%,#050711 48%,#09051a 100%)!important}

/* Hauptflächen */
.waRail,.waSidebar,.infoPanel,.realDock,.realDockPanel,.rightDock,.sidebarPanel,
.globalDownloadsPage,.mediaHubPage,.mediaCenterPage,.scsWorkshop,.scsContent,
.adminPage,.profilePage,.settingsPage,.templatesPage,.designStudioPage,
.chatPage,.mainView,.pageView,.contentPage{
  background:linear-gradient(180deg,#050711 0%,#070b16 58%,#050711 100%)!important;
}
.waRail{border-right:1px solid rgba(0,234,255,.42)!important;box-shadow:4px 0 18px rgba(0,234,255,.08)!important}
.waSidebar{border-right:1px solid rgba(161,0,255,.55)!important;box-shadow:5px 0 20px rgba(161,0,255,.10)!important}
.infoPanel,.realDock,.rightDock{border-left:1px solid rgba(0,234,255,.45)!important;box-shadow:-5px 0 20px rgba(0,234,255,.08)!important}
.waMain{background:#02030a!important}

/* Kopfbereiche */
.sideHeader,.chatHeader,.infoHead,.pickerHead,.realDockHead,.pageHeader,.panelHeader,
.modalHeader,.downloadCategoryDrag,.globalDownloadsHeader,.mediaHeader{
  background:linear-gradient(90deg,#07101c 0%,#090b1c 45%,#160924 100%)!important;
  border-bottom:1px solid rgba(0,234,255,.42)!important;
  box-shadow:0 4px 18px rgba(122,34,255,.10)!important;
}

/* Karten / Boxen */
.authCard,.modalbox,.picker,.adminStats div,.adminUser,.rightsRole,.rightsSingleRole,.rightsItem,
.globalDownloadCard,.categoryManagerCard,.catalogCategoryCard,.catalogMainList,.catalogEditPane,
.categoryArticleCard,.donationDialog,.donationAdminBox,.donationRecipient,.profileSocialBox,
.scsUploadCard,.scsOrders,.scsOrder,.scsSideCount,.neonPanel,.templateCard,.neonBgCard,
.mediaCard,.galleryCard,.statCard,.dashboardCard,.panelCard,.settingCard,.dockCard,
.conversation,.searchHit,.member{
  background:linear-gradient(145deg,rgba(7,11,23,.97),rgba(11,13,31,.97))!important;
  border-color:rgba(53,128,203,.62)!important;
}
.authCard,.modalbox,.donationDialog,.picker,.rightsSingleRole,.catalogEditPane,.globalDownloadCard,
.scsUploadCard,.scsOrders,.dashboardCard,.panelCard{
  box-shadow:0 0 0 1px rgba(0,234,255,.08),0 0 22px rgba(0,234,255,.07),0 0 30px rgba(161,0,255,.06)!important;
}

/* Linke Chatliste */
.conversation{margin:4px 8px!important;border:1px solid rgba(36,88,150,.58)!important;border-radius:10px!important}
.conversation:hover{background:linear-gradient(90deg,rgba(0,234,255,.10),rgba(161,0,255,.10))!important;border-color:rgba(0,234,255,.72)!important;box-shadow:var(--kl-glow-c)!important}
.conversation.active{background:linear-gradient(90deg,rgba(0,234,255,.14),rgba(122,34,255,.18))!important;border-color:#00eaff!important;box-shadow:0 0 9px rgba(0,234,255,.65),0 0 18px rgba(161,0,255,.28)!important}
.convTop b,.chatIdentity b,.infoHead b,.realDockHead b{color:#f8fbff!important}
.convBottom,.convTop time,.chatIdentity small,.member small,.sideHeader small,.emptySide,.hubText{color:var(--kl-muted)!important}

/* Navigation / Icons */
.railBtn,.chatActions button,.composer button,.topPhoneTools button,.realDock button{
  color:#d9e6ff!important;
}
.railBtn:hover,.railBtn.active,.chatActions button:hover,.composer button:hover{
  color:#00eaff!important;background:rgba(0,234,255,.07)!important;
  box-shadow:inset 0 0 12px rgba(0,234,255,.10),0 0 12px rgba(0,234,255,.18)!important
}
.railBtn.active{outline:1px solid rgba(255,43,214,.65)!important;border-radius:12px!important}

/* Inputs */
.authInput,.field,.searchWrap input,.composer input[type=text],input:not([type=checkbox]):not([type=radio]):not([type=color]),select,textarea{
  background:#080d1b!important;color:#f7f9ff!important;border:1px solid #245681!important;
  box-shadow:inset 0 0 10px rgba(0,234,255,.035)!important;
}
.authInput:focus,.field:focus,.searchWrap input:focus,.composer input[type=text]:focus,input:focus,select:focus,textarea:focus{
  border-color:#00eaff!important;outline:none!important;box-shadow:0 0 0 1px rgba(0,234,255,.22),0 0 14px rgba(0,234,255,.25)!important
}

/* Buttons – Werkstatt Neon */
.primary,.authPrimary,.sendButton,.globalDownloadButton,.articleDirectDownload,
.downloadGameSwitch button.active,.catalogGameTabs button.active,.rightsTab.active,
#saveRightsAdmin,.proPurple,.templateUseBtn,.bgUseBtn,.wide.primary,
button[data-primary="true"]{
  background:linear-gradient(90deg,#00d8ff 0%,#4667ff 46%,#b628ff 76%,#ff2bd6 100%)!important;
  color:#fff!important;border:1px solid #58efff!important;
  box-shadow:0 0 8px rgba(0,234,255,.55),0 0 16px rgba(161,0,255,.34),inset 0 0 12px rgba(255,255,255,.09)!important;
  text-shadow:0 1px 3px #000!important
}
.primary:hover,.authPrimary:hover,.globalDownloadButton:hover,.articleDirectDownload:hover,.rightsTab.active:hover,#saveRightsAdmin:hover{
  filter:brightness(1.15) saturate(1.18)!important;box-shadow:0 0 12px rgba(0,234,255,.75),0 0 24px rgba(255,43,214,.42)!important
}
.secondary,.sideHeader button,.socialGrid button,.globalEditDownloadButton,.downloadCategoryBtn,
.downloadSubCategoryBtn,.catalogMainSelect,.catalogGameTabs button,.downloadGameSwitch button,
.donationAmounts button,.rightsTab,.rightsResetBtn,.profileSocialRow button,.scsActions button,.scsRepairUpload,
.neonStudioBottom button,.proOwnBgButtons button,.globalPlayer button,.mediaTop button{
  background:linear-gradient(145deg,#091020,#0d1020 62%,#130a24)!important;color:#f3f6ff!important;
  border:1px solid #285d8b!important;box-shadow:inset 0 0 12px rgba(122,34,255,.05)!important
}
.secondary:hover,.downloadCategoryBtn:hover,.downloadSubCategoryBtn:hover,.catalogMainSelect:hover,
.donationAmounts button:hover,.rightsTab:hover,.rightsResetBtn:hover,.profileSocialRow button:hover,.socialGrid button:hover{
  border-color:#b62dff!important;box-shadow:0 0 10px rgba(0,234,255,.24),0 0 14px rgba(255,43,214,.22)!important
}
.downloadCategoryBtn.active,.downloadSubCategoryBtn.active,.catalogMainSelect.active,.donationRecipient.selected{
  background:linear-gradient(90deg,rgba(0,234,255,.16),rgba(161,0,255,.24))!important;
  color:#fff!important;border-color:#00eaff!important;outline-color:#ff2bd6!important
}

/* Chatblasen */
.messages{background-color:#02030a!important;background-image:radial-gradient(rgba(0,234,255,.055) 1px,transparent 1px)!important}
.msgBubble,.messageBubble,.chatBubble{
  background:linear-gradient(145deg,#0a1428,#0c1731)!important;
  border:1px solid rgba(0,234,255,.36)!important;box-shadow:0 0 10px rgba(0,234,255,.06)!important
}
.msgRow.mine .msgBubble,.message.own .msgBubble,.msg.own .msgBubble,.own .messageBubble,.own.chatBubble{
  background:linear-gradient(145deg,#35104d 0%,#501168 55%,#641379 100%)!important;
  border:1px solid rgba(255,43,214,.62)!important;box-shadow:0 0 10px rgba(255,43,214,.18)!important
}
.msgName{color:#00eaff!important;text-shadow:0 0 8px rgba(0,234,255,.45)!important}
.mine .msgName{color:#ff78e8!important;text-shadow:0 0 8px rgba(255,43,214,.40)!important}
.quoted,.replybar{border-color:#a72bff!important;background:rgba(85,19,117,.28)!important}
.reacts span{background:#11162b!important;border:1px solid rgba(161,0,255,.38)!important}

/* Rahmen / Reiter / Chips */
.templateCard.selected,.neonBgCard.selected,.activeTab,.tab.active,.tabs button.active,
.mediaTabs button.active,.templateTabs button.active{
  border-color:#00eaff!important;outline-color:#ff2bd6!important;
  box-shadow:0 0 8px rgba(0,234,255,.45),0 0 15px rgba(255,43,214,.22)!important
}

/* Downloads / Medien */
.globalDownloadsPage,.mediaHubPage,.mediaCenterPage{background:#03050c!important}
.globalDownloadCard,.categoryArticleCard{border:1px solid rgba(0,234,255,.38)!important}
.globalDownloadTop span,.categoryManagerCard span,.downloadSubChips span{background:#16112b!important;border:1px solid rgba(255,43,214,.32)!important;color:#d9c4ff!important}
.categoryEmptyState{border-color:rgba(0,234,255,.38)!important;background:#060a14!important}

/* SCS Werkstattseiten */
.scsWorkshop,.scsContent{background:#03050c!important}
.scsBgResizeHandle{background:#070914!important;border-color:rgba(122,34,255,.35)!important}
.scsBgResizeHandle span{background:#00eaff!important;box-shadow:0 0 10px rgba(0,234,255,.55),0 0 15px rgba(161,0,255,.24)!important}
.scsBgCaption{background:rgba(3,5,12,.82)!important;border:1px solid rgba(0,234,255,.42)!important;box-shadow:0 0 18px rgba(161,0,255,.16)!important}
.scsBgCaption small,.scsProgress{color:#53f5ff!important}
.scsUploadCard,.scsOrders,.scsOrder,.scsSideCount{background:linear-gradient(145deg,#070b16,#0c1021)!important;border-color:rgba(51,111,177,.52)!important}
.scsDonate{background:linear-gradient(90deg,rgba(0,234,255,.07),rgba(161,0,255,.12))!important;border:1px solid rgba(161,0,255,.30)!important}

/* Modale / Admin */
.modal{background:rgba(0,0,5,.84)!important;backdrop-filter:blur(3px)}
.modalbox{border:1px solid rgba(0,234,255,.50)!important;box-shadow:0 0 20px rgba(0,234,255,.12),0 0 40px rgba(161,0,255,.12)!important}
.adminStats div{border:1px solid rgba(161,0,255,.38)!important}.adminStats b{color:#53f5ff!important;text-shadow:0 0 8px rgba(0,234,255,.30)!important}
.rightsSingleHeader,.rightsRoleHead,.catalogManagerFooter,.downloadCategoryFooter{border-color:rgba(161,0,255,.34)!important}

/* Login */
.auth{background:
 radial-gradient(circle at 22% 10%,rgba(0,234,255,.20),transparent 34%),
 radial-gradient(circle at 82% 18%,rgba(161,0,255,.25),transparent 40%),
 linear-gradient(135deg,#02030a,#07101b 50%,#120821)!important}
.authCard{background:linear-gradient(160deg,rgba(5,8,18,.98),rgba(9,9,25,.98))!important;border:1px solid #00eaff!important;box-shadow:0 0 15px rgba(0,234,255,.24),0 0 34px rgba(161,0,255,.22),0 25px 80px #000c!important}
.authLogo{background:linear-gradient(135deg,#00eaff 0 46%,#8b2bff 52%,#ff2bd6 100%)!important;color:white!important;border:1px solid #7ff7ff!important;box-shadow:0 0 12px rgba(0,234,255,.65),0 0 22px rgba(255,43,214,.45)!important;text-shadow:0 1px 3px #000!important}
.authCard h1{color:#fff!important;text-shadow:0 0 10px rgba(0,234,255,.20)!important}.authCard p,.socialDivider{color:#abb7cf!important}

/* Online/Offline bleiben absichtlich Statusfarben */
.presence.online,.statusOnline,.onlineDot{background:#22c55e!important}
.presence.offline,.statusOffline,.offlineDot{background:#ef4444!important}

/* K&L Werkstatt Hauptlogo als Neon-Wortmarke, ohne Bilddatei */
.authLogo{font-size:0!important;position:relative;overflow:visible!important}
.authLogo:before{content:"K&L";font-size:22px;font-weight:1000;letter-spacing:-1px;color:#fff;text-shadow:-2px 0 7px #00eaff,2px 0 7px #ff2bd6,0 0 12px #7a22ff}
.authLogo:after{content:"♛";position:absolute;top:-20px;left:50%;transform:translateX(-50%);font-size:18px;color:#ff66ea;text-shadow:0 0 8px #00eaff,0 0 10px #ff2bd6}

/* 9.4.103 — K&L Werkstatt Neon exakt: Cyan/Magenta/Violett, kein Gruen als Designfarbe */
:root{--kl-cyan:#00eaff;--kl-magenta:#ff2bd6;--kl-purple:#9b2cff;--kl-deep:#05030f}
.waRail,.waSidebar,.infoPanel,.realDock,.rightDock,.sidebarPanel{background:linear-gradient(180deg,#03040c,#080316 58%,#03040c)!important}
.waSidebar{border-right:1px solid #9b2cff!important;box-shadow:4px 0 16px rgba(155,44,255,.22)!important}
.infoPanel,.realDock,.rightDock{border-left:1px solid #00eaff!important;box-shadow:-4px 0 16px rgba(0,234,255,.16)!important}
.sideHeader,.chatHeader,.infoHead,.realDockHead{background:linear-gradient(90deg,#070616 0%,#10051e 55%,#190629 100%)!important;border-bottom:1px solid #8e2cff!important}
.conversation{background:linear-gradient(145deg,#07091a,#0d061d)!important;border-color:#55218a!important;box-shadow:inset 0 0 12px rgba(155,44,255,.05)!important}
.conversation:hover{border-color:#d52bff!important;box-shadow:0 0 9px rgba(255,43,214,.30),inset 0 0 12px rgba(0,234,255,.08)!important}
.conversation.active{background:linear-gradient(90deg,rgba(0,234,255,.14),rgba(155,44,255,.22),rgba(255,43,214,.13))!important;border-color:#00eaff!important;box-shadow:0 0 9px rgba(0,234,255,.62),0 0 18px rgba(255,43,214,.25)!important}
.railBtn{border:1px solid transparent!important}.railBtn:hover,.railBtn.active{background:linear-gradient(145deg,rgba(0,234,255,.08),rgba(155,44,255,.14))!important;border-color:#6928bd!important;color:#e45cff!important;box-shadow:0 0 10px rgba(155,44,255,.36),inset 0 0 12px rgba(0,234,255,.06)!important}
.chatActions button,.realDock button,.infoPanel button,.topPhoneTools button{background:linear-gradient(145deg,#09091b,#10051d)!important;border-color:#6728a6!important;box-shadow:0 0 7px rgba(155,44,255,.12)!important}
.chatActions button:hover,.realDock button:hover,.infoPanel button:hover{border-color:#00eaff!important;box-shadow:0 0 9px rgba(0,234,255,.30),0 0 12px rgba(255,43,214,.15)!important}
.brandMark,.brandKL{background:linear-gradient(135deg,#00eaff 0%,#00bfe9 30%,#8b2cff 62%,#ff2bd6 100%)!important;color:#fff!important;border:1px solid #5ff4ff!important;box-shadow:0 0 8px rgba(0,234,255,.62),0 0 14px rgba(255,43,214,.35)!important;font-style:italic!important;font-weight:1000!important;text-shadow:-1px 0 5px #00eaff,1px 0 5px #ff2bd6!important}
.brandMark:before,.brandKL:before{content:"♛";position:absolute;transform:translate(17px,-18px);font-style:normal;color:#ff5de4;text-shadow:0 0 7px #00eaff,0 0 8px #ff2bd6;font-size:13px}
.composer{background:linear-gradient(90deg,#080817,#10051c)!important;border-top:1px solid #6928bd!important}.composer input[type=text]{border-color:#6928bd!important;background:#070817!important}.composer input[type=text]:focus{border-color:#00eaff!important;box-shadow:0 0 9px rgba(0,234,255,.25)!important}
.sendButton,.composer button:last-child{border-color:#00eaff!important;box-shadow:0 0 9px rgba(0,234,255,.50),0 0 14px rgba(155,44,255,.24)!important}
/* Gruene UI-Designreste neutralisieren; echte Online-/Offline-Statusfarben bleiben unten bestehen */
.authTab.active,.authTabs button.active{background:linear-gradient(90deg,#00d8ff,#7d35ff,#ff2bd6)!important;color:#fff!important;border-color:#62f2ff!important;box-shadow:0 0 9px rgba(0,234,255,.4),0 0 12px rgba(255,43,214,.25)!important}
.authHint,.notice,.successBox{background:linear-gradient(90deg,rgba(0,234,255,.08),rgba(155,44,255,.12))!important;border-color:#6728a6!important;color:#dfeaff!important}
/* Status-Ausnahme */
.presence.online,.statusOnline,.onlineDot{background:#22c55e!important}.presence.offline,.statusOffline,.offlineDot{background:#ef4444!important}

/* ===== 9.4.104 – NUR LOGIN-FARBEN + VIDEOPLAYER BLACK =====
   Funktionslogik unveraendert. Keine globalen Seitenfarben angefasst. */

/* LOGIN: letzte gruenen/teal Flaechen konsequent in Cyan/Violett/Magenta */
.authModeTabs button{
  background:linear-gradient(145deg,#070b17,#0b0d1d 65%,#13081f)!important;
  color:#eef3ff!important;
  border:1px solid #285d8b!important;
  box-shadow:inset 0 0 12px rgba(122,34,255,.06)!important;
}
.authModeTabs button:hover{
  border-color:#00eaff!important;
  box-shadow:0 0 9px rgba(0,234,255,.35),0 0 14px rgba(255,43,214,.18)!important;
}
.authModeTabs button.active{
  background:linear-gradient(90deg,#00d8ff 0%,#4967ff 45%,#a72bff 72%,#ff2bd6 100%)!important;
  color:#fff!important;
  border-color:#68f5ff!important;
  box-shadow:0 0 10px rgba(0,234,255,.55),0 0 18px rgba(255,43,214,.30)!important;
}
.publicRegisterHint,.authHint{
  background:linear-gradient(90deg,rgba(0,216,255,.10),rgba(167,43,255,.14),rgba(255,43,214,.10))!important;
  border:1px solid #7134a8!important;
  color:#dfeaff!important;
  box-shadow:inset 0 0 12px rgba(0,234,255,.04)!important;
}
.socialLoginBtn,.authCard .socialGrid .socialLoginBtn{
  background:linear-gradient(145deg,#070b17,#0c0e1c 70%,#13091e)!important;
  color:#f4f7ff!important;
  border:1px solid #245f87!important;
  box-shadow:inset 0 0 10px rgba(122,34,255,.05)!important;
}
.socialLoginBtn:hover,.authCard .socialGrid .socialLoginBtn:hover{
  background:linear-gradient(90deg,rgba(0,216,255,.10),rgba(167,43,255,.16))!important;
  border-color:#b52cff!important;
  box-shadow:0 0 8px rgba(0,234,255,.28),0 0 12px rgba(255,43,214,.20)!important;
}
.socialLoginBtn.socialReady{
  border-color:#00eaff!important;
  box-shadow:inset 0 0 0 1px rgba(0,234,255,.18),0 0 10px rgba(122,34,255,.16)!important;
}
.authSwitch{
  background:linear-gradient(145deg,#080d1b,#11102a)!important;
  color:#eef3ff!important;
  border-color:#7134a8!important;
}
.authSwitch:hover{background:linear-gradient(90deg,#0a1427,#211036)!important;border-color:#00eaff!important}

/* VIDEOPLAYER: Bildflaeche und Playerkarte schwarz; nur Neon-Rand bleibt */
.chatVideoPost{
  background:#000!important;
  border:1px solid #8f23d8!important;
  box-shadow:0 0 8px rgba(0,234,255,.15),0 0 14px rgba(255,43,214,.18)!important;
}
.chatPostedVideo,.msgBubble video,.messageBubble video,.chatBubble video{
  background:#000!important;
}
.chatVideoCaption{background:#000!important;color:#eef3ff!important;border-top:1px solid rgba(0,234,255,.22)!important}
.msgRow.mine .msgBubble:has(.chatVideoPost),
.message.own .msgBubble:has(.chatVideoPost),
.msg.own .msgBubble:has(.chatVideoPost),
.own .messageBubble:has(.chatVideoPost),
.own.chatBubble:has(.chatVideoPost){
  background:#000!important;
  border-color:#a72bff!important;
  box-shadow:0 0 10px rgba(0,234,255,.16),0 0 18px rgba(255,43,214,.20)!important;
}


/* 9.4 – Linke Reiter scrollbar + Gruppen-Regeln */
.waRail{
  height:100vh!important;
  max-height:100vh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  flex-wrap:nowrap!important;
  align-content:flex-start!important;
}
.waRail .railBtn,.waRail .railTop{flex-shrink:0!important}
.waRail .railSpacer{flex:1 0 18px!important;min-height:18px!important}
.waRail::-webkit-scrollbar{width:8px}
.waRail::-webkit-scrollbar-thumb{background:rgba(0,234,255,.45);border-radius:10px}
.waRail::-webkit-scrollbar-track{background:rgba(0,0,0,.18)}
.groupRulesMode>.chatHeader,.groupRulesMode>.messages,.groupRulesMode>.composer,.groupRulesMode>.replybar{display:none!important}
.groupRulesPanel{display:block;min-width:0;min-height:0;height:100%;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable}
.groupRulesSide{margin:12px;padding:18px 12px;border:1px solid rgba(0,234,255,.28);border-radius:14px;text-align:center;background:rgba(4,10,20,.6)}
.groupRulesSideIcon{font-size:34px;margin-bottom:8px}.groupRulesSide b,.groupRulesSide small{display:block}.groupRulesSide small{margin-top:5px;color:var(--tpl-muted,#aab4cf)}
.groupRulesPage{width:min(1100px,calc(100% - 32px));margin:20px auto 40px}.groupRulesHeader{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 22px;border:1px solid rgba(0,234,255,.32);border-radius:16px;background:rgba(4,8,20,.82)}
.groupRulesHeader small{color:#00eaff;font-weight:800;letter-spacing:.14em}.groupRulesHeader h2{margin:4px 0 6px}.groupRulesHeader p{margin:0;color:var(--tpl-muted,#aab4cf)}
.groupRulesList{display:grid;gap:14px;margin-top:16px}.groupRuleCard{padding:18px 20px;border:1px solid rgba(0,234,255,.24);border-radius:14px;background:rgba(5,8,19,.82)}
.groupRuleHead{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.groupRuleHead span{font-size:11px;color:#00eaff;font-weight:900;letter-spacing:.12em}.groupRuleHead h3{margin:4px 0 10px}.groupRuleActions{display:flex;gap:8px;flex-wrap:wrap}.groupRuleActions button{padding:8px 11px;border-radius:9px}.groupRuleText{line-height:1.6;white-space:normal;color:var(--tpl-text,#f4f7ff)}
.groupRulesEmpty,.groupRulesLoading{margin:26px;padding:28px;text-align:center;border:1px dashed rgba(0,234,255,.3);border-radius:14px;color:var(--tpl-muted,#aab4cf)}
.groupRuleEditor{width:min(720px,92vw)}.groupRuleEditor label{display:block;margin:14px 0 6px;font-weight:800}.groupRuleEditor textarea{resize:vertical;min-height:220px}.groupRuleEditorButtons{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
@media(max-height:800px){.waRail{padding-top:6px!important;padding-bottom:6px!important}.railBtn{flex:0 0 44px!important}}

/* 9.4 – Korrektur Gruppen-Regeln Hauptbereich: eigener Vollflaechen-Reiter */
.waMain.groupRulesMode{
  display:block!important;
  overflow:hidden!important;
  position:relative!important;
  height:100vh!important;
  min-height:0!important;
  background:var(--tpl-panel,#0b1118)!important;
}
.waMain.groupRulesMode>.groupRulesPanel{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  box-sizing:border-box!important;
  z-index:5!important;
}
