/* VANDERMEYER gemeinsame oeffentliche Gestaltung */
:root{--vm-gold:#eabd65;--vm-gold-soft:#f7d99a;--vm-night:#100f18;--vm-panel:#211b22;--vm-text:#fff4df}
html{color-scheme:dark}
body{background:var(--vm-night)!important;color:var(--vm-text)!important}
.vm-nav{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px 16px;max-width:1130px;margin:0 auto;padding:17px 16px;border-bottom:1px solid #6e542e;font:600 14px/1.5 Arial,sans-serif}
.vm-nav a{color:var(--vm-gold-soft)!important;text-decoration:none;padding:6px 2px}
.vm-nav a:hover,.vm-nav a:focus-visible{text-decoration:underline}
body a:not(.vm-nav a){color:var(--vm-gold-soft)}
body h1,body h2{color:var(--vm-gold)!important}
body .card,body .panel,body .info{border-color:#6d5534}
body footer a{color:var(--vm-gold-soft)!important}
body button:focus-visible,body a:focus-visible{outline:2px solid var(--vm-gold);outline-offset:3px}
@media(max-width:560px){.vm-nav{gap:3px 11px;font-size:12px}}

/* Schritt 538b: Navigation bleibt beim Scrollen sichtbar (alle oeffentlichen Seiten). */
.vm-nav{position:sticky;top:0;z-index:1000;background:rgba(16,15,24,.97);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);width:100%;box-sizing:border-box}

/* STEP 538C – filigrane Startseitenaktionen, gleiche Optik wie Creator-Login */
.vm-action-outline,
body a.vm-action-outline {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:min(100%, 560px) !important;
    max-width:560px !important;
    min-height:48px !important;
    padding:10px 20px !important;
    margin-inline:auto !important;
    background:transparent !important;
    background-image:none !important;
    color:var(--vm-gold-soft) !important;
    border:1px solid #8f6a38 !important;
    border-radius:9px !important;
    box-shadow:none !important;
    text-decoration:none !important;
    text-align:center !important;
    font-weight:700 !important;
    transition:border-color .15s, background-color .15s;
}
body a.vm-action-outline:hover,
body a.vm-action-outline:focus-visible {
    background:#2b211c !important;
    border-color:var(--vm-gold-soft) !important;
}
.vm-brand-mini {text-align:center;max-width:1120px;margin:0 auto;padding:14px 16px 2px}
.vm-brand-mini a{display:inline-block;line-height:0}
.vm-brand-mini img{display:block;width:clamp(116px,15vw,174px);height:auto;max-width:100%}
@media(max-width:560px){.vm-brand-mini{padding:10px 12px 0}.vm-brand-mini img{width:116px}}

/* Step 589 – groessere Navigation auf allen oeffentlichen Seiten. */
.vm-nav{font-size:16px;gap:7px 20px;max-width:1250px;padding:15px 17px}
.vm-nav a{min-height:38px;display:inline-flex;align-items:center}
@media(max-width:700px){.vm-nav{font-size:14px;gap:4px 13px;padding:10px 12px}.vm-nav a{min-height:34px}}

/* TikTok- und Twitch-LIVE-Status in der öffentlichen Navigation */
.vm-platform-live {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
}

.vm-live-indicator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 5px 12px;
    border-radius: 8px;
    border: 1px solid #64748b;
    background: #29303a;
    color: #e2e8f0;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.vm-live-indicator.vm-is-live {
    background: #14532d;
    border-color: #4ade80;
    color: #f0fdf4;
}

.vm-live-indicator.vm-is-offline {
    background: #292630;
    border-color: #665e69;
    color: #c4bdc7;
}

@media (max-width: 700px) {
    .vm-platform-live {
        width: 100%;
        gap: 8px;
        margin-top: 5px;
    }

    .vm-live-indicator {
        font-size: 13px;
        min-height: 32px;
        padding: 5px 10px;
    }
}

/* Separate LIVE-Statuszeile unter der Navigation */
.vm-nav {
    border-bottom: 0;
}

.vm-live-status-bar {
    position: sticky;
    top: 0;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 8px 16px;
    background: #17141b;
    border-bottom: 1px solid #6e542e;
    font-family: Arial, sans-serif;
}

.vm-live-status-label {
    color: #f7d99a;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.vm-live-status-bar .vm-live-indicator {
    min-height: 28px;
    padding: 4px 10px;
    font-size: 12px;
}

.vm-live-status-bar .vm-platform-live {
    width: auto;
    margin: 0;
}

@media (max-width: 700px) {
    .vm-live-status-bar {
        gap: 7px;
        padding: 7px 10px;
    }
}

/* LIVE-Status dauerhaft direkt unter der Navigation halten */
.vm-nav {
    position: sticky;
    top: 0;
    z-index: 1001;
}

.vm-live-status-bar {
    position: sticky;
    top: var(--vm-nav-height, 65px);
    z-index: 1000;
}