.wl-wrapper {
    --wl-primary: #b98a6a;
    --wl-primary-dark: #8a6248;
    --wl-bg: #fdfaf6;
    --wl-text: #3a2f28;
    --wl-accent: #e8c9b0;
    --wl-error: #c0392b;
    --wl-live: #d62828;
    --wl-radius: 14px;
    max-width: 900px;
    margin: 0 auto;
    font-family: 'Segoe UI', Arial, sans-serif;
    color: var(--wl-text);
}

.wl-wrapper h1, .wl-wrapper h2 { font-family: Georgia, 'Times New Roman', serif; color: var(--wl-primary-dark); text-align: center; }

.wl-countdown-box { text-align: center; margin-bottom: 2rem; }
#wl-countdown { font-size: 1.4rem; font-weight: bold; color: var(--wl-primary); }
#wl-countdown span { display: inline-block; min-width: 2.5ch; }

.wl-login-box {
    background: #fff; border-radius: var(--wl-radius); padding: 2rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06); max-width: 420px; margin: 0 auto;
}
.wl-login-box form { display: flex; flex-direction: column; gap: 0.75rem; }
.wl-login-box label { font-weight: 600; }
.wl-login-box input { padding: 0.7rem; border: 1px solid #ddd; border-radius: 8px; font-size: 1rem; }
.wl-login-box button, .wl-chat-box button {
    background: var(--wl-primary); color: #fff; border: none; padding: 0.8rem;
    border-radius: 8px; font-size: 1rem; cursor: pointer; transition: background 0.2s;
}
.wl-login-box button:hover, .wl-chat-box button:hover { background: var(--wl-primary-dark); }

.wl-alert-error { color: #fff; background: var(--wl-error); padding: 0.6rem 1rem; border-radius: 8px; }
.wl-alert-success { color: #fff; background: #2e7d32; padding: 0.6rem 1rem; border-radius: 8px; }

.wl-recording-notice { text-align: center; font-size: 0.85rem; opacity: 0.75; }

.wl-player-wrapper { position: relative; background: #000; border-radius: var(--wl-radius); overflow: hidden; }
#wl-video { width: 100%; display: block; aspect-ratio: 16 / 9; background: #000; }

.wl-embed-wrapper { padding: 0; }
.wl-embed-wrapper iframe { width: 100%; display: block; aspect-ratio: 16 / 9; height: auto; border: 0; }

.wl-live-badge {
    position: absolute; top: 12px; left: 12px; background: var(--wl-live); color: #fff;
    padding: 4px 10px; border-radius: 6px; font-weight: bold; letter-spacing: 1px;
    animation: wl-pulse 1.5s infinite;
}
@keyframes wl-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.5; } }

#wl-fullscreen-btn {
    position: absolute; bottom: 12px; right: 12px; background: rgba(0,0,0,0.6); color: #fff;
    border: none; padding: 8px 14px; border-radius: 6px; cursor: pointer;
}
#wl-music-toggle {
    margin: 0.6rem 0; border: none; background: var(--wl-accent); border-radius: 50%;
    width: 42px; height: 42px; cursor: pointer; font-size: 1.1rem;
}

.wl-chat-box {
    background: #fff; border-radius: var(--wl-radius); padding: 1rem; margin-top: 1.5rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}
.wl-chat-messages {
    height: 260px; overflow-y: auto; display: flex; flex-direction: column; gap: 6px;
    margin-bottom: 0.8rem; padding-right: 4px;
}
.wl-chat-messages .msg { background: var(--wl-bg); border-radius: 8px; padding: 6px 10px; font-size: 0.92rem; }
.wl-chat-messages .msg strong { color: var(--wl-primary-dark); }

#wl-chat-form { display: flex; gap: 8px; }
#wl-chat-input { flex: 1; padding: 0.7rem; border-radius: 8px; border: 1px solid #ddd; }

.wl-gdpr-notice { text-align: center; font-size: 0.75rem; opacity: 0.7; max-width: 700px; margin: 1.5rem auto 0; }

@media (max-width: 600px) {
    .wl-login-box { padding: 1.2rem; }
}
@media (min-width: 1400px) {
    #wl-countdown { font-size: 2rem; }
}

/* Admin-Bereich (WP-Backend) */
.wl-admin-table { width: 100%; border-collapse: collapse; background: #fff; }
.wl-admin-table th, .wl-admin-table td { padding: 0.6rem 0.9rem; border-bottom: 1px solid #eee; text-align: left; }
.wl-admin-table th { background: var(--wl-accent); }
.wl-admin-form { max-width: 480px; background: #fff; padding: 1.2rem; border: 1px solid #ddd; border-radius: 8px; }
.wl-admin-form label { display: block; font-weight: 600; margin-top: 0.7rem; }
.wl-admin-form input { width: 100%; padding: 0.5rem; border: 1px solid #ddd; border-radius: 6px; margin-top: 0.3rem; }