:root{--bg:#090d18;--panel:#111827;--panel2:#182235;--line:#29344a;--text:#f7f8fb;--muted:#9aa6bb;--accent:#7c3aed;--accent2:#06b6d4;--danger:#ef4444;--success:#22c55e}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,Arial,sans-serif;background:radial-gradient(circle at top,#17203a,#070b14 55%);color:var(--text)}a{color:inherit}.auth-page{min-height:100vh;display:grid;place-items:center;padding:24px}.auth-card{width:min(430px,100%);background:rgba(17,24,39,.94);border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:32px;box-shadow:0 30px 80px rgba(0,0,0,.35);text-align:center}.auth-card.wide{width:min(820px,100%)}.brand-mark{width:68px;height:68px;margin:auto;border-radius:20px;display:grid;place-items:center;font-size:32px;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--accent2))}.muted,small{color:var(--muted)}label{display:block;text-align:left;margin:16px 0 7px;font-size:14px;font-weight:600}input{width:100%;background:#0b1220;border:1px solid var(--line);color:var(--text);border-radius:12px;padding:13px 14px;outline:none}input:focus{border-color:var(--accent)}.btn{border:0;border-radius:12px;padding:12px 18px;font-weight:700;cursor:pointer}.btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:white;width:100%;margin-top:18px}.text-link{display:inline-block;margin-top:18px;color:#a78bfa}.alert{padding:12px;border-radius:12px;margin:16px 0}.alert.error{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.4)}.alert.success{background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.4)}.grid-form{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.grid-form .full{grid-column:1/-1}.app-shell{height:100vh;display:grid;grid-template-columns:240px minmax(0,1fr) 280px;background:var(--bg)}.sidebar,.rightbar{background:#0c1322;border-color:var(--line);padding:20px}.sidebar{border-right:1px solid var(--line);display:flex;flex-direction:column}.rightbar{border-left:1px solid var(--line)}.logo{font-size:21px;font-weight:800;margin-bottom:28px}.sidebar h3,.rightbar h3{font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.room{display:block;width:100%;text-align:left;padding:11px 12px;margin:4px 0;background:transparent;border:0;color:var(--muted);border-radius:10px;cursor:pointer}.room.active,.room:hover{background:var(--panel2);color:white}.sidebar-footer{margin-top:auto;display:grid;gap:4px;padding-top:18px;border-top:1px solid var(--line)}.sidebar-footer a{color:#fca5a5;font-size:13px;margin-top:8px}.chat-main{display:grid;grid-template-rows:auto 1fr auto;min-width:0}.topbar{display:flex;justify-content:space-between;gap:20px;padding:16px 22px;border-bottom:1px solid var(--line);background:#0c1322}.topbar>div:first-child{display:grid;gap:4px}.topbar span{font-size:13px;color:var(--muted)}.stream-box{display:flex;align-items:center;gap:12px;min-width:360px;background:var(--panel2);border:1px solid var(--line);padding:10px 14px;border-radius:14px}.stream-box div{display:grid}.play{border:0;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));color:white}.messages{padding:24px;overflow:auto;background:linear-gradient(rgba(8,13,24,.94),rgba(8,13,24,.94)),radial-gradient(circle at 20% 10%,#312e81,transparent 35%)}.message{display:flex;gap:12px;margin-bottom:20px}.avatar{width:42px;height:42px;flex:0 0 42px;border-radius:14px;display:grid;place-items:center;background:#26324a;font-weight:800}.avatar.online{position:relative}.avatar.online:after{content:"";position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;background:var(--success);border:2px solid #0c1322}.message p{margin:6px 0;color:#dce3ef;line-height:1.5}.message.system{background:rgba(124,58,237,.09);border:1px solid rgba(124,58,237,.25);padding:14px;border-radius:16px}.composer{display:grid;grid-template-columns:auto 1fr auto;gap:10px;padding:16px 22px;background:#0c1322;border-top:1px solid var(--line)}.composer button:first-child{background:transparent;border:0;font-size:22px}.composer .btn{width:auto;margin:0}.user-card{display:flex;gap:12px;align-items:center;padding:12px;background:var(--panel2);border-radius:14px}.user-card div:last-child{display:grid}.radio-card{margin-top:24px;padding:16px;background:linear-gradient(135deg,rgba(124,58,237,.14),rgba(6,182,212,.08));border:1px solid var(--line);border-radius:16px}.radio-card p{color:var(--muted);line-height:1.5}@media(max-width:1000px){.app-shell{grid-template-columns:200px 1fr}.rightbar{display:none}.stream-box{min-width:280px}}@media(max-width:720px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.topbar{align-items:flex-start;flex-direction:column}.stream-box{min-width:0;width:100%}.grid-form{grid-template-columns:1fr}.grid-form .full{grid-column:auto}}
select{width:100%;background:#0b1220;border:1px solid var(--line);color:var(--text);border-radius:12px;padding:13px 14px;outline:none}.logo small{font-size:11px}.admin-link{color:#67e8f9!important}.btn.secondary{background:var(--panel2);border:1px solid var(--line);text-decoration:none}.admin-head{display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:left}.admin-card small{display:block;margin-top:7px}.stream-copy{min-width:0}.stream-copy strong,.stream-copy small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:330px}.status-line{display:flex;align-items:center;gap:8px;margin:10px 0}.status-dot{width:10px;height:10px;border-radius:50%;background:var(--danger)}.status-dot.online{background:var(--success);box-shadow:0 0 12px rgba(34,197,94,.8)}.radio-card small{display:block;margin-top:8px}.message small{font-size:11px}.messages:empty:before{content:'Noch keine Nachrichten in diesem Raum.';color:var(--muted)}
/* v0.3 Admin-Dashboard und Branding */
.logo{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.logo img{width:38px;height:38px;object-fit:contain;border-radius:10px}.logo span{max-width:145px}.branded-auth{background:radial-gradient(circle at top,#17203a,#070b14 55%)}.login-layout{width:min(920px,100%);padding:0;display:grid;grid-template-columns:1.05fr .95fr;overflow:hidden;text-align:left}.login-visual{min-height:600px;background:linear-gradient(rgba(8,13,24,.18),rgba(8,13,24,.75)),var(--login-image,linear-gradient(135deg,#312e81,#0e7490));background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:38px}.login-visual>div{display:grid;gap:10px}.login-visual span{font-size:48px}.login-visual strong{font-size:28px}.login-form-area{padding:44px;display:flex;flex-direction:column;justify-content:center}.login-form-area .brand-mark{margin:0}.brand-logo{max-width:180px;max-height:90px;object-fit:contain;margin-bottom:18px}.messages{background-image:linear-gradient(rgba(8,13,24,var(--background-darkness,.82)),rgba(8,13,24,var(--background-darkness,.82))),var(--chat-background,radial-gradient(circle at 20% 10%,#312e81,transparent 35%));background-size:cover;background-position:center;background-attachment:local}.admin-page{min-height:100vh;background:#080d17}.admin-shell{min-height:100vh;display:grid;grid-template-columns:250px 1fr}.admin-sidebar{background:#0c1322;border-right:1px solid var(--line);padding:24px;display:flex;flex-direction:column}.admin-brand{display:grid;gap:4px;margin-bottom:30px}.admin-brand strong{font-size:18px}.admin-brand small{font-size:12px}.admin-sidebar nav{display:grid;gap:6px}.admin-sidebar nav a{padding:12px 14px;border-radius:11px;text-decoration:none;color:var(--muted)}.admin-sidebar nav a:hover,.admin-sidebar nav a.active{color:#fff;background:linear-gradient(135deg,rgba(124,58,237,.28),rgba(6,182,212,.14));border:1px solid rgba(255,255,255,.07)}.admin-sidebar-bottom{margin-top:auto;display:grid;gap:10px;border-top:1px solid var(--line);padding-top:18px}.admin-sidebar-bottom a{text-decoration:none;color:var(--muted)}.admin-content{padding:32px;min-width:0}.admin-top h1{margin:0}.admin-top p{color:var(--muted);margin:8px 0 26px}.admin-panel{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:24px;margin-top:20px}.admin-panel h2{margin-top:0}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat-grid article{background:linear-gradient(135deg,var(--panel),var(--panel2));border:1px solid var(--line);border-radius:18px;padding:22px;display:grid;gap:5px}.stat-grid strong{font-size:28px}.stat-grid span{color:var(--muted)}.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.quick-grid a{background:var(--panel2);border:1px solid var(--line);padding:18px;border-radius:14px;text-decoration:none}.upload-card{background:#0b1220;border:1px solid var(--line);border-radius:16px;padding:16px;margin-top:16px}.upload-card img,.image-placeholder{width:100%;height:170px;object-fit:cover;border-radius:12px;background:#111827;display:grid;place-items:center;color:var(--muted);margin-top:12px}.btn.danger{background:rgba(239,68,68,.15);color:#fecaca;border:1px solid rgba(239,68,68,.35);margin-top:10px}.check-row{display:flex;align-items:center;gap:10px;background:#0b1220;border:1px solid var(--line);padding:14px;border-radius:12px}.check-row input{width:auto}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:13px;border-bottom:1px solid var(--line);vertical-align:middle}th{color:var(--muted);font-size:12px;text-transform:uppercase}td small{display:block}.role-form{display:flex;gap:8px;align-items:center}.role-form select{min-width:130px}.role-badge{display:inline-block;padding:5px 9px;border-radius:999px;background:var(--panel2);font-size:12px}.role-superadmin{background:rgba(239,68,68,.18);color:#fecaca}.role-admin{background:rgba(249,115,22,.18);color:#fed7aa}.role-moderator{background:rgba(6,182,212,.18);color:#a5f3fc}.role-dj{background:rgba(168,85,247,.18);color:#e9d5ff}@media(max-width:900px){.admin-shell{grid-template-columns:1fr}.admin-sidebar{position:static}.admin-sidebar nav{grid-template-columns:repeat(2,1fr)}.admin-sidebar-bottom{margin-top:20px}.stat-grid{grid-template-columns:repeat(2,1fr)}.login-layout{grid-template-columns:1fr}.login-visual{min-height:260px}.login-form-area{padding:30px}}@media(max-width:600px){.admin-content{padding:18px}.stat-grid,.quick-grid{grid-template-columns:1fr}.admin-sidebar nav{grid-template-columns:1fr}.login-visual{display:none}.login-layout{display:block}.role-form{min-width:190px}}

/* v0.4 Smiley-Verwaltung */
.smiley-admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.smiley-admin-card{background:#0b1220;border:1px solid var(--line);border-radius:16px;padding:16px}.smiley-admin-card>img{width:64px;height:64px;object-fit:contain;display:block;margin:0 auto 12px}.smiley-admin-card .btn{width:100%;margin-top:10px}.smiley-picker{position:absolute;left:22px;bottom:78px;z-index:20;width:min(360px,calc(100% - 44px));max-height:220px;overflow:auto;background:#0c1322;border:1px solid var(--line);border-radius:16px;padding:12px;box-shadow:0 18px 50px rgba(0,0,0,.45);display:flex;flex-wrap:wrap;gap:8px}.smiley-picker[hidden]{display:none}.smiley-picker button{width:42px;height:42px;border:1px solid transparent;border-radius:10px;background:var(--panel2);cursor:pointer}.smiley-picker button:hover{border-color:var(--accent)}.smiley-picker img{width:42px;height:42px;object-fit:contain;vertical-align:middle;transform:scale(1.35);transform-origin:center}.chat-smiley{width:58px;height:58px;max-width:58px;max-height:58px;object-fit:contain;vertical-align:middle;margin:2px 7px;image-rendering:auto;transform:scale(1.35);transform-origin:center}.message-content,.message-text{overflow:visible}@media(max-width:640px){.chat-smiley{width:48px;height:48px;max-width:48px;max-height:48px;transform:scale(1.25)}.smiley-picker img{width:38px;height:38px;transform:scale(1.25)}}.chat-main{position:relative}

.dj-picture-wrap{display:flex;justify-content:center;margin:12px 0}.dj-picture,.dj-picture-placeholder{width:118px;height:118px;border-radius:20px;object-fit:cover;border:2px solid color-mix(in srgb,var(--accent) 65%,transparent);box-shadow:0 12px 30px rgba(0,0,0,.25)}.dj-picture-placeholder{display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent2));font-size:30px;font-weight:800;color:#fff}.dj-picture[hidden],.dj-picture-placeholder[hidden]{display:none}

/* Version 0.6: Anwesenheit, Privatchat und Moderation */
.presence-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.presence-head select{max-width:120px;padding:7px 9px}.online-users{display:grid;gap:7px;margin-bottom:18px}.online-user{display:flex;align-items:center;gap:8px;padding:9px;border-radius:12px;background:rgba(255,255,255,.05)}.online-user>div:nth-child(2){min-width:0;flex:1}.online-user strong,.online-user small{display:block;overflow:hidden;text-overflow:ellipsis}.presence-dot{width:9px;height:9px;border-radius:50%;background:#64748b;flex:none}.presence-dot.online{background:#22c55e}.presence-dot.away{background:#f59e0b}.presence-dot.busy{background:#ef4444}.user-actions{display:flex!important;gap:4px!important;flex:none!important}.user-actions button{border:0;background:rgba(255,255,255,.08);border-radius:7px;padding:5px;cursor:pointer}.private-panel{position:fixed;right:24px;bottom:24px;width:min(380px,calc(100vw - 30px));height:500px;z-index:40;background:#111827;border:1px solid rgba(255,255,255,.13);border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.45);display:grid;grid-template-rows:auto 1fr auto;overflow:hidden}.private-panel[hidden]{display:none}.private-panel header{display:flex;justify-content:space-between;padding:14px 16px;background:rgba(255,255,255,.05)}.private-panel header strong,.private-panel header small{display:block}.private-panel header button{border:0;background:none;color:#fff;font-size:26px;cursor:pointer}.private-messages{padding:13px;overflow:auto;display:flex;flex-direction:column;gap:9px}.private-message{max-width:82%;padding:9px 11px;border-radius:12px;background:rgba(255,255,255,.08)}.private-message.mine{align-self:flex-end;background:linear-gradient(135deg,var(--accent),var(--accent2))}.private-message p{margin:4px 0;white-space:pre-wrap;overflow-wrap:anywhere}.private-message small{opacity:.65}.private-panel form{display:flex;gap:8px;padding:12px;border-top:1px solid rgba(255,255,255,.1)}.private-panel form input{flex:1}.modal-backdrop{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.68);display:grid;place-items:center;padding:20px}.modal-backdrop[hidden]{display:none}.modal-card{width:min(480px,100%);background:#111827;border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:22px;display:grid;gap:14px}.modal-card label{display:grid;gap:6px}.modal-actions{display:flex;justify-content:flex-end;gap:9px}@media(max-width:900px){.private-panel{right:15px;bottom:15px;height:70vh}}

/* v0.6.1: Streamkarte oberhalb der Online-Liste */
.rightbar .radio-card{margin-top:0;margin-bottom:22px}.rightbar .presence-head{padding-top:2px}

/* Version 0.7: Profile und Teamverwaltung */
.profile-shortcut{display:grid;text-decoration:none;color:inherit}.profile-page{min-height:100vh;background:radial-gradient(circle at top,#17203a,#070b14 58%);color:var(--text)}.profile-shell{width:min(1080px,calc(100% - 32px));margin:0 auto;padding:30px 0 60px}.back-link{display:inline-block;margin-bottom:18px;color:#c4b5fd;text-decoration:none}.profile-card,.team-group,.team-hero{background:var(--panel);border:1px solid var(--line);border-radius:22px;overflow:hidden;margin-bottom:20px}.profile-banner{height:230px;background:linear-gradient(135deg,var(--accent),var(--accent2));background-size:cover;background-position:center}.profile-main{display:flex;gap:22px;align-items:center;padding:0 28px 22px;margin-top:-54px}.profile-avatar,.member-avatar{display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;font-weight:800;border:4px solid var(--panel);overflow:hidden}.profile-avatar{width:116px;height:116px;border-radius:28px;font-size:38px;flex:none}.profile-avatar img,.member-avatar img{width:100%;height:100%;object-fit:cover}.profile-main h1{margin:52px 0 8px}.profile-badges{display:flex;gap:7px;flex-wrap:wrap}.team-chip{display:inline-block;padding:5px 9px;border-radius:999px;background:color-mix(in srgb,var(--team-color) 22%,transparent);border:1px solid color-mix(in srgb,var(--team-color) 48%,transparent);font-size:12px}.profile-details{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:0 28px 24px}.profile-details article{background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:14px}.profile-details strong,.profile-details span{display:block}.profile-details span{color:var(--muted);margin-top:5px}.profile-bio{padding:0 28px 28px}.profile-bio p{white-space:normal;line-height:1.65}.profile-edit textarea,.admin-panel textarea{width:100%;background:#0b1220;border:1px solid var(--line);color:var(--text);border-radius:12px;padding:13px 14px;resize:vertical}.team-hero{padding:34px;text-align:center}.team-hero h1{margin:0 0 8px}.team-group-head{padding:26px;background:linear-gradient(135deg,color-mix(in srgb,var(--team-color) 55%,#111827),#111827);background-size:cover;background-position:center;border-left:5px solid var(--team-color)}.team-group-head h2{margin:0}.team-group-head p{margin-bottom:0}.team-member-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;padding:22px}.team-member-card{display:grid;justify-items:center;gap:8px;background:var(--panel2);border:1px solid var(--line);border-radius:16px;padding:18px;text-decoration:none;color:var(--text)}.team-member-card:hover{transform:translateY(-2px);border-color:var(--accent)}.member-avatar{width:76px;height:76px;border-radius:20px;font-size:26px}.team-member-card small{color:var(--muted)}.team-admin-members{display:grid;gap:8px;margin:12px 0}.team-admin-members>div{display:flex;align-items:center;justify-content:space-between;background:var(--panel2);border:1px solid var(--line);padding:10px 12px;border-radius:12px}.team-admin-members .btn{margin:0;padding:8px 10px}@media(max-width:760px){.profile-main{align-items:flex-start}.profile-main h1{margin-top:58px}.profile-details{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.profile-main{display:grid;margin-top:-50px}.profile-main h1{margin:0}.profile-details{grid-template-columns:1fr}.profile-banner{height:170px}}

/* Version 0.8: moderne Navigation, Themes und Widgets */
.main-menu{display:grid;gap:6px}.menu-item{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;color:var(--muted);padding:11px 12px;border-radius:11px;text-decoration:none;text-align:left;font:inherit;cursor:pointer}.menu-item:hover,.menu-item.active{background:rgba(255,255,255,.08);color:var(--text)}.room-list{display:grid;gap:4px;padding-left:18px;margin-bottom:5px}.room-list .room{padding:8px 10px}.disabled-link{opacity:.55}.live-label{font-size:11px;font-weight:800;letter-spacing:.12em;color:#fb7185;margin-bottom:8px}.message{align-items:flex-start}.message .avatar{overflow:hidden}.message .avatar img{width:100%;height:100%;object-fit:cover}.message-body{min-width:0;flex:1}.message-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.message-meta small{color:var(--muted)}.role-pill{font-size:10px;text-transform:uppercase;letter-spacing:.05em;padding:3px 7px;border-radius:999px;background:rgba(255,255,255,.08);color:#cbd5e1}.density-compact .message{padding-top:7px;padding-bottom:7px}.density-compact .message p{margin-top:3px}.density-spacious .message{padding-top:18px;padding-bottom:18px}.theme-neon{--panel:rgba(4,10,20,.92);--panel2:rgba(8,18,34,.92);--line:rgba(34,211,238,.24)}.theme-neon .logo,.theme-neon .radio-card{box-shadow:0 0 30px color-mix(in srgb,var(--accent) 20%,transparent)}.theme-glass .sidebar,.theme-glass .rightbar,.theme-glass .topbar,.theme-glass .composer{backdrop-filter:blur(18px);background:rgba(10,16,28,.68)}.theme-schlager{--accent:#ec4899;--accent2:#f59e0b}.theme-christmas{--accent:#dc2626;--accent2:#16a34a}.theme-halloween{--accent:#f97316;--accent2:#7c3aed}.widget-admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}.widget-card{background:var(--panel2);border:1px solid var(--line);border-radius:16px;padding:16px}.widget-card strong{display:block;margin-bottom:6px}.theme-preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.theme-preview{border:1px solid var(--line);border-radius:14px;padding:14px;background:linear-gradient(135deg,var(--accent),var(--accent2));min-height:90px;display:flex;align-items:end;font-weight:700}

/* Radio-Center */
.radio-page{min-height:100vh;background:#0b1020;color:#eef2ff;padding:28px}.radio-center{max-width:1100px;margin:auto}.radio-hero{margin-top:22px;display:flex;justify-content:space-between;gap:30px;align-items:center;padding:36px;border-radius:24px;background:linear-gradient(135deg,rgba(124,58,237,.35),rgba(6,182,212,.2));border:1px solid rgba(255,255,255,.1)}.radio-hero h1{font-size:2.3rem;margin:.4rem 0}.radio-hero h2{font-size:1.4rem;margin:.3rem 0 1rem}.radio-stats{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.radio-stats span{background:rgba(255,255,255,.09);padding:8px 12px;border-radius:999px}.radio-dj-large{width:260px;height:260px;object-fit:cover;border-radius:24px;border:3px solid rgba(255,255,255,.18)}.song-history{display:grid;gap:10px}.song-history article{display:flex;justify-content:space-between;gap:20px;padding:13px 16px;border-radius:14px;background:rgba(255,255,255,.05)}.song-history small{opacity:.7}@media(max-width:760px){.radio-hero{flex-direction:column;align-items:stretch}.radio-dj-large{width:100%;height:300px}.song-history article{flex-direction:column;gap:4px}}


/* Version 1.2: Design-Manager */
body{font-family:var(--font-family,Inter,system-ui,Arial,sans-serif);color:var(--text,#f7f8fb)}
a{color:var(--link-color,#a78bfa)}
.app-shell{background:var(--bg)}
.sidebar,.rightbar,.topbar,.composer{background:color-mix(in srgb,var(--panel-base,#0c1322) calc(var(--panel-opacity,.92)*100%),transparent);backdrop-filter:blur(var(--panel-blur,0px));-webkit-backdrop-filter:blur(var(--panel-blur,0px))}
.stream-box,.user-card,.widget-card,.admin-panel{background:color-mix(in srgb,var(--panel2) calc(var(--panel-opacity,.92)*100%),transparent)}
.btn.primary,.play{background:linear-gradient(135deg,var(--button-color,var(--accent)),var(--accent2))}
.messages{background-color:#080d18;background-attachment:local}
.reply-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;background:rgba(124,58,237,.18);border-top:1px solid rgba(255,255,255,.08);font-size:.88rem}.reply-bar button{border:0;background:transparent;color:var(--text);font-size:1.2rem;cursor:pointer}.message{position:relative}.message-actions{display:flex;gap:5px;margin-top:7px;opacity:.25;transition:.2s}.message:hover .message-actions{opacity:1}.message-actions button,.reaction-chip{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);color:var(--text);border-radius:8px;padding:3px 7px;cursor:pointer}.message-actions button:hover,.reaction-chip:hover,.reaction-chip.mine{background:rgba(124,58,237,.28)}.reply-preview{border-left:3px solid var(--accent);padding:5px 9px;margin:0 0 7px;background:rgba(255,255,255,.04);border-radius:6px;font-size:.82rem;opacity:.85}.reactions{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.reaction-chip{font-size:.8rem}.edited-label{opacity:.55;margin-left:5px}.mention{background:rgba(250,204,21,.2);color:#fde68a;border-radius:4px;padding:0 2px}

.on-air-badge{display:inline-flex;align-items:center;margin-left:6px;padding:2px 7px;border-radius:999px;background:#ef4444;color:#fff;font-size:.66rem;font-weight:800;letter-spacing:.04em;vertical-align:middle;box-shadow:0 0 0 2px rgba(239,68,68,.18),0 0 16px rgba(239,68,68,.45);animation:onAirPulse 1.8s ease-in-out infinite}.message-meta strong .on-air-badge{font-size:.62rem}@keyframes onAirPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.72;transform:scale(.96)}}

/* Version 1.5 – Radio Experience */
.portal-page{min-height:100vh;background:radial-gradient(circle at top right,#172554,#070b15 48%);color:#f7f8fb;font-family:Inter,system-ui,sans-serif;padding:28px}.portal-wrap{max-width:980px;margin:auto}.portal-wrap.wide{max-width:1220px}.back-link{display:inline-block;margin-bottom:18px;color:#c4b5fd;text-decoration:none}.portal-hero,.portal-card{background:rgba(12,19,34,.9);border:1px solid rgba(255,255,255,.09);border-radius:20px;padding:24px;margin-bottom:20px;box-shadow:0 18px 55px rgba(0,0,0,.25)}.portal-hero h1{font-size:clamp(2rem,5vw,3.7rem);margin:.3rem 0}.portal-hero p,.empty-state{color:#94a3b8}.schedule-list,.request-list,.admin-table{display:grid;gap:12px}.schedule-entry,.request-list article,.admin-row{display:flex;align-items:center;gap:14px;padding:14px;border-radius:14px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.06)}.schedule-entry.is-live{border-color:#ef4444;box-shadow:0 0 25px rgba(239,68,68,.16)}.schedule-entry img,.schedule-avatar{width:58px;height:58px;border-radius:14px;object-fit:cover;display:grid;place-items:center;background:#111827}.schedule-entry div,.request-list article div{display:grid;gap:4px;flex:1}.schedule-entry span,.schedule-entry small,.request-list small{color:#94a3b8}.today-badge{font-size:.7rem;padding:4px 8px;border-radius:999px;background:#7c3aed;color:white}.portal-form,.admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.portal-form label,.admin-grid label{display:grid;gap:7px;color:#cbd5e1}.portal-form textarea,.portal-form input,.admin-grid input,.admin-grid select,.admin-row select{width:100%;box-sizing:border-box;border:1px solid rgba(255,255,255,.12);background:#080d18;color:white;border-radius:10px;padding:11px}.portal-form label:last-of-type{grid-column:1/-1}.notice{padding:13px 16px;border-radius:12px;margin-bottom:16px}.notice.success{background:rgba(34,197,94,.18);border:1px solid #22c55e}.notice.error{background:rgba(239,68,68,.18);border:1px solid #ef4444}.request-status{padding:6px 10px;border-radius:999px;font-size:.78rem}.status-new{background:#334155}.status-accepted{background:#1d4ed8}.status-played{background:#15803d}.status-declined{background:#991b1b}.admin-row{display:grid;grid-template-columns:150px 1fr 1.5fr auto}.request-admin{grid-template-columns:120px 1.2fr 1.5fr auto}.admin-row form{display:flex;gap:8px;align-items:center}@media(max-width:760px){.portal-page{padding:14px}.portal-form,.admin-grid{grid-template-columns:1fr}.portal-form label:last-of-type{grid-column:auto}.admin-row,.request-admin{grid-template-columns:1fr}.schedule-entry{align-items:flex-start;flex-wrap:wrap}}
/* Admin v1.6 */
.professional-stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.admin-dashboard-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:18px}.dashboard-live p{margin:10px 0}.admin-notifications{margin:0;padding-left:20px}.admin-notifications li{margin:9px 0}.admin-search{display:flex;gap:10px}.admin-search input{flex:1}.security-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px}.security-grid>div{padding:18px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:rgba(255,255,255,.03);display:flex;flex-direction:column;gap:6px}.security-grid strong{font-size:1.35rem}.table-wrap{overflow:auto}.table-wrap table{width:100%;border-collapse:collapse}.table-wrap th,.table-wrap td{padding:10px;border-bottom:1px solid rgba(255,255,255,.1);text-align:left}.alert.warning{border-color:#f59e0b;background:rgba(245,158,11,.12)}@media(max-width:900px){.admin-dashboard-grid{grid-template-columns:1fr}}


/* Version 1.7: Module und Seiten-Builder */
.module-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.module-card{display:flex;flex-direction:column;justify-content:space-between;gap:18px;padding:18px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.04)}.module-card.disabled{opacity:.7}.module-state{display:inline-flex;padding:5px 9px;border-radius:999px;background:rgba(34,197,94,.15);color:#86efac;font-size:.78rem;font-weight:800}.module-card.disabled .module-state{background:rgba(148,163,184,.15);color:#cbd5e1}.module-card h2{margin:10px 0 5px}.module-card p{color:var(--muted,#aab4c6)}.builder-canvas{display:grid;gap:12px;margin:18px 0}.builder-widget{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:center;padding:16px;border:1px dashed rgba(255,255,255,.25);border-radius:14px;background:rgba(255,255,255,.05);cursor:grab}.builder-widget.dragging{opacity:.4}.builder-widget .drag-handle{grid-row:1/3;font-size:1.4rem}.builder-widget small{color:var(--muted,#aab4c6)}


/* Version 1.8 – Studio Layout */
.studio-layout{grid-template-columns:var(--sidebar-width,230px) minmax(0,1fr) var(--rightbar-width,300px);grid-template-rows:1fr;gap:10px;padding:10px;background:#050914;min-height:100vh}
.studio-layout .sidebar,.studio-layout .chat-main,.studio-layout .rightbar{border:1px solid color-mix(in srgb,var(--accent) var(--frame-strength,70%),transparent);box-shadow:0 0 0 1px rgba(255,255,255,.03),0 0 24px color-mix(in srgb,var(--accent) 18%,transparent);border-radius:10px;overflow:hidden}
.studio-layout .sidebar{position:relative;height:calc(100vh - 20px);background:linear-gradient(180deg,rgba(10,16,31,.97),rgba(6,10,22,.97));display:flex;flex-direction:column}
.studio-layout .logo{min-height:72px;border-bottom:1px solid rgba(255,255,255,.08)}
.studio-layout .main-menu{overflow:auto;padding:10px 8px;flex:1}
.studio-layout .menu-item{border-radius:7px;margin-bottom:4px;padding:11px 12px}
.studio-layout .menu-item.active{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 30%,transparent),transparent);box-shadow:inset 3px 0 var(--accent)}
.studio-layout .chat-main{height:calc(100vh - 20px);display:grid;grid-template-rows:var(--player-height,104px) minmax(0,1fr) auto auto auto;background:rgba(3,7,18,.9)}
.studio-layout .topbar.studio-player{height:auto;min-height:var(--player-height,104px);display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,.8fr);gap:22px;padding:12px 18px;background:linear-gradient(135deg,rgba(7,14,34,.96),rgba(11,20,44,.9));border-bottom:1px solid color-mix(in srgb,var(--accent) 70%,transparent)}
.studio-player-main{display:flex;align-items:center;gap:14px;min-width:0}.studio-play{width:52px;height:52px;border-radius:50%;font-size:1.15rem;flex:0 0 auto}.studio-player .stream-copy{min-width:0;display:grid;gap:7px}.studio-player .stream-copy strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:1.02rem}.studio-volume{display:grid;grid-template-columns:auto minmax(120px,1fr) auto;align-items:center;gap:8px;max-width:520px}.studio-volume input{width:100%;accent-color:var(--accent2)}.studio-welcome{border-left:1px solid rgba(255,255,255,.1);padding-left:22px;display:flex;flex-direction:column;justify-content:center;gap:6px;text-align:right}.studio-welcome strong{font-size:1.05rem}.studio-welcome span{color:var(--muted);font-size:.8rem}.studio-welcome small{color:var(--accent2);font-weight:700}
.studio-layout .messages{margin:10px;border:1px solid color-mix(in srgb,var(--accent) 66%,transparent);border-radius:9px;box-shadow:inset 0 0 35px rgba(0,0,0,.25);padding:12px;background-attachment:local}
.studio-layout .rightbar{height:calc(100vh - 20px);padding:10px;background:linear-gradient(180deg,rgba(8,13,27,.97),rgba(5,9,20,.97));overflow:auto}
.studio-layout .radio-card{border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);border-radius:9px;background:rgba(2,6,15,.62);text-align:center}.studio-layout .dj-picture,.studio-layout .dj-picture-placeholder{width:145px;height:145px;margin-inline:auto;border-radius:10px}.studio-layout .presence-head{margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.08)}
.studio-layout .composer{margin:0 10px 10px;border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);border-radius:9px;padding:8px;background:rgba(2,6,15,.85)}.studio-layout .composer input{font-size:1rem;background:rgba(255,255,255,.025)}
.studio-tools{display:flex;align-items:center;gap:4px;margin:0 16px;padding:5px 0}.studio-tools button{border:0;background:transparent;color:white;font-size:1.18rem;padding:5px 7px;cursor:pointer;border-radius:7px}.studio-tools button:hover{background:rgba(255,255,255,.08);color:var(--accent2)}
.studio-preview{display:grid;grid-template-columns:170px minmax(0,1fr) 210px;grid-template-rows:82px 340px 54px;gap:8px;min-height:500px;padding:10px;border-radius:14px;background:#050914;border:1px solid rgba(255,255,255,.1)}.studio-preview>div{border:1px solid color-mix(in srgb,var(--accent) 70%,transparent);border-radius:8px;background:rgba(10,17,34,.9);display:grid;place-items:center;text-align:center;padding:10px}.studio-preview-sidebar{grid-row:1/4}.studio-preview-player{grid-column:2/4}.studio-preview-chat{grid-column:2}.studio-preview-right{grid-column:3}.studio-preview-composer{grid-column:2/4}.studio-settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}.studio-settings-grid label{display:grid;gap:7px}.studio-settings-grid input{width:100%}
@media(max-width:1050px){.studio-layout{grid-template-columns:190px minmax(0,1fr) 250px}.studio-layout .topbar.studio-player{grid-template-columns:1fr}.studio-welcome{display:none}}
@media(max-width:820px){.studio-layout{display:block;padding:0}.studio-layout .sidebar{height:auto;min-height:auto;border-radius:0}.studio-layout .main-menu{display:flex;overflow:auto}.studio-layout .menu-item{white-space:nowrap}.studio-layout .sidebar-footer{display:none}.studio-layout .chat-main{height:calc(100vh - 74px);border-radius:0}.studio-layout .rightbar{display:none}.studio-layout .topbar.studio-player{min-height:88px}.studio-preview{grid-template-columns:90px 1fr;grid-template-rows:70px 260px 60px}.studio-preview-sidebar{grid-row:1/4}.studio-preview-player,.studio-preview-chat,.studio-preview-composer{grid-column:2}.studio-preview-right{display:none}}

/* v1.8.1: Lautstärkeregler und Player-Abstände korrigiert */
.studio-layout .chat-main{
  grid-template-rows:max(var(--player-height,104px),132px) minmax(0,1fr) auto auto auto;
}
.studio-layout .topbar.studio-player{
  min-height:max(var(--player-height,104px),132px);
  overflow:hidden;
  align-items:center;
}
.studio-player-main{height:100%;align-items:center}
.studio-player .stream-copy{align-content:center;min-width:0}
.studio-volume{
  display:grid;
  grid-template-columns:22px minmax(140px,420px) 46px;
  align-items:center;
  gap:9px;
  width:min(100%,500px);
  min-height:24px;
}
.studio-volume input[type="range"]{
  appearance:auto;
  -webkit-appearance:auto;
  width:100%;
  height:18px;
  min-height:18px;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  accent-color:var(--accent2);
}
.studio-volume input[type="range"]:focus{border:0;box-shadow:none;outline:2px solid color-mix(in srgb,var(--accent2) 45%,transparent);outline-offset:2px}
.studio-volume span:last-child{text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:1050px){
  .studio-layout .chat-main{grid-template-rows:max(var(--player-height,104px),118px) minmax(0,1fr) auto auto auto}
  .studio-layout .topbar.studio-player{min-height:max(var(--player-height,104px),118px)}
}
@media(max-width:820px){
  .studio-layout .chat-main{grid-template-rows:112px minmax(0,1fr) auto auto auto}
  .studio-layout .topbar.studio-player{min-height:112px}
  .studio-volume{grid-template-columns:20px minmax(100px,1fr) 42px}
}

/* v1.9 – visueller Layout-Editor */
.studio-layout{gap:var(--studio-gap,10px);padding:var(--studio-gap,10px)}
.studio-layout .sidebar,.studio-layout .chat-main,.studio-layout .rightbar{border-radius:var(--studio-radius,10px)}
.studio-layout .messages{margin:var(--studio-inner-gap,10px);padding:var(--message-padding,12px);border-radius:var(--studio-radius,10px)}
.studio-layout .rightbar{padding:var(--rightbar-padding,10px)}
.studio-layout .menu-item,.studio-layout .room{min-height:var(--menu-item-height,46px);display:flex;align-items:center}
.studio-welcome{text-align:var(--welcome-align,right)}
.hide-studio-sidebar{grid-template-columns:minmax(0,1fr) var(--rightbar-width,300px)}.hide-studio-sidebar .sidebar{display:none}
.hide-studio-rightbar{grid-template-columns:var(--sidebar-width,230px) minmax(0,1fr)}.hide-studio-rightbar .rightbar{display:none}
.hide-studio-sidebar.hide-studio-rightbar{grid-template-columns:minmax(0,1fr)}
.hide-studio-welcome .studio-welcome,.hide-studio-tools .studio-tools{display:none}
.compact-studio-menu .menu-item,.compact-studio-menu .room{min-height:36px;padding-block:7px}.compact-studio-menu .logo{min-height:58px}
.player-style-compact .topbar.studio-player{grid-template-columns:1fr}.player-style-compact .studio-welcome{display:none}.player-style-compact .studio-player-main{justify-content:flex-start}
.player-style-centered .topbar.studio-player{grid-template-columns:1fr}.player-style-centered .studio-player-main{justify-content:center;text-align:center}.player-style-centered .stream-copy{justify-items:center}.player-style-centered .studio-welcome{display:none}
.layout-editor-sticky{position:sticky;top:0;z-index:4;box-shadow:0 18px 50px rgba(0,0,0,.28)}.layout-editor-toolbar,.layout-save-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px}.layout-editor-toolbar h2{margin-bottom:4px}.layout-editor-columns{display:grid;grid-template-columns:1fr 1fr;gap:20px}.toggle-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px}.visual-preview{overflow:auto}.visual-preview>div{border-radius:var(--preview-radius,8px)}.visual-preview .studio-preview-sidebar{align-content:start;gap:8px}.visual-preview .studio-preview-sidebar span{min-height:var(--menu-height,46px);width:100%;display:grid;place-items:center;border-radius:7px;background:rgba(255,255,255,.04)}.visual-preview .studio-preview-sidebar.compact span{min-height:34px}.visual-preview .studio-preview-player{display:grid;grid-template-columns:1fr auto;align-items:center}.visual-preview .studio-preview-player span{color:var(--muted)}.visual-preview .studio-preview-player i{font-style:normal}.visual-preview .studio-preview-player[data-style="compact"],.visual-preview .studio-preview-player[data-style="centered"]{grid-template-columns:1fr}.visual-preview .studio-preview-player[data-style="centered"]{justify-items:center}.visual-preview .studio-preview-chat{align-content:center}.visual-preview .studio-preview-right{align-content:start;gap:10px}.visual-preview .studio-preview-right span{width:100%;min-height:72px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.1);border-radius:8px}.visual-preview .studio-preview-composer{display:flex;justify-content:flex-start;gap:18px}.admin-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
@media(max-width:1050px){.layout-editor-columns{grid-template-columns:1fr}.layout-editor-sticky{position:static}}

/* v2.0 Admin Design Builder navigation */
.admin-builder-link{padding:10px 14px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.admin-builder-link a{display:block;padding:12px 14px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff!important;font-weight:800;text-align:center;box-shadow:0 8px 24px rgba(0,0,0,.22)}
.design-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;position:sticky;top:0;z-index:20;padding:10px;background:rgba(8,15,30,.92);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);border-radius:12px}
.design-tabs a{padding:10px 14px;border-radius:9px;color:var(--text,#fff);background:rgba(255,255,255,.05);text-decoration:none;font-weight:700}
.design-tabs a.active,.design-tabs a:hover{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff}
.builder-callout{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid color-mix(in srgb,var(--accent) 70%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 14%,transparent),color-mix(in srgb,var(--accent2) 10%,transparent))}
.builder-callout h2{margin:0 0 6px}.builder-callout p{margin:0;max-width:760px;color:#b9c7df}
@media(max-width:760px){.builder-callout{align-items:stretch;flex-direction:column}.design-tabs{position:static}.design-tabs a{flex:1 1 100%}}

/* Version 2.1 – Studio Builder nach Webradio-Layoutvorbild */
.studio-builder-body{overflow:hidden;background:#07111f}.studio-builder-nav{position:fixed;inset:0 auto 0 0;width:220px;z-index:20}.studio-builder-main{margin-left:220px;height:100vh;display:flex;flex-direction:column;min-width:0;background:radial-gradient(circle at 70% 10%,#12365a 0,#07111f 46%,#03070d 100%)}
.studio-template-bar{display:flex;align-items:end;gap:8px;padding:10px 14px;background:#07101d;border-bottom:1px solid #1e5a8c;box-shadow:0 3px 20px #0008;flex-wrap:wrap}.studio-template-bar label{margin:0}.studio-template-bar select,.studio-template-bar input{height:38px}.template-select-wrap{min-width:250px}.template-name{width:170px}.builder-alert{margin:8px 14px 0}.studio-builder-workspace{display:grid;grid-template-columns:285px minmax(0,1fr);gap:10px;flex:1;min-height:0;padding:10px}.builder-controls{overflow:auto;background:#081423;border:1px solid #1f6297;border-radius:7px;padding:12px;box-shadow:0 0 20px #0099ff22}.builder-controls h2{margin:0 0 10px}.builder-controls details{border-top:1px solid #23435f;padding:9px 0}.builder-controls summary{font-weight:700;cursor:pointer;color:#8ed4ff;margin-bottom:8px}.builder-controls label{display:block;margin:7px 0}.builder-range span{display:flex;justify-content:space-between;font-size:12px}.builder-range input{width:100%}.builder-widget-list{display:grid;gap:7px}.builder-widget-list article{display:flex;align-items:center;gap:8px;padding:9px;border:1px solid #258de0;background:#10243a;border-radius:5px;cursor:grab}.builder-widget-list article.dragging{opacity:.45}.builder-stage-wrap{min-width:0;display:flex;flex-direction:column;border:1px solid #1f6297;border-radius:7px;background:#02060b;overflow:hidden}.builder-stage-title{height:42px;display:flex;justify-content:space-between;align-items:center;padding:0 12px;background:#09192a;border-bottom:1px solid #1f6297;color:#bde7ff}.builder-stage-title span{font-size:12px;color:#799bb5}.studio-live-canvas{--builder-radius:8px;--builder-glow:.7;display:grid;grid-template-columns:230px minmax(0,1fr) 300px;grid-template-rows:150px minmax(360px,1fr) 68px;gap:8px;padding:8px;flex:1;min-height:540px;background:linear-gradient(#071529bb,#06101ddd),radial-gradient(circle at 55% 45%,#123a5d,#040a12 68%)}.editable-region{position:relative;border:1px solid #1ea5ff;border-radius:var(--builder-radius);box-shadow:0 0 calc(5px + 12px*var(--builder-glow)) rgba(0,162,255,var(--builder-glow));background:linear-gradient(145deg,#0a1b2dcc,#050b13ee);overflow:hidden}.editable-region>em{position:absolute;left:5px;top:4px;z-index:2;padding:2px 5px;border-radius:3px;background:#007bd5;color:#fff;font:10px/1.2 Arial;font-style:normal;letter-spacing:.2px}.region-sidebar{grid-row:1/4;display:flex;flex-direction:column;padding:38px 9px 10px;gap:6px}.region-sidebar strong{font-size:18px;text-align:center;margin-bottom:9px}.region-sidebar span{min-height:var(--item-height,46px);display:flex;align-items:center;padding:0 10px;border:1px solid #254e6d;background:#0d2134;border-radius:5px}.region-sidebar.compact span{font-size:0}.region-sidebar.compact span::first-letter{font-size:18px}.region-player{grid-column:2/4;display:grid;grid-template-columns:minmax(0,1fr) 160px 280px;align-items:center;gap:16px;padding:30px 18px 12px}.region-player>div:first-of-type{display:grid;grid-template-columns:55px minmax(0,1fr);align-items:center}.region-player button{grid-row:1/3;width:46px;height:46px;border-radius:50%;border:1px solid #32baff;background:#0a2539;color:#fff}.region-player b{font-size:18px}.region-player small{color:#80a7c1}.region-player aside{padding:12px;border-left:1px solid #23597c}.region-player aside b,.region-player aside small{display:block}.fake-volume{height:8px;background:#21364a;border-radius:8px;overflow:hidden}.fake-volume i{display:block;width:58%;height:100%;background:#1ba9ff}.region-chat{grid-column:2;grid-row:2;display:flex;flex-direction:column;gap:12px;padding:35px 12px 12px;background:linear-gradient(#07111dcc,#07111dcc),radial-gradient(circle at 50% 30%,#24415b,#050a10 70%)}.fake-message{display:flex;gap:9px;max-width:75%;padding:8px;border-radius:6px;background:#091a29cc}.fake-message i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#157cbb;font-style:normal}.fake-message p{margin:0}.fake-message p b,.fake-message p span{display:block}.fake-message mark{background:#e2162b;color:#fff;padding:2px 4px;border-radius:3px}.region-right{grid-column:3;grid-row:2;display:flex;flex-direction:column;gap:8px;min-width:0}.right-widget{padding:34px 10px 12px;display:flex;flex-direction:column;gap:6px;min-height:120px}.right-widget:last-child{flex:1}.region-composer{grid-column:2/4;grid-row:3;display:grid;grid-template-columns:auto minmax(0,1fr) 90px;gap:8px;align-items:center;padding:26px 10px 8px}.region-composer input{height:34px}.region-composer button{height:34px}.region-composer #previewTools{white-space:nowrap}.region-player[data-style="compact"]{grid-template-columns:1fr 130px}.region-player[data-style="compact"] aside{display:none}.region-player[data-style="centered"]{grid-template-columns:1fr;text-align:center}.region-player[data-style="centered"] .fake-volume,.region-player[data-style="centered"] aside{display:none}
@media(max-width:1050px){.studio-builder-nav{display:none}.studio-builder-main{margin-left:0}.studio-builder-workspace{grid-template-columns:240px minmax(720px,1fr);overflow:auto}.studio-template-bar{position:sticky;top:0;z-index:30}}


/* v2.2 – klassisches Webradio-Layout: Player oben, Chat links, Radio/Online rechts, Eingabe unten */
.classic-radio-layout{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) var(--rightbar-width,285px) !important;
  grid-template-rows:max(var(--player-height,104px),96px) minmax(0,1fr) auto auto !important;
  gap:var(--studio-gap,8px) !important;
  padding:var(--studio-gap,8px) !important;
  min-height:100vh;
  height:100vh;
  overflow:hidden;
  background:#02050b;
}
.classic-radio-layout .sidebar{display:none !important}
.classic-radio-layout .chat-main{display:contents !important}
.classic-radio-layout .topbar.studio-player{
  grid-column:1 / -1;
  grid-row:1;
  min-height:0;
  height:auto;
  border:2px solid color-mix(in srgb,var(--accent) var(--frame-strength,80%),transparent);
  border-radius:var(--studio-radius,10px);
  overflow:hidden;
  box-shadow:0 0 18px color-mix(in srgb,var(--accent) 28%,transparent);
}
.classic-radio-layout .messages{
  grid-column:1;
  grid-row:2;
  min-height:0;
  margin:0;
  border:2px solid color-mix(in srgb,var(--accent) var(--frame-strength,80%),transparent);
  border-radius:var(--studio-radius,10px);
  box-shadow:0 0 18px color-mix(in srgb,var(--accent) 24%,transparent);
  overflow:auto;
}
.classic-radio-layout .rightbar{
  grid-column:2;
  grid-row:2;
  min-width:0;
  height:auto;
  padding:var(--rightbar-padding,12px);
  border:2px solid color-mix(in srgb,var(--accent) var(--frame-strength,80%),transparent);
  border-radius:var(--studio-radius,10px);
  box-shadow:0 0 18px color-mix(in srgb,var(--accent) 24%,transparent);
  overflow:auto;
}
.classic-radio-layout .studio-tools{
  grid-column:1 / -1;
  grid-row:4;
  margin:0;
  padding:8px 16px 12px;
  border-left:2px solid color-mix(in srgb,var(--accent) var(--frame-strength,80%),transparent);
  border-right:2px solid color-mix(in srgb,var(--accent) var(--frame-strength,80%),transparent);
  border-bottom:2px solid color-mix(in srgb,var(--accent) var(--frame-strength,80%),transparent);
  border-radius:0 0 var(--studio-radius,10px) var(--studio-radius,10px);
  background:color-mix(in srgb,var(--panel-base,#0c1322) 94%,transparent);
  box-shadow:0 10px 18px color-mix(in srgb,var(--accent) 18%,transparent);
}
.classic-radio-layout .composer{
  grid-column:1 / -1;
  grid-row:3;
  margin:0;
  padding:10px 14px 4px;
  border:2px solid color-mix(in srgb,var(--accent) var(--frame-strength,80%),transparent);
  border-bottom:0;
  border-radius:var(--studio-radius,10px) var(--studio-radius,10px) 0 0;
  background:color-mix(in srgb,var(--panel-base,#0c1322) 94%,transparent);
}
.classic-radio-layout .composer input{
  border-radius:999px;
  min-height:46px;
  font-size:18px;
  background:rgba(0,0,0,.7);
  border-color:rgba(255,255,255,.78);
}
.classic-radio-layout .composer .btn{display:none}
.classic-radio-layout .composer #smileyButton{display:none}
.classic-radio-layout .studio-tools button{font-size:22px}
.classic-radio-layout .reply-bar{position:fixed;left:18px;right:calc(var(--rightbar-width,285px) + 18px);bottom:105px;z-index:20}
.classic-radio-layout .smiley-picker{position:fixed;left:20px;bottom:100px;z-index:30}
.classic-radio-layout .radio-card{text-align:center;margin:0 0 18px}
.classic-radio-layout .dj-picture-wrap{margin-inline:auto}
.classic-radio-layout .presence-head{border-top:1px solid rgba(255,255,255,.1);padding-top:14px}
.classic-radio-layout .studio-welcome strong{font-size:clamp(18px,2vw,27px)}
.classic-radio-layout .studio-welcome span{display:none}
.classic-radio-layout .studio-welcome small{display:none}
.classic-radio-layout .studio-player-main{min-width:0}
.classic-radio-layout .studio-volume{max-width:820px}
.classic-radio-layout .studio-volume input[type="range"]{height:12px;padding:0;border:0;background:transparent}
.classic-radio-layout .private-panel{z-index:50}
@media(max-width:900px){
  .classic-radio-layout{grid-template-columns:minmax(0,1fr) 240px !important}
}
@media(max-width:720px){
  .classic-radio-layout{display:grid !important;grid-template-columns:1fr !important;grid-template-rows:auto minmax(0,1fr) auto auto !important;padding:0 !important;gap:0 !important}
  .classic-radio-layout .topbar.studio-player{grid-column:1;grid-row:1;border-radius:0}
  .classic-radio-layout .messages{grid-column:1;grid-row:2;border-radius:0}
  .classic-radio-layout .rightbar{display:none !important}
  .classic-radio-layout .composer{grid-column:1;grid-row:3;border-radius:0}
  .classic-radio-layout .studio-tools{grid-column:1;grid-row:4;border-radius:0}
  .classic-radio-layout .studio-welcome{display:none}
}

/* v2.2.1 – Benutzer-Menü mit Admin und Logout */
.classic-radio-layout .studio-welcome{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
  min-width:270px;
  overflow:visible;
}
.classic-radio-layout .welcome-copy{text-align:right;min-width:0}
.classic-radio-layout .user-menu{position:relative;z-index:80;flex:0 0 auto}
.classic-radio-layout .user-menu>summary{
  list-style:none;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:48px;
  padding:6px 10px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:rgba(4,10,20,.72);
  cursor:pointer;
  user-select:none;
  transition:.18s ease;
}
.classic-radio-layout .user-menu>summary::-webkit-details-marker{display:none}
.classic-radio-layout .user-menu>summary:hover,.classic-radio-layout .user-menu[open]>summary{
  border-color:var(--accent2);
  box-shadow:0 0 18px color-mix(in srgb,var(--accent2) 28%,transparent);
}
.classic-radio-layout .user-menu-avatar{
  width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  font-weight:900;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent2));
}
.classic-radio-layout .user-menu-name{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:800}
.classic-radio-layout .user-menu-arrow{font-size:13px;transition:transform .18s ease}
.classic-radio-layout .user-menu[open] .user-menu-arrow{transform:rotate(180deg)}
.classic-radio-layout .user-menu nav{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  width:220px;
  padding:8px;
  border:1px solid color-mix(in srgb,var(--accent) 70%,transparent);
  border-radius:12px;
  background:#07101e;
  box-shadow:0 18px 50px rgba(0,0,0,.55),0 0 20px color-mix(in srgb,var(--accent) 22%,transparent);
  text-align:left;
}
.classic-radio-layout .user-menu nav a{
  display:flex;align-items:center;gap:9px;padding:11px 12px;border-radius:8px;
  color:var(--text);text-decoration:none;font-weight:700;
}
.classic-radio-layout .user-menu nav a:hover{background:color-mix(in srgb,var(--accent) 22%,transparent)}
.classic-radio-layout .user-menu-role{
  padding:7px 12px 9px;margin-bottom:5px;border-bottom:1px solid rgba(255,255,255,.1);
  color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.09em;
}
.classic-radio-layout .user-menu nav .logout-link{color:#ff8e9b}
@media(max-width:720px){
  .classic-radio-layout .studio-welcome{display:flex!important;min-width:auto;padding:6px 8px}
  .classic-radio-layout .welcome-copy{display:none}
  .classic-radio-layout .user-menu-name{display:none}
  .classic-radio-layout .user-menu>summary{padding:5px}
  .classic-radio-layout .user-menu-arrow{display:none}
  .classic-radio-layout .user-menu nav{position:fixed;right:8px;top:72px;width:min(260px,calc(100vw - 16px))}
}

/* v3.1 – durchgehende untere Chat-Taskleiste */
.classic-radio-layout .bottom-chat-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-height:58px;
  overflow-x:auto;
}
.classic-radio-layout .bottom-tool-actions{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:max-content;
}
.classic-radio-layout .bottom-chat-toolbar button,
.classic-radio-layout .bottom-chat-toolbar a{
  width:42px;
  height:42px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.18);
  border-radius:9px;
  color:var(--text,#fff);
  background:rgba(255,255,255,.07);
  text-decoration:none;
  font:inherit;
  font-size:21px;
  cursor:pointer;
  transition:transform .15s ease,background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.classic-radio-layout .bottom-chat-toolbar button:hover,
.classic-radio-layout .bottom-chat-toolbar a:hover{
  transform:translateY(-2px);
  background:color-mix(in srgb,var(--accent) 25%,rgba(255,255,255,.08));
  border-color:color-mix(in srgb,var(--accent) 75%,white 15%);
  box-shadow:0 0 12px color-mix(in srgb,var(--accent) 30%,transparent);
}
.classic-radio-layout .bottom-chat-toolbar .admin-tool{color:#ffd76a}
.classic-radio-layout .bottom-chat-toolbar .logout-tool{color:#ff8d99}
.classic-radio-layout .bottom-user-state{
  display:grid;
  grid-template-columns:auto auto;
  column-gap:8px;
  align-items:center;
  min-width:max-content;
  padding:5px 10px;
  border-left:1px solid rgba(255,255,255,.14);
}
.classic-radio-layout .bottom-user-state .bottom-user-dot{
  grid-row:1 / 3;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#37d67a;
  box-shadow:0 0 9px #37d67a;
}
.classic-radio-layout .bottom-user-state strong{font-size:13px;line-height:1.1}
.classic-radio-layout .bottom-user-state small{font-size:11px;opacity:.7;line-height:1.1}
@media(max-width:720px){
  .classic-radio-layout .bottom-chat-toolbar{padding:7px 9px;min-height:54px}
  .classic-radio-layout .bottom-chat-toolbar button,
  .classic-radio-layout .bottom-chat-toolbar a{width:38px;height:38px;font-size:19px}
  .classic-radio-layout .bottom-user-state{display:none}
}

/* v3.1.1 – Korrektur der unteren Eingabe- und Werkzeugleiste */
.classic-radio-layout .composer{
  display:block !important;
  width:100% !important;
}
.classic-radio-layout .composer #messageInput{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
}
.classic-radio-layout .bottom-chat-toolbar{
  width:100% !important;
  overflow-x:auto !important;
}
.classic-radio-layout .bottom-tool-actions{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  flex-wrap:nowrap !important;
}
.classic-radio-layout .bottom-chat-toolbar .bottom-tool-actions > button,
.classic-radio-layout .bottom-chat-toolbar .bottom-tool-actions > a{
  flex:0 0 42px !important;
  width:42px !important;
  min-width:42px !important;
  height:42px !important;
  margin:0 !important;
  padding:0 !important;
  border:1px solid rgba(255,255,255,.2) !important;
  border-radius:9px !important;
  background:rgba(255,255,255,.07) !important;
}
.classic-radio-layout .bottom-user-state{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  white-space:nowrap !important;
}
.classic-radio-layout .bottom-user-state strong,
.classic-radio-layout .bottom-user-state small{
  display:inline-block !important;
  margin:0 !important;
}
.classic-radio-layout .bottom-user-state small{
  padding:3px 7px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.08) !important;
}
@media(max-width:720px){
  .classic-radio-layout .bottom-chat-toolbar .bottom-tool-actions > button,
  .classic-radio-layout .bottom-chat-toolbar .bottom-tool-actions > a{
    flex-basis:38px !important;
    width:38px !important;
    min-width:38px !important;
    height:38px !important;
  }
}

/* v3.1.3 – Versteckte Overlays dürfen das Nachrichtenfeld nicht blockieren */
[hidden],
.reply-bar[hidden],
.smiley-picker[hidden],
.private-panel[hidden],
.modal-backdrop[hidden]{
  display:none !important;
}
.classic-radio-layout .composer{
  position:relative;
  z-index:5;
}
.classic-radio-layout .composer #messageInput{
  position:relative;
  z-index:6;
  pointer-events:auto !important;
}

/* v3.2 – vollständiger Lautstärkeregler */
.studio-volume{grid-template-columns:38px minmax(160px,520px) 52px;max-width:620px;width:100%}
.studio-volume .mute-button{width:36px;height:36px;min-width:36px;padding:0;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--accent2) 65%,transparent);border-radius:50%;background:rgba(5,12,28,.78);color:#fff;font-size:18px;cursor:pointer;box-shadow:0 0 12px color-mix(in srgb,var(--accent2) 24%,transparent)}
.studio-volume .mute-button:hover{transform:translateY(-1px);border-color:var(--accent2);box-shadow:0 0 18px color-mix(in srgb,var(--accent2) 42%,transparent)}
.studio-volume input[type="range"]{-webkit-appearance:none;appearance:none;height:10px;min-height:10px;border-radius:999px;background:linear-gradient(90deg,#14e63d 0%,#e7e500 52%,#ff8a00 74%,#ff1d25 var(--volume-progress,35%),rgba(255,255,255,.22) var(--volume-progress,35%));cursor:pointer;outline:none}
.studio-volume input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;border:2px solid #fff;background:var(--accent2);box-shadow:0 0 12px color-mix(in srgb,var(--accent2) 70%,transparent);cursor:pointer}
.studio-volume input[type="range"]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;border:2px solid #fff;background:var(--accent2);box-shadow:0 0 12px color-mix(in srgb,var(--accent2) 70%,transparent);cursor:pointer}
.studio-volume #volumeValue{font-weight:800;color:#fff;text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:700px){.studio-volume{grid-template-columns:34px minmax(90px,1fr) 44px}.studio-volume .mute-button{width:32px;height:32px;min-width:32px}}

/* v3.2.1: Lautstärkeregler im oberen Player sicher sichtbar */
.classic-radio-layout .topbar.studio-player{
  min-height:132px !important;
  height:132px !important;
  overflow:visible !important;
}
.classic-radio-layout .studio-player-main{
  display:grid !important;
  grid-template-columns:58px minmax(0,1fr) !important;
  align-items:center !important;
  gap:14px !important;
  min-width:0 !important;
  padding:10px 0 !important;
}
.classic-radio-layout .studio-play{grid-column:1;grid-row:1 / span 2}
.classic-radio-layout .stream-copy{
  grid-column:2;
  display:grid !important;
  grid-template-rows:auto auto auto !important;
  gap:7px !important;
  align-content:center !important;
  overflow:visible !important;
  min-width:0 !important;
}
.classic-radio-layout .studio-volume{
  display:grid !important;
  visibility:visible !important;
  opacity:1 !important;
  grid-template-columns:38px minmax(180px,720px) 54px !important;
  align-items:center !important;
  gap:10px !important;
  width:min(100%,820px) !important;
  max-width:none !important;
  min-height:38px !important;
  position:relative !important;
  z-index:5 !important;
}
.classic-radio-layout .studio-volume input[type="range"]{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  width:100% !important;
  min-width:180px !important;
  height:12px !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
}
.classic-radio-layout .studio-volume .mute-button,
.classic-radio-layout .studio-volume #volumeValue{
  display:grid !important;
  visibility:visible !important;
  opacity:1 !important;
}
@media(max-width:720px){
  .classic-radio-layout .topbar.studio-player{height:auto !important;min-height:126px !important}
  .classic-radio-layout .studio-volume{grid-template-columns:34px minmax(90px,1fr) 46px !important;width:100% !important}
  .classic-radio-layout .studio-volume input[type="range"]{min-width:90px !important}
}

/* v3.3 Community & Radio polish */
.classic-radio-layout .message{
  max-width:min(860px,92%);
  margin:0 0 14px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(8,16,31,.88),rgba(13,24,43,.72));
  box-shadow:0 9px 26px rgba(0,0,0,.22);
  backdrop-filter:blur(6px);
}
.classic-radio-layout .message:hover{border-color:color-mix(in srgb,var(--accent) 48%,transparent);transform:translateY(-1px)}
.classic-radio-layout .message .avatar{width:46px;height:46px;flex-basis:46px;border-radius:50%;border:2px solid color-mix(in srgb,var(--accent) 65%,transparent);box-shadow:0 0 18px color-mix(in srgb,var(--accent) 25%,transparent)}
.classic-radio-layout .message-meta strong{font-size:15px}.classic-radio-layout .message p{font-size:15px;margin:7px 0 2px}.classic-radio-layout .message-actions{opacity:0;transform:translateY(-3px)}.classic-radio-layout .message:hover .message-actions{opacity:1;transform:none}
.classic-radio-layout .role-pill{background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 38%,#111827),color-mix(in srgb,var(--accent2) 30%,#111827));border:1px solid rgba(255,255,255,.1)}
.classic-radio-layout .rightbar{background:linear-gradient(180deg,rgba(4,9,19,.96),rgba(8,15,28,.9))}
.classic-radio-layout .radio-card{position:relative;overflow:hidden;padding:20px 14px;background:radial-gradient(circle at 50% 10%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 48%),rgba(2,7,16,.84);border-color:color-mix(in srgb,var(--accent) 72%,transparent)}
.classic-radio-layout .radio-card:before{content:"";position:absolute;inset:-80% -30% auto;height:170px;background:radial-gradient(circle,color-mix(in srgb,var(--accent2) 20%,transparent),transparent 68%);pointer-events:none}
.classic-radio-layout .radio-card .live-label{font-size:12px;color:#fb7185;text-shadow:0 0 12px rgba(251,113,133,.7)}
.classic-radio-layout .radio-card h3{font-size:15px;color:#dce7ff;letter-spacing:.12em}
.classic-radio-layout .dj-picture,.classic-radio-layout .dj-picture-placeholder{width:154px;height:154px;border:2px solid color-mix(in srgb,var(--accent) 72%,transparent);box-shadow:0 0 24px color-mix(in srgb,var(--accent) 30%,transparent)}
.classic-radio-layout .radio-card #nowPlaying{font-weight:700;color:#fff;margin:14px 0 5px}.classic-radio-layout .radio-card small{font-size:12px}
.classic-radio-layout .status-line{justify-content:center;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.05)}
.classic-radio-layout .presence-head{display:grid;grid-template-columns:1fr 128px;align-items:center;gap:10px}.classic-radio-layout .presence-head h3{margin:0}.classic-radio-layout .presence-head select{padding:9px 10px}
.online-users{display:grid;gap:9px;margin-top:12px}.online-user{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.045);transition:.18s}.online-user:hover{background:rgba(255,255,255,.075);border-color:color-mix(in srgb,var(--accent) 40%,transparent)}
.online-avatar{position:relative;width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:50%;font-weight:900;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 0 16px color-mix(in srgb,var(--accent) 28%,transparent)}
.online-avatar .presence-dot{position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border:2px solid #08101e}.presence-dot.away{background:#f59e0b}.presence-dot.busy{background:#ef4444}.presence-dot.online{background:#22c55e}
.online-user-copy{display:grid;min-width:0;flex:1}.online-user-copy strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.online-user-copy small{font-size:11px}.online-user-copy em{font-size:10px;color:#7f8da3;font-style:normal;margin-top:2px}.user-actions{display:flex;gap:4px}.user-actions button{width:28px;height:28px;border-radius:8px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.06);color:#fff;cursor:pointer}.user-actions button:hover{background:color-mix(in srgb,var(--accent) 35%,transparent)}
@media(max-width:720px){.classic-radio-layout .message{max-width:100%;border-radius:12px}.classic-radio-layout .message-actions{opacity:1;overflow-x:auto}.online-user{padding:8px}}

/* v3.4 Radio login */
.radio-login-page{min-height:100vh;margin:0;color:#fff;background:#02030a;background-image:linear-gradient(rgba(0,0,0,.22),rgba(0,0,0,.38)),var(--login-bg);background-size:cover;background-position:center;background-attachment:fixed;font-family:Inter,Arial,sans-serif}
.radio-login-header{min-height:84px;display:flex;align-items:center;justify-content:center;gap:18px;padding:12px 24px;background:rgba(0,0,0,.78);border-bottom:2px solid rgba(255,255,255,.82);box-shadow:0 3px 18px var(--accent2);letter-spacing:.22em;text-transform:uppercase}
.radio-login-header strong{font-size:clamp(22px,3vw,38px);background:linear-gradient(90deg,var(--accent2),#fff,#fb7185);-webkit-background-clip:text;color:transparent;text-shadow:0 0 24px color-mix(in srgb,var(--accent2) 60%,transparent)}
.radio-login-header img{width:58px;height:58px;object-fit:contain}
.radio-login-stage{min-height:calc(100vh - 110px);display:grid;grid-template-columns:minmax(220px,280px) minmax(360px,480px) minmax(220px,280px);justify-content:center;align-items:center;gap:38px;padding:70px 30px}
.radio-login-box,.login-side-card{background:rgba(0,0,0,.78);border:2px solid rgba(255,255,255,.72);border-radius:18px;box-shadow:0 0 24px rgba(0,0,0,.8),0 0 22px color-mix(in srgb,var(--accent2) 25%,transparent);backdrop-filter:blur(8px)}
.radio-login-box{padding:30px 30px 22px}
.login-box-brand{text-align:center;border-bottom:2px solid rgba(255,255,255,.65);padding-bottom:15px;margin-bottom:20px}
.login-box-brand img{max-width:210px;max-height:90px;object-fit:contain;margin-bottom:8px}
.login-box-brand h1{margin:0;font-size:27px;text-transform:uppercase;letter-spacing:.06em}
.login-box-brand p{margin:7px 0 0;color:#93c5fd}
.radio-login-form{display:grid;gap:15px}
.radio-login-form label{display:grid;gap:6px;font-weight:700}
.radio-login-form input{width:100%;box-sizing:border-box;min-height:48px;padding:0 14px;border:1px solid #cbd5e1;border-radius:9px;background:#eef4ff;color:#0f172a;font-size:16px;outline:none}
.radio-login-form input:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent2) 35%,transparent);border-color:var(--accent2)}
.login-privacy-note{padding:10px 12px;border-radius:8px;background:rgba(255,255,255,.07);font-size:12px;color:#cbd5e1;line-height:1.5}
.radio-login-submit,.radio-login-secondary{display:flex;align-items:center;justify-content:center;min-height:52px;border-radius:10px;font-weight:900;text-decoration:none;letter-spacing:.04em}
.radio-login-submit{border:0;background:linear-gradient(#f8fafc,#aeb8c3);color:#030712;font-size:18px;cursor:pointer}
.radio-login-submit:hover{filter:brightness(1.1);transform:translateY(-1px)}
.radio-login-secondary{margin-top:14px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#cbd5e1}
.login-links{display:flex;justify-content:center;gap:18px;margin:18px 0 12px}.login-links a{color:#fff;text-decoration:none}.login-links a:hover{color:var(--accent2)}
.radio-login-box footer{text-align:center;border-top:1px solid rgba(255,255,255,.12);padding-top:12px;color:#94a3b8;font-size:12px}
.login-side-card{padding:24px;text-align:center}.login-side-card h2{margin:0 0 20px;font-size:18px}.login-radio-card{display:grid;justify-items:center;gap:12px;min-width:0}.login-radio-card h2::before{content:'●';color:#ef4444;font-size:12px;margin-right:8px;vertical-align:2px;text-shadow:0 0 12px #ef4444}.login-dj-picture{width:150px;height:150px;border-radius:16px;padding:4px;background:linear-gradient(135deg,var(--accent2),var(--accent));display:grid;place-items:center;box-shadow:0 0 22px color-mix(in srgb,var(--accent2) 38%,transparent)}.login-dj-picture img,.login-dj-picture span{width:100%;height:100%;border-radius:12px;object-fit:contain;background:#050a14;display:grid;place-items:center;font-size:48px}.login-radio-card strong{color:var(--accent2);font-size:16px;line-height:1.25}.login-radio-card small{min-height:38px;max-width:260px;color:#dbeafe;line-height:1.35;overflow-wrap:anywhere}.login-play-btn{width:54px;height:54px;border-radius:50%;border:0;background:var(--accent2);color:#03111d;font-size:22px;font-weight:900;cursor:pointer;box-shadow:0 0 18px color-mix(in srgb,var(--accent2) 45%,transparent)}.login-welcome-card h2{color:#e2e8f0}.login-welcome-card p{line-height:1.7;color:#dbeafe}.radio-login-page .alert{margin-bottom:14px}
@media(max-width:1050px){.radio-login-stage{grid-template-columns:minmax(330px,500px);padding:35px 18px}.login-side-card{max-width:500px;width:100%;box-sizing:border-box}.login-radio-card{order:2}.radio-login-box{order:1}.login-welcome-card{order:3}}
@media(max-width:560px){.radio-login-header{min-height:66px;padding:8px 12px}.radio-login-header strong{font-size:18px;letter-spacing:.08em;text-align:center}.radio-login-header img{display:none}.radio-login-stage{display:flex;flex-direction:column;padding:22px 10px;gap:16px}.radio-login-box,.login-side-card{width:100%;box-sizing:border-box;border-radius:13px}.radio-login-box{padding:22px 16px}.login-box-brand h1{font-size:22px}}

/* Login-Radio v3.4.1 */
.login-volume-row{display:grid;grid-template-columns:42px minmax(120px,1fr) 48px;align-items:center;gap:10px;width:100%;margin-top:12px}
.login-mute-btn{width:42px;height:38px;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:rgba(8,10,24,.75);color:#fff;cursor:pointer;font-size:18px}
.login-volume{width:100%;height:8px;margin:0;padding:0;accent-color:var(--accent2);cursor:pointer}
.login-volume-value{font-variant-numeric:tabular-nums;font-weight:800;color:#fff;text-align:right}
.login-play-btn:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:700px){.login-volume-row{grid-template-columns:38px minmax(90px,1fr) 44px}.login-mute-btn{width:38px}}

/* Login-Radio Bildkorrektur v3.4.2 */
@media(max-width:560px){.login-dj-picture{width:132px;height:132px}.login-radio-card small{max-width:220px}}

/* v3.5 – hochwertiger Radio-Login */
.radio-login-page{position:relative;overflow-x:hidden;background-color:#02030a}
.radio-login-page::before{content:"";position:fixed;inset:-12%;pointer-events:none;z-index:0;background:
 radial-gradient(circle at 18% 25%,color-mix(in srgb,var(--accent) 30%,transparent),transparent 34%),
 radial-gradient(circle at 82% 65%,color-mix(in srgb,var(--accent2) 24%,transparent),transparent 38%);
 animation:pofdLoginGlow 14s ease-in-out infinite alternate}
.radio-login-header,.radio-login-stage{position:relative;z-index:1}
@keyframes pofdLoginGlow{from{transform:translate3d(-1.5%,-1%,0) scale(1)}to{transform:translate3d(1.5%,1%,0) scale(1.06)}}
.radio-login-box,.login-side-card{background:linear-gradient(145deg,rgba(5,8,20,.77),rgba(2,6,18,.61));border:1px solid rgba(255,255,255,.34);box-shadow:0 20px 55px rgba(0,0,0,.62),0 0 28px color-mix(in srgb,var(--accent2) 23%,transparent);backdrop-filter:blur(18px) saturate(135%);-webkit-backdrop-filter:blur(18px) saturate(135%)}
.radio-login-box{position:relative;overflow:hidden}
.radio-login-box::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,var(--accent2),var(--accent),transparent);opacity:.9}
.login-input-wrap{display:grid;grid-template-columns:46px minmax(0,1fr);align-items:center;overflow:hidden;border:1px solid rgba(148,163,184,.6);border-radius:12px;background:rgba(239,246,255,.94);transition:.2s ease}
.login-input-wrap:focus-within{border-color:var(--accent2);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent2) 28%,transparent),0 0 20px color-mix(in srgb,var(--accent2) 18%,transparent);transform:translateY(-1px)}
.login-input-icon{display:grid;place-items:center;height:100%;min-height:50px;color:#334155;background:rgba(15,23,42,.07);border-right:1px solid rgba(15,23,42,.12);font-size:17px}
.radio-login-form .login-input-wrap input{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;min-height:50px;padding:0 15px;color:#0f172a}
.radio-login-form .login-input-wrap input::placeholder{color:#64748b}
.radio-login-submit{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--accent2),#f8fafc 48%,var(--accent));box-shadow:0 10px 30px color-mix(in srgb,var(--accent2) 25%,transparent);transition:transform .2s ease,filter .2s ease,box-shadow .2s ease}
.radio-login-submit::after{content:"";position:absolute;top:-120%;left:-35%;width:28%;height:340%;transform:rotate(24deg);background:rgba(255,255,255,.45);transition:left .55s ease}
.radio-login-submit:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 14px 38px color-mix(in srgb,var(--accent2) 34%,transparent)}
.radio-login-submit:hover::after{left:115%}
.login-live-dot{display:inline-block;width:10px;height:10px;margin-right:9px;border-radius:50%;background:#ef4444;box-shadow:0 0 0 0 rgba(239,68,68,.65);animation:pofdLivePulse 1.6s infinite;vertical-align:1px}
@keyframes pofdLivePulse{0%{box-shadow:0 0 0 0 rgba(239,68,68,.65)}70%{box-shadow:0 0 0 11px rgba(239,68,68,0)}100%{box-shadow:0 0 0 0 rgba(239,68,68,0)}}
.login-radio-card h2::before{display:none!important}
.login-song-ticker{width:100%;max-width:260px;min-height:38px;overflow:hidden;color:#dbeafe;line-height:1.35;display:flex;align-items:center;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.login-song-ticker span{display:inline-block;min-width:100%;white-space:nowrap;padding-left:100%;animation:pofdSongTicker 16s linear infinite}
.login-song-ticker:hover span{animation-play-state:paused}
@keyframes pofdSongTicker{from{transform:translateX(0)}to{transform:translateX(-100%)}}
.login-dj-picture{transition:transform .25s ease,box-shadow .25s ease}
.login-dj-picture:hover{transform:translateY(-3px) scale(1.015);box-shadow:0 12px 34px rgba(0,0,0,.45),0 0 28px color-mix(in srgb,var(--accent2) 48%,transparent)}
.login-play-btn{transition:transform .2s ease,filter .2s ease}.login-play-btn:hover{transform:scale(1.07);filter:brightness(1.12)}
@media (prefers-reduced-motion:reduce){.radio-login-page::before,.login-live-dot,.login-song-ticker span{animation:none}.login-song-ticker span{padding-left:0;white-space:normal}}

/* v3.5.1: echter Gastzugang auf der Loginseite */
.guest-login-divider{display:flex;align-items:center;gap:12px;margin:18px 0 12px;color:rgba(255,255,255,.62);font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;font-weight:800}
.guest-login-divider::before,.guest-login-divider::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent)}
.guest-login-form{display:grid;gap:7px}
.guest-login-form>label{font-size:.82rem;font-weight:800;color:rgba(255,255,255,.85)}
.guest-login-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:stretch}
.guest-name-wrap{min-width:0}
.guest-login-submit{display:flex;align-items:center;justify-content:center;margin:0;min-height:48px;padding:0 18px;white-space:nowrap;border:1px solid color-mix(in srgb,var(--accent2) 75%,white 10%);background:linear-gradient(135deg,color-mix(in srgb,var(--accent2) 32%,#07111e),color-mix(in srgb,var(--accent) 28%,#07111e));color:#fff;font-weight:900;text-decoration:none;border-radius:12px;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.24)}
.guest-login-submit:hover{transform:translateY(-1px);filter:brightness(1.12)}
@media(max-width:620px){.guest-login-row{grid-template-columns:1fr}.guest-login-submit{width:100%}}

/* v3.6 Chat-Komfort */
.typing-indicator{display:flex;align-items:center;gap:9px;min-height:30px;padding:4px 16px;color:#a9bad2;font-size:12px;background:rgba(3,8,18,.76);border-top:1px solid rgba(255,255,255,.05)}
.typing-indicator[hidden]{display:none!important}.typing-dots{display:flex;gap:3px}.typing-dots i{width:5px;height:5px;border-radius:50%;background:var(--accent2);animation:pofdTyping 1s infinite ease-in-out}.typing-dots i:nth-child(2){animation-delay:.14s}.typing-dots i:nth-child(3){animation-delay:.28s}@keyframes pofdTyping{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}
.online-avatar{overflow:visible}.online-avatar>img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}.online-avatar .presence-dot{z-index:2}
.classic-radio-layout .message{animation:pofdMessageIn .18s ease-out}@keyframes pofdMessageIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
#soundToggle[aria-pressed="true"]{opacity:.62;filter:grayscale(.5)}
@media(prefers-reduced-motion:reduce){.typing-dots i,.classic-radio-layout .message{animation:none}}


/* Version 3.7: Pins, Suche und Ungelesen-Zähler */
.pinned-panel{position:absolute;z-index:35;top:112px;left:18px;right:calc(var(--rightbar-width,300px) + 18px);max-height:45vh;overflow:auto;background:rgba(7,12,23,.97);border:1px solid rgba(96,165,250,.45);border-radius:14px;box-shadow:0 18px 55px rgba(0,0,0,.5);padding:12px}.pinned-panel[hidden]{display:none!important}.pinned-panel header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.pinned-panel header button{border:0;background:transparent;color:#fff;font-size:22px;cursor:pointer}.pinned-panel article{display:grid;grid-template-columns:minmax(90px,auto) 1fr auto;gap:10px;align-items:start;padding:10px;border-top:1px solid rgba(255,255,255,.07)}.pinned-panel article span{overflow-wrap:anywhere}.pinned-panel article small{color:var(--muted)}.message.is-pinned{border-color:rgba(250,204,21,.55)!important;box-shadow:inset 3px 0 0 #facc15,0 8px 25px rgba(0,0,0,.16)}.new-messages-button{position:absolute;z-index:25;left:50%;bottom:116px;transform:translateX(-50%);border:1px solid rgba(255,255,255,.18);background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;border-radius:999px;padding:9px 16px;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.35);cursor:pointer}.new-messages-button[hidden]{display:none!important}
@media(max-width:900px){.pinned-panel{right:18px;top:100px}.pinned-panel article{grid-template-columns:1fr}.new-messages-button{bottom:130px}}


/* Version 3.8: Benachrichtigungszentrum */
.notification-tool{position:relative}.notification-badge{position:absolute;right:-5px;top:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#ef4444;color:#fff;font-size:11px;font-weight:800;line-height:18px;text-align:center;box-shadow:0 0 0 2px rgba(8,13,24,.95)}
.notification-panel{position:fixed;right:18px;bottom:82px;width:min(410px,calc(100vw - 28px));max-height:min(620px,72vh);z-index:1200;border:1px solid color-mix(in srgb,var(--accent2) 65%,transparent);border-radius:16px;background:rgba(8,13,24,.97);box-shadow:0 24px 70px rgba(0,0,0,.55),0 0 28px color-mix(in srgb,var(--accent2) 24%,transparent);backdrop-filter:blur(18px);overflow:hidden}.notification-panel[hidden]{display:none!important}.notification-panel>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.1)}.notification-panel header div:first-child{display:grid;gap:2px}.notification-panel header small{opacity:.68}.notification-panel header button{border:0;border-radius:9px;background:rgba(255,255,255,.09);color:inherit;padding:7px 10px;cursor:pointer}.notification-panel section{overflow:auto;max-height:calc(min(620px,72vh) - 70px);padding:8px}.notification-item{display:grid;gap:5px;padding:12px;border-radius:12px;border:1px solid transparent;cursor:pointer}.notification-item:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.08)}.notification-item strong{font-size:14px}.notification-item p{margin:0;opacity:.82;font-size:13px;line-height:1.4}.notification-item small{opacity:.55}.notification-empty{padding:28px 18px;text-align:center;opacity:.7}
@media(max-width:700px){.notification-panel{right:8px;bottom:74px;width:calc(100vw - 16px)}}

.notification-highlight{outline:2px solid #f59e0b!important;box-shadow:0 0 30px rgba(245,158,11,.45)!important}


/* Version 3.9 – Freunde und Blockierungen */
.friends-panel{position:fixed;right:24px;bottom:24px;width:min(430px,calc(100vw - 30px));max-height:min(620px,calc(100vh - 48px));z-index:52;background:#0b1220;border:1px solid rgba(255,255,255,.16);border-radius:18px;box-shadow:0 24px 80px rgba(0,0,0,.58);display:grid;grid-template-rows:auto auto minmax(120px,1fr);overflow:hidden}.friends-panel[hidden]{display:none}.friends-panel header{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;background:rgba(255,255,255,.055)}.friends-panel header strong,.friends-panel header small{display:block}.friends-panel header small{color:#94a3b8;margin-top:3px}.friends-panel header button{border:0;background:none;color:#fff;font-size:26px;cursor:pointer}.friends-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:9px;background:rgba(0,0,0,.18)}.friends-tabs button{border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(255,255,255,.05);color:#dbeafe;padding:9px;cursor:pointer}.friends-tabs button.active{background:color-mix(in srgb,var(--accent) 35%,#101827);border-color:color-mix(in srgb,var(--accent) 70%,transparent);color:#fff}.friends-panel section{padding:10px;overflow:auto}.friend-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(255,255,255,.04);margin-bottom:7px}.friend-row strong,.friend-row small{display:block;overflow:hidden;text-overflow:ellipsis}.friend-row small{color:#94a3b8;margin-top:2px}.friend-actions{display:flex;gap:5px;align-items:center}.friend-actions button{border:1px solid rgba(255,255,255,.1);border-radius:8px;background:rgba(255,255,255,.07);color:#fff;padding:7px 9px;cursor:pointer}.friend-actions button:hover{background:color-mix(in srgb,var(--accent) 35%,transparent)}.pending-label{font-size:11px;color:#fbbf24}.online-avatar img,.friend-row .online-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}@media(max-width:600px){.friends-panel{right:8px;bottom:8px;width:calc(100vw - 16px);max-height:calc(100vh - 16px)}.friend-actions button{padding:6px;font-size:11px}}

/* Version 4.0 – modernes Profilsystem */
.profile-v4{background:radial-gradient(circle at 15% 10%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 32%),#050914}.profile-v4 .profile-shell{max-width:1100px}.profile-v4-card{overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 45%,rgba(255,255,255,.12));box-shadow:0 24px 80px rgba(0,0,0,.48)}.profile-v4-card .profile-banner{height:280px;background-size:cover;background-position:center;background-color:#101827}.profile-v4-card .profile-banner:after{content:"";display:block;height:100%;background:linear-gradient(180deg,transparent 35%,rgba(5,9,20,.94))}.profile-v4-head{display:flex;align-items:flex-end;gap:24px;padding:0 32px 24px;margin-top:-70px;position:relative}.profile-avatar-v4{width:148px;height:148px;flex:0 0 148px;border:6px solid #08101e;box-shadow:0 0 0 3px var(--accent),0 14px 40px rgba(0,0,0,.45);position:relative}.profile-avatar-v4 img{width:100%;height:100%;object-fit:cover;border-radius:50%}.profile-status{position:absolute;right:8px;bottom:8px;width:22px;height:22px;border-radius:50%;border:4px solid #08101e;background:#64748b}.profile-status.status-online{background:#22c55e}.profile-status.status-away{background:#f59e0b}.profile-status.status-busy{background:#ef4444}.profile-v4-title h1{margin:0;font-size:clamp(30px,5vw,48px)}.profile-v4-title p{margin:6px 0 12px;color:#b9c7db}.profile-badges-v4{display:flex;flex-wrap:wrap;gap:8px}.rank-pill,.profile-badge-v4{border:1px solid color-mix(in srgb,var(--rank-color,var(--badge-color)) 70%,transparent);background:color-mix(in srgb,var(--rank-color,var(--badge-color)) 18%,rgba(255,255,255,.04));color:#fff;border-radius:999px;padding:6px 10px;font-weight:800;font-size:12px}.profile-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:0 32px 28px}.profile-stat-grid article{display:grid;gap:5px;text-align:center;padding:18px;border-radius:15px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08)}.profile-stat-grid strong{font-size:22px;color:#fff}.profile-stat-grid span{font-size:12px;color:#94a3b8}.profile-content-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(250px,.75fr);gap:18px;padding:0 32px 32px}.profile-section{padding:20px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);margin-bottom:18px}.profile-section h2{margin:0 0 13px;font-size:17px}.profile-section p{line-height:1.7;color:#d5dfef}.profile-info-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.profile-info-list span{display:grid;gap:4px;padding:12px;border-radius:12px;background:rgba(255,255,255,.035);color:#dbe7f7}.profile-info-list b{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#7f93ad}.profile-team-list,.profile-socials{display:flex;flex-wrap:wrap;gap:8px}.profile-socials a{padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.06);color:#fff;text-decoration:none}.profile-socials a:hover{background:color-mix(in srgb,var(--accent) 28%,transparent)}.profile-edit-v4{margin-top:22px}.profile-edit-v4 input[type=color]{min-height:48px;padding:6px}.profile-edit-v4 .grid-form{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:760px){.profile-v4-card .profile-banner{height:210px}.profile-v4-head{align-items:center;flex-direction:column;text-align:center;margin-top:-62px;padding:0 18px 20px}.profile-avatar-v4{width:124px;height:124px;flex-basis:124px}.profile-badges-v4{justify-content:center}.profile-stat-grid{grid-template-columns:repeat(2,1fr);padding:0 16px 20px}.profile-content-grid{grid-template-columns:1fr;padding:0 16px 20px}.profile-info-list{grid-template-columns:1fr}.profile-edit-v4 .grid-form{grid-template-columns:1fr}}


/* Version 4.6: On-Air Center */
.on-air-panel{position:fixed;right:24px;bottom:84px;z-index:70;width:min(430px,calc(100vw - 32px));max-height:75vh;overflow:auto;background:rgba(8,15,30,.98);border:1px solid rgba(244,63,94,.55);border-radius:18px;box-shadow:0 22px 70px rgba(0,0,0,.55),0 0 32px rgba(244,63,94,.18);padding:16px}.on-air-panel header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.on-air-panel header button{font-size:24px}.on-air-form{display:grid;gap:12px}.on-air-form label{display:grid;gap:6px}.on-air-form input,.on-air-form select{width:100%}.on-air-time-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.on-air-actions{display:flex;gap:10px;flex-wrap:wrap}.on-air-current{margin-top:14px;padding:12px;border-radius:12px;background:rgba(124,58,237,.12);display:grid;gap:4px}.on-air-current strong{color:#fb7185}.bottom-chat-toolbar #onAirToggle.is-live{background:#be123c;color:#fff;box-shadow:0 0 18px rgba(244,63,94,.65);animation:onAirPulse 1.6s infinite}@keyframes onAirPulse{50%{transform:scale(1.08);box-shadow:0 0 28px rgba(244,63,94,.9)}}.radio-card .show-title{display:block;color:#fda4af;font-weight:800;margin-top:8px}@media(max-width:600px){.on-air-panel{right:10px;bottom:74px}.on-air-time-grid{grid-template-columns:1fr}}

/* Version 4.8: modernes Nachrichtensystem */
.message.is-deleted{opacity:.72}.deleted-message{font-style:italic;color:var(--muted);border:1px dashed rgba(255,255,255,.14);padding:9px 12px;border-radius:10px;background:rgba(255,255,255,.025)}
.edited-label{border:0;background:transparent;color:var(--muted);font-size:.72rem;cursor:pointer;text-decoration:underline;padding:0}.quick-reactions{display:inline-flex;gap:3px;flex-wrap:wrap}.quick-reactions button{min-width:28px;padding:3px 5px}.message-body code{background:rgba(0,0,0,.3);padding:2px 5px;border-radius:5px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.message-body blockquote{margin:6px 0;padding:6px 10px;border-left:3px solid var(--accent);background:rgba(255,255,255,.04);border-radius:0 7px 7px 0}.message-body del{opacity:.7}.message-history-card{max-width:620px}.message-history-card #messageHistoryItems{max-height:55vh;overflow:auto;display:grid;gap:10px}.message-history-card article{padding:10px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(255,255,255,.04)}.message-history-card article p{margin:6px 0 0}

/* v4.9.10: grosse Smilies wie im klassischen Radiochat */
.message-body p.smiley-only-message{display:flex;align-items:flex-end;flex-wrap:wrap;gap:10px;min-height:110px;margin:8px 0 4px;overflow:visible}
.message-body p.smiley-only-message .chat-smiley{width:auto!important;height:auto!important;max-width:170px!important;max-height:130px!important;margin:0!important;transform:none!important;object-fit:contain}
.message-body p:not(.smiley-only-message) .chat-smiley{width:auto;height:auto;max-width:72px;max-height:72px;transform:none;margin:2px 5px}
.smiley-picker{width:min(720px,calc(100% - 44px));max-height:430px;gap:14px;padding:16px}
.smiley-picker button{width:96px;height:96px;padding:5px;background:#05070d;border-color:var(--line);overflow:hidden}
.smiley-picker img{width:100%!important;height:100%!important;max-width:100%;max-height:100%;object-fit:contain;transform:none!important}
@media(max-width:640px){.message-body p.smiley-only-message{min-height:85px;gap:7px}.message-body p.smiley-only-message .chat-smiley{max-width:125px!important;max-height:100px!important}.message-body p:not(.smiley-only-message) .chat-smiley{max-width:58px;max-height:58px}.smiley-picker{width:calc(100% - 20px);left:10px;max-height:360px}.smiley-picker button{width:76px;height:76px}}


/* Smiley-Kategorien */
.smiley-picker{display:block!important}.smiley-picker[hidden]{display:none!important}
.smiley-category-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 12px;margin-bottom:10px;border-bottom:1px solid var(--line)}
.smiley-category-tab{width:auto!important;height:auto!important;min-height:38px;padding:8px 12px!important;white-space:nowrap;font-weight:700;color:var(--text);background:var(--panel2)!important;border:1px solid var(--line)!important}
.smiley-category-tab.active{border-color:var(--accent)!important;box-shadow:0 0 0 1px var(--accent) inset;color:#fff}
.smiley-category-grid{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.smiley-category-grid>button{width:96px;height:96px;padding:5px;background:#05070d;border:1px solid var(--line);border-radius:12px;overflow:hidden;cursor:pointer}
.smiley-category-grid>button:hover{border-color:var(--accent)}
.smiley-category-grid img{width:100%!important;height:100%!important;object-fit:contain;transform:none!important}
@media(max-width:640px){.smiley-category-grid>button{width:76px;height:76px}.smiley-category-tabs{gap:6px}.smiley-category-tab{font-size:13px;padding:7px 10px!important}}

/* v4.9.12 – eigenständiger PofD Login */
.radio-login-page{display:flex;min-height:100vh;flex-direction:column;background-position:center!important}
.pofd-login-topbar{min-height:72px;justify-content:space-between;padding:10px clamp(18px,4vw,58px);border:0;border-bottom:1px solid rgba(255,255,255,.12);background:rgba(2,6,18,.72);box-shadow:none;letter-spacing:normal;text-transform:none;backdrop-filter:blur(16px)}
.pofd-login-brand{display:flex;align-items:center;gap:13px;color:#fff;text-decoration:none}.pofd-login-brand img,.pofd-brand-mark{width:46px;height:46px;border-radius:14px;object-fit:contain;border:1px solid color-mix(in srgb,var(--accent2) 55%,transparent);background:rgba(255,255,255,.06);box-shadow:0 0 24px color-mix(in srgb,var(--accent2) 20%,transparent)}
.pofd-brand-mark{display:grid;place-items:center;font-weight:900;font-size:24px}.pofd-login-brand>span:last-child{display:grid;gap:2px}.pofd-login-brand strong{font-size:17px!important;letter-spacing:.04em!important;color:#fff!important;background:none!important;text-shadow:none!important}.pofd-login-brand small{color:#93a4bd;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.pofd-login-topmeta{display:flex;align-items:center;gap:9px;color:#b9c8dc;font-size:13px}.pofd-status-pulse{width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 14px #22c55e}
.pofd-login-shell{position:relative;z-index:1;flex:1;width:min(1220px,calc(100% - 36px));margin:auto;display:grid;grid-template-columns:minmax(0,1.18fr) minmax(380px,480px);gap:clamp(28px,5vw,72px);align-items:center;padding:46px 0 54px}
.pofd-login-hero{min-width:0;display:grid;align-content:center;gap:34px}.pofd-hero-copy{max-width:680px}.pofd-eyebrow{display:inline-flex;padding:8px 12px;border:1px solid color-mix(in srgb,var(--accent2) 40%,transparent);border-radius:999px;background:rgba(3,9,24,.58);color:var(--accent2);font-weight:900;font-size:11px;letter-spacing:.16em}
.pofd-hero-copy h1{margin:20px 0 12px;font-size:clamp(38px,5vw,70px);line-height:.98;letter-spacing:-.045em;max-width:760px;text-shadow:0 16px 40px rgba(0,0,0,.75)}.pofd-hero-copy>p{margin:0;max-width:590px;color:#c5d2e5;font-size:clamp(16px,2vw,21px);line-height:1.65}
.pofd-welcome-inline{display:flex;gap:14px;align-items:flex-start;margin-top:28px;padding:16px 18px;max-width:570px;border-left:3px solid var(--accent2);border-radius:0 14px 14px 0;background:linear-gradient(90deg,color-mix(in srgb,var(--accent2) 14%,rgba(4,8,20,.72)),rgba(4,8,20,.28));backdrop-filter:blur(12px)}.pofd-welcome-icon{display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--accent2),var(--accent));color:#03101c;font-weight:900}.pofd-welcome-inline strong{font-size:15px}.pofd-welcome-inline p{margin:5px 0 0;color:#acbdd2;line-height:1.45;font-size:13px}
.pofd-radio-dock{display:grid;grid-template-columns:88px minmax(0,1fr) 58px;align-items:center;gap:17px;max-width:650px;padding:16px 18px;border:1px solid rgba(255,255,255,.18);border-radius:22px;background:linear-gradient(135deg,rgba(5,10,27,.86),rgba(12,20,42,.63));box-shadow:0 22px 60px rgba(0,0,0,.42);backdrop-filter:blur(18px)}
.pofd-radio-cover.login-dj-picture{width:82px;height:82px;padding:3px;border-radius:19px}.pofd-radio-cover.login-dj-picture img,.pofd-radio-cover.login-dj-picture span{border-radius:16px}.pofd-radio-info{min-width:0;display:grid;gap:5px}.pofd-live-label{display:flex;align-items:center;color:#f8fafc;font-size:11px;font-weight:900;letter-spacing:.12em}.pofd-radio-info>strong{font-size:18px!important;color:#fff!important}.pofd-radio-dock .login-song-ticker{max-width:none;min-height:24px;font-size:13px;color:#9fb0c8}.pofd-radio-dock .login-play-btn{width:54px;height:54px}.pofd-radio-dock .login-volume-row{grid-column:2/4;margin:0;grid-template-columns:36px minmax(90px,1fr) 45px}.pofd-radio-dock .login-mute-btn{width:36px;height:34px}
.pofd-auth-panel.radio-login-box{padding:34px 34px 24px;border-radius:28px;border:1px solid rgba(255,255,255,.2);background:linear-gradient(160deg,rgba(10,16,38,.94),rgba(3,7,20,.86));box-shadow:0 34px 90px rgba(0,0,0,.62),inset 0 1px rgba(255,255,255,.05)}.pofd-auth-panel::before{height:4px;background:linear-gradient(90deg,var(--accent2),var(--accent));opacity:1}.pofd-auth-heading{margin-bottom:26px}.pofd-auth-kicker{color:var(--accent2);font-size:11px;font-weight:900;letter-spacing:.18em}.pofd-auth-heading h2{margin:9px 0 5px;font-size:30px;letter-spacing:-.025em}.pofd-auth-heading p{margin:0;color:#8fa1ba;font-size:14px}
.pofd-auth-panel .radio-login-form{gap:17px}.pofd-auth-panel .radio-login-form label>span:first-child{font-size:13px;color:#d8e2f0}.pofd-auth-panel .login-input-wrap{grid-template-columns:48px minmax(0,1fr);border-radius:15px;background:rgba(241,245,249,.98)}.pofd-auth-panel .radio-login-submit{justify-content:space-between;padding:0 20px;border-radius:15px;background:linear-gradient(100deg,var(--accent2),var(--accent));color:#fff;text-transform:uppercase;letter-spacing:.08em}.pofd-auth-panel .radio-login-submit b{font-size:23px}.pofd-auth-panel .login-privacy-note{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);color:#9cacbf}
.pofd-guest-access{margin-top:18px;border:1px solid rgba(255,255,255,.1);border-radius:15px;background:rgba(255,255,255,.035);overflow:hidden}.pofd-guest-access summary{padding:14px 16px;cursor:pointer;color:#cad6e5;font-size:13px;font-weight:800;list-style:none}.pofd-guest-access summary::-webkit-details-marker{display:none}.pofd-guest-access summary::after{content:'＋';float:right;color:var(--accent2)}.pofd-guest-access[open] summary::after{content:'−'}.pofd-guest-access .guest-login-form{padding:0 14px 14px}.pofd-auth-panel .radio-login-secondary{margin-top:0;min-height:50px;padding:0 18px;border-radius:13px;color:#fff;background:color-mix(in srgb,var(--accent) 32%,rgba(255,255,255,.06));cursor:pointer}.pofd-auth-panel .login-links{margin:18px 0 14px}.pofd-auth-panel .login-links a{color:#aab9cd;font-size:13px}.pofd-auth-panel .login-links strong{color:var(--accent2)}
@media(max-width:980px){.pofd-login-shell{grid-template-columns:1fr;width:min(680px,calc(100% - 28px));padding:34px 0}.pofd-login-hero{gap:22px}.pofd-hero-copy h1{font-size:clamp(38px,9vw,62px)}.pofd-auth-panel{order:2}.pofd-login-hero{order:1}}
@media(max-width:620px){.pofd-login-topbar{min-height:62px;padding:8px 13px}.pofd-login-brand img,.pofd-brand-mark{width:40px;height:40px}.pofd-login-brand small,.pofd-login-topmeta{display:none}.pofd-login-shell{width:calc(100% - 20px);padding:22px 0 30px;gap:22px}.pofd-hero-copy h1{margin-top:15px;font-size:39px}.pofd-hero-copy>p{font-size:15px}.pofd-welcome-inline{margin-top:18px}.pofd-radio-dock{grid-template-columns:68px minmax(0,1fr) 48px;padding:13px;gap:12px;border-radius:18px}.pofd-radio-cover.login-dj-picture{width:64px;height:64px}.pofd-radio-dock .login-play-btn{width:46px;height:46px}.pofd-radio-dock .login-volume-row{grid-column:1/4}.pofd-auth-panel.radio-login-box{padding:27px 18px 20px;border-radius:22px}.pofd-auth-heading h2{font-size:25px}.guest-login-row{grid-template-columns:1fr}.pofd-auth-panel .radio-login-secondary{width:100%}}
