/* ==========================================
   HANIHO REDESIGN v2 — Surface Overrides
   Lädt NACH noble-core/overrides um Tokens
   und Components final ins neue System zu ziehen.
   ========================================== */

/* ----- Header Brand-Mark (Pin-SVG, alignt mit welcome.html) ----- */
.header-brand { gap: 10px; align-items: center; }
.header-brand-mark {
    width: 34px; height: 34px;
    border-radius: 10px;
    display: block;
    object-fit: contain;
    filter: drop-shadow(0 0 12px rgba(255,74,28,0.25));
}
.header-brand-text {
    font-family: 'Inter', system-ui, sans-serif;
    font-weight: 850;
    font-size: 22px;
    letter-spacing: -0.04em;
    color: var(--text-main);
    text-transform: lowercase;
}
/* Falls altes <img> noch irgendwo gerendert wird, ausblenden */
.header-logo-svg { display: none !important; }

/* ----- Tab-Bar (HEUTE/FEED/ENTDECKEN/COMMUNITY) ----- */
.center-tabs {
    border-bottom: 1px solid var(--border) !important;
    gap: 4px !important;
    padding: 8px 0 0 !important;
}
.center-tabs .tab-btn {
    position: relative;
    background: transparent !important;
    color: var(--text-secondary) !important;
    border: none !important;
    padding: 12px 16px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-radius: 0 !important;
    transition: color 0.15s;
}
.center-tabs .tab-btn:hover:not(.active) {
    color: var(--text-main) !important;
}
.center-tabs .tab-btn.active {
    color: var(--text-main) !important;
    background: transparent !important;
    font-weight: 750 !important;
}
.center-tabs .tab-btn.active::after {
    content: "";
    position: absolute;
    left: 12px; right: 12px; bottom: -1px;
    height: 2px; border-radius: 999px;
    background: linear-gradient(90deg, var(--haniho-primary), var(--haniho-primary-2));
}

/* ----- Cards mit Hover-Lift ----- */
.h-card,
.community-card,
.heute-preview-card,
.heute-reader,
.post-container,
.legal-container,
.contact-card,
section.sec {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
    transition: background 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
}
.community-card:hover,
.heute-preview-card:hover {
    background: var(--bg-surface-2) !important;
    transform: translateY(-1px);
    border-color: var(--border-strong) !important;
}

/* ----- Live-Dot mit Pulse ----- */
.live-dot, .puls-dot, [class*="live-pulse"] .pulse-dot {
    width: 10px; height: 10px;
    background: var(--live);
    border-radius: 50%;
    box-shadow: 0 0 0 7px rgba(255,47,47,0.18);
    animation: haniho-pulse 1.8s infinite;
    display: inline-block;
}
@keyframes haniho-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(255,47,47,0.28); }
    70%  { box-shadow: 0 0 0 10px rgba(255,47,47,0); }
    100% { box-shadow: 0 0 0 0 rgba(255,47,47,0); }
}

/* ----- Buttons ----- */
.hani-btn--primary,
.hani-btn--danger,
button.btn-primary,
.cta,
[class*="primary-cta"] {
    background: linear-gradient(135deg, var(--haniho-primary), var(--haniho-primary-2)) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
    box-shadow: 0 12px 35px rgba(255,45,122,0.20);
    transition: filter 0.15s, transform 0.1s;
}
.hani-btn--primary:hover,
.hani-btn--danger:hover,
button.btn-primary:hover,
.cta:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
}
.hani-btn--ghost,
button.btn-ghost,
.hani-btn--success {
    background: transparent !important;
    color: var(--text-main) !important;
    border: 1px solid var(--border) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
}
.hani-btn--ghost:hover,
.hani-btn--success:hover {
    border-color: var(--border-strong) !important;
    background: var(--bg-elevated) !important;
    filter: none !important;
    transform: none !important;
}

/* Icon-Buttons (💬 etc.) — neutral statt branded */
.hani-icon-btn {
    background: var(--bg-surface) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--border) !important;
    border-radius: 999px !important;
}
.hani-icon-btn:hover {
    background: var(--bg-elevated) !important;
    border-color: var(--border-strong) !important;
}
.hani-icon-btn--primary {
    background: linear-gradient(135deg, var(--haniho-primary), var(--haniho-primary-2)) !important;
    border: none !important;
    color: #fff !important;
}

/* Right-Panel Toggle (Info / Chat) */
.right-panel-toggle-btn {
    background: transparent !important;
    color: var(--text-secondary) !important;
    border: none !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-radius: var(--radius-sm) !important;
    position: relative;
    transition: color 0.15s;
}
.right-panel-toggle-btn:hover { color: var(--text-main) !important; }
.right-panel-toggle-btn.is-active {
    background: transparent !important;
    color: var(--text-main) !important;
    font-weight: 750 !important;
}
.right-panel-toggle-btn.is-active::after {
    content: "";
    position: absolute;
    left: 16px; right: 16px; bottom: -1px;
    height: 2px; border-radius: 999px;
    background: linear-gradient(90deg, var(--haniho-primary), var(--haniho-primary-2));
}

/* Sticky Heute-Actionbar — Backdrop angleichen */
.heute-sticky-actionbar {
    background: linear-gradient(180deg, rgba(5,6,10,0.96) 60%, rgba(5,6,10,0.7) 100%) !important;
    border-bottom: 1px solid var(--border) !important;
}

/* Heute-Preview-Card (im Heute-Tab → Was geht in Stadt) */
.heute-preview-card {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
    padding: 14px !important;
    transition: background 0.15s, transform 0.15s, border-color 0.15s !important;
}
.heute-preview-card:hover {
    background: var(--bg-surface-2) !important;
    transform: translateY(-1px);
    border-color: var(--border-strong) !important;
}
.heute-preview-tag {
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    margin-bottom: 6px !important;
}
.heute-preview-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--text-main) !important;
    line-height: 1.35 !important;
    margin-bottom: 4px !important;
}
.heute-preview-summary {
    font-size: 13px !important;
    color: var(--text-secondary) !important;
    line-height: 1.5 !important;
}

/* Heute Reader-Card (News-Detail) */
.heute-reader,
.heute-reader-overlay {
    background: var(--bg-surface) !important;
}

/* News-Items in Heute (.heute-card mit Bild) */
.heute-card {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
    transition: background 0.15s, transform 0.15s, border-color 0.15s !important;
}
.heute-card:hover {
    background: var(--bg-surface-2) !important;
    transform: translateY(-1px);
    border-color: var(--border-strong) !important;
}

/* ----- Sidebar-Nav-Items (Quick Access links) ----- */
#panel-left .quick-access-item,
#panel-left .sidebar-link,
#panel-left a[href] {
    border-radius: var(--radius-sm) !important;
    transition: background 0.15s, color 0.15s;
}
#panel-left .quick-access-item:hover,
#panel-left .sidebar-link:hover {
    background: rgba(255,255,255,0.05) !important;
    color: var(--text-main) !important;
}
#panel-left .quick-access-item.active,
#panel-left .sidebar-link.active {
    background: linear-gradient(90deg, rgba(255,74,28,0.18), rgba(255,74,28,0.04)) !important;
    color: var(--text-main) !important;
    border-left: 3px solid var(--haniho-primary);
    padding-left: calc(10px - 3px) !important;
}

/* ----- Right-Sidebar Panels ----- */
#panel-right section,
#panel-right .panel,
#PlaceLiveStatusCard,
#PlaceLivePulseCard,
#PlaceMeldungenCard,
#PlacePresenceCard {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: var(--shadow-card);
}

/* ----- Heute Hero (Live-Header-Card) ----- */
.home-hero,
.heute-live-hero,
[id="heute-hero"] {
    background:
        radial-gradient(circle at 50% 0%, rgba(255,47,47,0.20), transparent 45%),
        linear-gradient(180deg, rgba(255,74,28,0.06), rgba(255,255,255,0.02)),
        var(--bg-surface) !important;
    border: 1px solid rgba(255,74,28,0.20) !important;
    border-radius: var(--radius-lg) !important;
}

/* ----- Bottom-Nav Mobile (mockup-style) ----- */
#mobile-bottom-tabs,
.mobile-tab-bar,
.bottom-nav {
    background: rgba(5,6,10,0.92) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    border-top: 1px solid var(--border) !important;
}
.mobile-tab-btn {
    color: var(--text-secondary) !important;
    background: transparent !important;
    border: none !important;
    transition: color 0.15s !important;
}
.mobile-tab-btn .tab-icon svg {
    width: 22px; height: 22px;
}
.mobile-tab-btn .tab-label {
    font-size: 10.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
}
.mobile-tab-btn:hover { color: var(--text-main) !important; }
.mobile-tab-btn.active {
    color: var(--haniho-primary) !important;
}
.mobile-tab-btn.active::after {
    display: none !important; /* keine Underline-Stripe — Color reicht */
}

/* Drawer-Trigger (Burger oben links) */
#haniho-drawer-trigger {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-main) !important;
    border-radius: var(--radius-sm) !important;
}

/* ----- Post-Detail SSR (/post/:id) — auf neue Palette ziehen ----- */
.post-container {
    background: var(--bg-surface) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
}
.post-title { color: var(--text-main) !important; }
.post-meta { color: var(--text-muted) !important; }
.post-body { color: var(--text-secondary) !important; }
.reply-dock {
    background: var(--bg-surface) !important;
    border-top: 1px solid var(--border) !important;
}
.reply-dock input[type=text] {
    background: var(--bg-elevated) !important;
    border-color: var(--border) !important;
    color: var(--text-main) !important;
}
.reply-dock button {
    background: linear-gradient(135deg, var(--haniho-primary), var(--haniho-primary-2)) !important;
    color: #fff !important;
    border: none !important;
}

/* ----- Compose Modal (Neuer Post) ----- */
#community-compose-overlay,
.compose-modal {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-card) !important;
}
#community-compose-title-input,
#community-compose-content-input {
    background: var(--bg-elevated) !important;
    border-color: var(--border) !important;
    color: var(--text-main) !important;
}
#community-compose-submit {
    background: linear-gradient(135deg, var(--haniho-primary), var(--haniho-primary-2)) !important;
    color: #fff !important;
    border: none !important;
}

/* Stamps in Heute */
.stamp-card, .stamps-grid > * {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
    color: var(--text-main) !important;
}
.stamp-card:hover {
    background: var(--bg-surface-2) !important;
    transform: translateY(-1px);
}

/* ----- Reader-Overlay (News-Detail Vollbild) ----- */
.heute-reader-overlay {
    background: rgba(5, 6, 10, 0.85) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
.heute-reader {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-lg) !important;
    color: var(--text-main) !important;
}
.heute-reader-close {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border-strong) !important;
    color: var(--text-main) !important;
}
.heute-reader-close:hover {
    background: var(--bg-elevated) !important;
}
.heute-reader-headline { color: var(--text-main) !important; }
.heute-reader-lead, .heute-reader-content p { color: var(--text-secondary) !important; }
.heute-reader-meta, .heute-reader-attribution { color: var(--text-muted) !important; }
.heute-reader-btn--primary {
    background: linear-gradient(135deg, var(--haniho-primary), var(--haniho-primary-2)) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 999px !important;
}
.heute-reader-btn--ghost {
    background: transparent !important;
    color: var(--text-main) !important;
    border: 1px solid var(--border) !important;
    border-radius: 999px !important;
}
.heute-reader-btn--ghost:hover {
    background: var(--bg-elevated) !important;
}

/* ----- Settings-Modal + andere Overlays ----- */
.settings-modal,
#settings-modal,
.modal-content,
.report-modal {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-lg) !important;
    color: var(--text-main) !important;
    box-shadow: var(--shadow-card) !important;
}
.modal-overlay,
.modal-backdrop {
    background: rgba(5, 6, 10, 0.75) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* ----- Auth-Modal (Login/Register) ----- */
#me-tab-content,
.auth-form,
.login-form,
.register-form {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
    color: var(--text-main) !important;
}

/* ----- Onboarding-Overlay (Erstbesuch-Welcome) ----- */
#onboarding-overlay,
.onboarding-shell {
    background: var(--bg-main) !important;
    color: var(--text-main) !important;
}
#community-onboarding {
    background: linear-gradient(135deg, rgba(255,74,28,0.08), rgba(168,85,247,0.06)) !important;
    border: 1px solid rgba(255,74,28,0.25) !important;
    border-radius: var(--radius-md) !important;
}

/* ----- Heute Live-Pulse Block (alt, falls noch da) ----- */
.live-radar, .live-pulse-block {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-md) !important;
}

/* ----- Toast-Notifications ----- */
.haniho-toast,
#heute-toast,
.toast {
    background: var(--bg-elevated) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--border-strong) !important;
    border-radius: var(--radius-sm) !important;
    box-shadow: var(--shadow-card) !important;
}

/* ----- Generic-Buttons mit alten Farben (override) ----- */
button[style*="background:#3b82f6"],
button[style*="background: #3b82f6"] {
    background: var(--haniho-primary) !important;
    color: #fff !important;
}

/* "Alle Sektionen → / Alle Sehenswürdigkeiten → / Mitreden →" — Section-Action-Pills statt loser Text */
a[style*="color:#60a5fa"] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 5px 11px !important;
    border-radius: 999px !important;
    background: rgba(255,74,28,0.10) !important;
    border: 1px solid rgba(255,74,28,0.32) !important;
    color: var(--haniho-primary) !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    transition: background .15s ease, border-color .15s ease, transform .08s ease;
    -webkit-tap-highlight-color: transparent;
}
a[style*="color:#60a5fa"]:hover {
    background: rgba(255,74,28,0.18) !important;
    border-color: rgba(255,74,28,0.55) !important;
    transform: translateY(-1px);
}
/* Inline-Pills in Community-Cards (Author-Badge) bleiben kleiner */
.community-card a[style*="color:#60a5fa"],
[id^="haniho-sticky"] a[style*="color:#60a5fa"] {
    padding: 4px 10px !important;
    font-size: 11.5px !important;
}

/* ----- Hide alte Place-Image-Wappen (Stadt-Wappen-Hero in Heute) ----- */
.home-hero img.home-hero-img,
.home-hero {
    border-radius: var(--radius-lg) !important;
    overflow: hidden;
}

/* ----- Sidebar-Background dünner Verlauf wie Mockup ----- */
#panel-left {
    background: linear-gradient(180deg, rgba(15,16,22,0.96), rgba(5,6,10,0.96)) !important;
    border-right: 1px solid var(--border) !important;
}
#panel-right {
    background: linear-gradient(180deg, rgba(10,11,16,0.96), rgba(5,6,10,0.96)) !important;
    border-left: 1px solid var(--border) !important;
}

/* ----- Weltenbaum-Sidebar-Items als Nav-Items (Mockup-Look) ----- */
#weltenbaum-v3 {
    background: transparent !important;
    border-bottom: none !important;
}
.weltenbaum-header,
.my-rooms-section,
.community-section,
.weltenbaum-section {
    background: transparent !important;
    border-bottom: 1px solid var(--border) !important;
    padding: 14px 12px !important;
}
.section-label {
    color: var(--text-muted) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    padding: 0 10px 10px !important;
}
.room-item, .place-item, .community-item {
    border-radius: var(--radius-sm) !important;
    border: none !important;
    padding: 8px 10px !important;
    margin: 2px 0 !important;
    color: var(--text-secondary) !important;
    transition: background 0.15s, color 0.15s, border-color 0.15s !important;
}
.room-item:hover, .place-item:hover, .community-item:hover {
    background: rgba(255,255,255,0.05) !important;
    border: none !important;
    color: var(--text-main) !important;
}
.room-item.active, .place-item.active, .community-item.active {
    background: linear-gradient(90deg, rgba(255,74,28,0.18), rgba(255,74,28,0.04)) !important;
    border: none !important;
    border-left: 3px solid var(--haniho-primary) !important;
    box-shadow: none !important;
    color: var(--text-main) !important;
    padding-left: 7px !important;
}
.room-name, .place-name, .community-name {
    color: var(--text-secondary) !important;
    font-weight: 500 !important;
    font-size: 13.5px !important;
}
.room-item.active .room-name,
.room-item:hover .room-name,
.place-item.active .place-name {
    color: var(--text-main) !important;
    font-weight: 700 !important;
}

/* Counter-Badge (Stuttgart Talk · 12) */
.room-meta, .room-count, .community-count, .room-status-inline {
    background: rgba(255,255,255,0.09) !important;
    color: var(--text-secondary) !important;
    border-radius: 999px !important;
    padding: 2px 8px !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    min-width: 22px !important;
    text-align: center !important;
}
.room-item.active .room-meta {
    background: rgba(255,255,255,0.18) !important;
    color: var(--text-main) !important;
}

/* Smart-Input (Sidebar-Suche) wie im Mockup */
.search-container {
    padding: 14px 12px !important;
    border-bottom: 1px solid var(--border) !important;
}
#smart-input {
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-sm) !important;
    color: var(--text-main) !important;
    padding: 9px 14px !important;
    font-size: 13px !important;
    width: 100% !important;
}
#smart-input::placeholder { color: var(--text-muted) !important; }
#smart-input:focus { border-color: var(--haniho-primary) !important; }

/* ----- Inputs / Suchfeld ----- */
input, textarea, select {
    background: var(--bg-surface) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-sm) !important;
}
input:focus, textarea:focus, select:focus {
    border-color: var(--haniho-primary) !important;
    outline: none !important;
}

/* ----- Top-Banner Post-Avatar mit Gradient ----- */
.community-card article > div:first-child > span:first-child,
.post-avatar,
.author-avatar {
    background: linear-gradient(135deg, var(--haniho-primary), var(--haniho-primary-2)) !important;
}

/* ----- Footer ----- Sidebar-Footer komplett raus, Inhalt liegt jetzt im Header-„Mehr"-Dropdown */
.sidebar-legal { display: none !important; }

/* ====================================================================
   Brand-Glow IN den Panels (statt Body) — Body bleibt schwarz
   ==================================================================== */
body { background: var(--bg-main, #05060a) !important; }
body::before { content: none !important; }

/* Panels bekommen Lila/Orange-Glow als Hintergrund */
#panel-left {
    background:
        radial-gradient(420px circle at 50% 0%, rgba(168,85,247,0.18), transparent 55%),
        radial-gradient(360px circle at 0% 90%, rgba(255,74,28,0.14), transparent 60%),
        var(--bg-surface, #111217) !important;
}
#panel-center {
    background:
        radial-gradient(900px circle at 30% -5%, rgba(255,74,28,0.16), transparent 50%),
        radial-gradient(700px circle at 80% 60%, rgba(168,85,247,0.14), transparent 55%),
        var(--bg-main, #05060a) !important;
}
#panel-right {
    background:
        radial-gradient(420px circle at 50% 0%, rgba(255,74,28,0.18), transparent 55%),
        radial-gradient(360px circle at 100% 90%, rgba(168,85,247,0.14), transparent 60%),
        var(--bg-surface, #111217) !important;
}
header {
    background:
        linear-gradient(180deg, rgba(255,74,28,0.10), transparent 100%),
        var(--bg-main, #05060a) !important;
}
.app-container { position: relative; z-index: 1; }

/* === EVENTS HEUTE Panel komplett entfernt (User-Wunsch) === */
#HaniEventsPanel { display: none !important; }

/* === Floating-+ Buttons hart verstecken (überschreibt noble-overrides :not(.hidden)) === */
html body #web-create-fab,
html body #mobile-create-fab,
html body #web-create-fab:not(.hidden),
html body #mobile-create-fab:not(.hidden),
html body .web-create-fab,
html body .create-fab,
html body .mobile-create-fab,
html body button[id*="create-fab"],
html body button[class*="create-fab"] { display: none !important; }

/* Desktop (>980px): kein Mobile-Tab-Bar, kein Drawer-Trigger */
@media (min-width: 981px) {
    #mobile-bottom-tabs { display: none !important; }
    #haniho-drawer-trigger { display: none !important; }
}

/* Mobile (<=980px): Quick-Nav + Filter-Bar weg (Nav läuft über Drawer + Bottom-Tabs) */
@media (max-width: 980px) {
    #hani-quick-nav,
    #hani-center-filter-bar,
    #hani-place-chip { display: none !important; }
    /* Right-Rail komplett raus auf Mobile (außer Chat-Center-Modus, dann übernimmt
       noble-overrides.css und macht panel-right sichtbar als Fullscreen-Chat-Modal). */
    body:not(.mobile-chat-center) #panel-right { display: none !important; }
    /* Bottom-Tabs sichtbar erzwingen */
    #mobile-bottom-tabs.mobile-only { display: flex !important; }
    /* Place-Pill Inhalte aus Stadt: kürzer + nicht wrap */
    [data-place-scope-pill],
    .place-scope-pill {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: calc(100vw - 40px) !important;
    }
}

/* === Live-Header im Right-Rail: kompakter Look (statt Center-XL) === */
#panel-right .hani-live-header {
    padding: 14px 14px 16px;
    border-radius: 14px;
    margin-bottom: 14px;
}
#panel-right .hani-live-header-top {
    margin-bottom: 12px;
    flex-wrap: wrap;
    gap: 8px;
}
#panel-right .hani-live-header-title { font-size: 12.5px; }
#panel-right .hani-create-btn {
    font-size: 11.5px;
    padding: 6px 10px;
}
#panel-right .hani-live-stats {
    gap: 5px;
    grid-template-columns: repeat(2, 1fr) !important;
}
#panel-right .hani-live-stat {
    padding: 9px 4px;
}
#panel-right .hani-live-stat strong { font-size: 18px; }
#panel-right .hani-live-stat span { font-size: 10px; letter-spacing: 0.02em; }

/* === Right-Rail bleibt bei Community-Tab sichtbar (Override aus noble-overrides) === */
body.tab-community-active #panel-right { display: flex !important; }
body.tab-community-active .app-container { --right-w: 460px; }
body.tab-community-active .community-web-wrap { max-width: none !important; }

/* === GetYourGuide komplett ausblenden (überall) === */
.heute-gyg-widget,
.heute-gyg-toggle,
.heute-gyg-city,
[data-gyg-href],
[data-gyg-target],
[data-gyg-tour],
[data-gyg-widget],
[data-gyg-partner-id],
.gyg-frame,
.gyg-widget,
[class^="gyg-"],
[class*=" gyg-"],
[id^="gyg-"] { display: none !important; }
/* Section-Wrapper "Touren & Tickets" / "Sehenswürdigkeiten" — wenn nur GYG drin */
.heute-touren-block,
.heute-tickets-block,
.gyg-card-wrap { display: none !important; }
/* Heute-Card-Footer-Items mit GYG-Hint + go/getyourguide Tracking-Links */
.heute-card a[href*="getyourguide"],
a[href*="getyourguide"],
a[href*="/go/getyourguide"] { display: none !important; }

/* ====================================================================
   Header „Mehr ▾" Dropdown — Legal-Links + Über uns
   ==================================================================== */
.hani-more-menu {
    position: relative;
    display: inline-block;
}
#hani-more-toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: transparent;
    border: none;
    color: var(--text-secondary, #b5b5bd);
    font-size: 13.5px;
    font-weight: 500;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 8px;
    font-family: inherit;
}
#hani-more-toggle:hover { color: var(--text-main, #f5f5f7); background: rgba(255,255,255,0.04); }
#hani-more-toggle .caret { font-size: 9px; opacity: 0.7; }
#hani-more-toggle[aria-expanded="true"] { color: var(--text-main, #f5f5f7); background: rgba(255,255,255,0.04); }

#hani-more-dropdown {
    position: fixed;
    top: 56px;
    right: 18px;
    min-width: 240px;
    background: var(--bg-elev, #1a1c24);
    border: 1px solid var(--border-strong, rgba(255,255,255,0.14));
    border-radius: 12px;
    padding: 6px;
    box-shadow: 0 24px 60px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.04);
    z-index: 100000;
}
#hani-more-dropdown[hidden] { display: none; }
#hani-more-dropdown a {
    display: block;
    padding: 9px 12px;
    border-radius: 8px;
    color: var(--text-secondary, #b5b5bd);
    text-decoration: none;
    font-size: 13.5px;
    font-weight: 500;
    transition: background .12s, color .12s;
}
#hani-more-dropdown a:hover {
    background: rgba(255,74,28,0.10);
    color: var(--text-main, #f5f5f7);
}
.hani-more-divider {
    height: 1px;
    background: var(--border, rgba(255,255,255,0.07));
    margin: 6px 4px;
}
.hani-more-foot {
    padding: 8px 12px 4px;
    color: var(--text-muted, #777884);
    font-size: 11.5px;
    line-height: 1.5;
}

/* ====================================================================
   PHASE 1 — Quick-Nav (Live City Layout)
   Sidebar-Navigation oberhalb des Weltenbaums; schaltet intern Tabs/Filter.
   ==================================================================== */
#hani-quick-nav {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin: 8px 0 14px;
    padding: 6px 0;
    border-bottom: 1px solid var(--border);
}
#hani-quick-nav .quick-nav-item,
#hani-quick-nav-mobile .quick-nav-item {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 10px;
    border-radius: 9px;
    color: var(--text-secondary);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    position: relative;
    transition: background .15s ease, color .15s ease;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
#hani-quick-nav .quick-nav-item:hover,
#hani-quick-nav-mobile .quick-nav-item:hover {
    background: rgba(255,255,255,0.04);
    color: var(--text-main);
}
#hani-quick-nav .quick-nav-item.active,
#hani-quick-nav-mobile .quick-nav-item.active {
    background: linear-gradient(90deg, rgba(255,74,28,0.18), rgba(255,74,28,0.04));
    color: var(--text-main);
    font-weight: 600;
}
#hani-quick-nav .quick-nav-item.active::before,
#hani-quick-nav-mobile .quick-nav-item.active::before {
    content: '';
    position: absolute;
    left: -3px;
    top: 7px;
    bottom: 7px;
    width: 3px;
    background: var(--haniho-primary);
    border-radius: 0 3px 3px 0;
}
#hani-quick-nav .quick-nav-item.active .quick-nav-icon,
#hani-quick-nav-mobile .quick-nav-item.active .quick-nav-icon {
    color: var(--haniho-primary);
}
#hani-quick-nav .quick-nav-icon,
#hani-quick-nav-mobile .quick-nav-icon {
    width: 18px; height: 18px;
    flex-shrink: 0;
    display: grid; place-items: center;
}
#hani-quick-nav .quick-nav-icon svg,
#hani-quick-nav-mobile .quick-nav-icon svg {
    width: 18px; height: 18px;
}
#hani-quick-nav .quick-nav-label,
#hani-quick-nav-mobile .quick-nav-label {
    flex: 1;
    line-height: 1.25;
}
#hani-quick-nav .quick-nav-badge,
#hani-quick-nav-mobile .quick-nav-badge {
    background: rgba(255,255,255,0.08);
    color: var(--text-secondary);
    font-size: 11px;
    font-weight: 700;
    padding: 1px 7px;
    border-radius: 10px;
    min-width: 22px;
    text-align: center;
    display: none;
}
#hani-quick-nav .quick-nav-badge:not(:empty),
#hani-quick-nav-mobile .quick-nav-badge:not(:empty) { display: inline-block; }
/* Live-Item: Badge in Live-Rot */
#hani-quick-nav .quick-nav-item[data-quick-nav="live"] .quick-nav-icon,
#hani-quick-nav-mobile .quick-nav-item[data-quick-nav="live"] .quick-nav-icon { color: var(--live); }
#hani-quick-nav .quick-nav-item[data-quick-nav="live"] .quick-nav-badge:not(:empty),
#hani-quick-nav-mobile .quick-nav-item[data-quick-nav="live"] .quick-nav-badge:not(:empty) {
    background: rgba(255,47,47,0.18);
    color: var(--live);
}

/* ====================================================================
   PHASE 2 — Center: permanente Live-Header + Filter-Bar
   Alte 4-Tab-Bar wird ausgeblendet, Tab-System läuft im Hintergrund.
   ==================================================================== */

/* Alte Center-Tabs (HEUTE/FEED/ENTDECKEN/COMMUNITY) — visuell weg, funktional aktiv */
#panel-center .center-tabs { display: none !important; }

/* === Live-Header === */
.hani-live-header {
    position: relative;
    margin: 0 0 14px;
    padding: 18px 20px;
    flex: 0 0 auto;
    min-height: fit-content;
    border-radius: 16px;
    background:
        radial-gradient(circle at 50% 0%, rgba(255,47,47,0.18), transparent 50%),
        linear-gradient(180deg, rgba(255,74,28,0.06), rgba(255,255,255,0.02)),
        var(--bg-surface);
    border: 1px solid rgba(255,74,28,0.28);
    box-shadow: 0 18px 50px rgba(0,0,0,0.32), 0 0 28px rgba(255,74,28,0.16);
    overflow: hidden;
}
.hani-live-header[hidden] { display: none !important; }
.hani-live-header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
}
.hani-live-header-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-main);
    line-height: 1.1;
}
.hani-live-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: var(--live, #ff2f2f);
    color: #fff;
    font-size: 10.5px;
    font-weight: 800;
    padding: 3px 9px;
    border-radius: 999px;
    letter-spacing: 0.06em;
}
.hani-live-dot {
    width: 6px; height: 6px;
    background: #fff;
    border-radius: 50%;
    animation: hani-live-pulse 1.6s infinite;
}
@keyframes hani-live-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(1.4); }
}
.hani-create-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(135deg, var(--haniho-primary), var(--haniho-primary-2));
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    padding: 8px 14px;
    border-radius: 999px;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(255,74,28,0.32);
    transition: transform .15s, box-shadow .15s;
    font-family: inherit;
    white-space: nowrap;
}
.hani-create-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(255,74,28,0.40);
}
.hani-live-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
.hani-live-stat {
    background: rgba(0,0,0,0.25);
    border: 1px solid rgba(255,255,255,0.05);
    border-radius: 12px;
    padding: 14px 8px;
    text-align: center;
    transition: transform .15s, border-color .15s, background .15s;
    cursor: pointer;
    font-family: inherit;
    color: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.hani-live-stat:hover {
    transform: translateY(-2px);
    border-color: rgba(255,74,28,0.40);
    background: rgba(255,74,28,0.05);
}
.hani-live-stat strong {
    font-size: 26px;
    font-weight: 900;
    color: var(--haniho-primary);
    line-height: 1;
    font-feature-settings: "tnum";
}
.hani-live-stat span {
    font-size: 11.5px;
    color: var(--text-secondary);
    font-weight: 500;
}

/* === Filter-Bar (sticky am Top, bleibt immer sichtbar) === */
.hani-filter-bar {
    display: flex;
    gap: 4px;
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 4px;
    margin: 0 0 12px;
    overflow-x: auto;
    scrollbar-width: none;
    flex: 0 0 auto;
    min-height: fit-content;
    position: sticky;
    top: 8px;
    z-index: 50;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background: rgba(17, 18, 23, 0.92);
}
.hani-filter-bar::-webkit-scrollbar { display: none; }
.hani-filter-btn {
    background: transparent;
    border: none;
    color: var(--text-secondary);
    font-size: 13px;
    font-weight: 600;
    padding: 9px 16px;
    border-radius: 9px;
    cursor: pointer;
    transition: background .15s, color .15s;
    white-space: nowrap;
    font-family: inherit;
}
.hani-filter-btn:hover { color: var(--text-main); }
.hani-filter-btn.active {
    background: rgba(255,74,28,0.16);
    color: var(--haniho-primary);
}

/* Mobile: Live-Header + Filter-Bar enger */
@media (max-width: 640px) {
    .hani-live-header { padding: 14px 14px 16px; border-radius: 14px; margin-bottom: 10px; }
    .hani-live-header-title { font-size: 13px; }
    .hani-live-stats { gap: 6px; }
    .hani-live-stat { padding: 10px 4px; }
    .hani-live-stat strong { font-size: 20px; }
    .hani-filter-bar { border-radius: 10px; }
    .hani-filter-btn { padding: 8px 12px; font-size: 12.5px; }
}

/* ====================================================================
   PHASE 3 — Right Rail Stack (TRENDING + EVENTS HEUTE + LIVE CHAT)
   Toggle-Logik wird überlagert, alle Panels gleichzeitig sichtbar.
   ==================================================================== */
#panel-right[data-right-panel-mode="stack"] .right-panel-tabs,
#panel-right .right-panel-tabs[hidden] {
    display: none !important;
}
/* Beide Panels (Context + Chat) gleichzeitig sichtbar */
#panel-right[data-right-panel-mode="stack"] #rightPanelContext,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat {
    display: flex !important;
    flex-direction: column;
}
#panel-right[data-right-panel-mode="stack"] #rightPanelChat {
    margin-top: 14px;
    background: var(--bg-surface, #111217);
    border: 1px solid var(--border, rgba(255,255,255,0.07));
    border-radius: 14px;
    overflow: hidden;
    max-height: 360px;
}
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-header {
    padding: 12px 14px 8px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--text-secondary) !important;
    border-bottom: none !important;
}
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-header::before {
    content: '●';
    color: var(--event, #22c55e);
    margin-right: 6px;
    font-size: 12px;
}
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-title {
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.1em !important;
}
#panel-right[data-right-panel-mode="stack"] #rightPanelChat #chatMessages {
    flex: 1;
    overflow-y: auto;
    padding: 4px 14px 8px !important;
    max-height: 240px;
}
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-input-container {
    border-top: 1px solid var(--border, rgba(255,255,255,0.07)) !important;
    padding: 10px 12px !important;
}

/* === Rail Panel (TRENDING / EVENTS HEUTE) === */
.hani-rail-panel {
    background: var(--bg-surface, #111217);
    border: 1px solid var(--border, rgba(255,255,255,0.07));
    border-radius: 14px;
    margin-bottom: 14px;
    overflow: visible;
    display: block;
    height: auto;
    min-height: fit-content;
    flex: 0 0 auto;
}
/* Container darf nicht squeezen */
.sidebar-scroll-area {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
}
#rightPanelContext .sidebar-scroll-area > section { flex: 0 0 auto; }
.hani-rail-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px 8px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-secondary, #b5b5bd);
}
.hani-rail-head .icon { font-size: 14px; color: var(--haniho-primary, #ff4a1c); }
.hani-rail-list { padding: 0 8px 6px; }
.hani-rail-empty {
    padding: 14px 10px;
    color: var(--text-muted, #777884);
    font-size: 12.5px;
    text-align: center;
}
.hani-rail-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 9px;
    cursor: pointer;
    transition: background .15s;
    color: inherit;
    text-decoration: none;
}
.hani-rail-item:hover { background: rgba(255,255,255,0.04); }
.hani-rail-item-icon {
    width: 30px; height: 30px;
    border-radius: 8px;
    display: grid; place-items: center;
    font-size: 14px;
    flex-shrink: 0;
    background: rgba(255,74,28,0.15);
    color: var(--haniho-primary, #ff4a1c);
}
.hani-rail-item-icon.signal { background: rgba(255,47,47,0.15); color: var(--live, #ff2f2f); }
.hani-rail-item-icon.event { background: rgba(34,197,94,0.15); color: var(--event, #22c55e); }
.hani-rail-item-icon.news { background: rgba(43,123,255,0.15); color: var(--news, #2b7bff); }
.hani-rail-item-icon.discussion { background: rgba(168,85,247,0.18); color: var(--discussion, #a855f7); }
.hani-rail-item-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.hani-rail-item-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-main, #f5f5f7);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hani-rail-item-meta {
    font-size: 11px;
    color: var(--text-muted, #777884);
}
.hani-rail-foot { padding: 4px 10px 12px; }
.hani-rail-foot-btn {
    width: 100%;
    background: rgba(255,74,28,0.10);
    border: 1px solid rgba(255,74,28,0.30);
    color: var(--haniho-primary, #ff4a1c);
    font-size: 12px;
    font-weight: 700;
    padding: 8px;
    border-radius: 9px;
    cursor: pointer;
    transition: background .15s;
    font-family: inherit;
}
.hani-rail-foot-btn:hover {
    background: rgba(255,74,28,0.20);
}

/* ====================================================================
   PHASE 4 — Filter-Bar real filtering: cards ohne passende data-haniho-cat
   werden ausgeblendet, wenn Filter ≠ 'all'
   ==================================================================== */
body[data-content-filter="signal"] [data-haniho-cat]:not([data-haniho-cat="signal"]) { display: none !important; }
body[data-content-filter="event"] [data-haniho-cat]:not([data-haniho-cat="event"]) { display: none !important; }
body[data-content-filter="news"] [data-haniho-cat]:not([data-haniho-cat="news"]) { display: none !important; }
body[data-content-filter="discussion"] [data-haniho-cat]:not([data-haniho-cat="discussion"]) { display: none !important; }

/* === Phase 4 cleanup: Header-Icon-Tabs verstecken (durch Quick-Nav ersetzt) === */
.header-nav-icons.desktop-only { display: none !important; }

/* === Phase 4 cleanup: Weltenbaum-Container Overlap fixen === */
#panel-left { position: relative; }
#hani-quick-nav {
    position: relative;
    z-index: 2;
    background: var(--bg-surface, #111217);
}
#hani-quick-nav + #weltenbaum-v3-container {
    margin-top: 8px;
    padding-top: 8px;
    position: relative;
    z-index: 1;
}
/* Übersicht-Block aus Weltenbaum: nur die "World"-Räume zeigen, Stadt-Sections via Quick-Nav */
#weltenbaum-v3-container .wb-section[data-wb-section="city-tree"] { display: none; }
/* Quick-Access-Block kollidiert oft mit Quick-Nav — kompakt halten */
#weltenbaum-v3-container .quick-access-block,
#weltenbaum-v3-container [data-quick-access] {
    margin-top: 8px;
    border-top: 1px solid var(--border, rgba(255,255,255,0.07));
    padding-top: 10px;
}

/* === Phase 4: Stuttgart-Geo-Selector im Header-Brand klickbar machen === */
.header-brand-text { cursor: default; }
#hani-place-chip {
    align-items: center;
    gap: 4px;
    margin-left: 10px;
    padding: 3px 10px 3px 8px;
    border-radius: 999px;
    background: rgba(255,74,28,0.10);
    border: 1px solid rgba(255,74,28,0.32);
    color: var(--text-main);
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s, border-color .15s;
    -webkit-tap-highlight-color: transparent;
}
#hani-place-chip { display: none !important; } /* Doppelung mit rechtem Geo-Selector — entfernt */
#hani-place-chip:hover {
    background: rgba(255,74,28,0.20);
    border-color: rgba(255,74,28,0.55);
}
#hani-place-chip::before {
    content: '📍';
    font-size: 11px;
}
#hani-place-chip::after {
    content: '▾';
    font-size: 9px;
    opacity: 0.7;
    margin-left: 2px;
}
@media (max-width: 640px) {
    #hani-place-chip { display: none; }
}

/* === Phase 4: Mobile Drawer — Quick-Nav-Clone Styles === */
#haniho-drawer #hani-quick-nav-mobile {
    padding: calc(env(safe-area-inset-top,0px) + 14px) 14px 12px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    background: transparent;
}
#haniho-drawer #hani-quick-nav-mobile .quick-nav-item { font-size: 15px; padding: 11px 12px; }
#haniho-drawer #hani-quick-nav-mobile .quick-nav-item.active::before { left: 0; }

/* === Phase 4: Duplikate ausblenden (jetzt durch permanente Header-Card abgedeckt) === */
/* Alter Live-Header im HEUTE-Tab — wird durch #hani-center-live-header oben ersetzt */
#tab-heute #heute-live-header,
#heute-live-header,
.heute-live-header { display: none !important; }
/* Sticky-Actionbar im HEUTE-Tab: Signal/Stamp/Chat — dupliziert "+ Erstellen" */
.heute-sticky-actionbar { display: none !important; }
/* Heute-Header-Buttons "Signal senden / Jetzt hier" — duplizieren "+ Erstellen" */
#tab-heute .heute-action-row,
.heute-action-row { display: none !important; }

/* === Right-Rail aufräumen — nur Mockup-Panels (TRENDING / EVENTS / CHAT) zeigen === */
#PlaceLiveStatusCard,
#PlaceLivePulseCard,
#PlaceMeldungenCard,
#PlacePresenceCard,
#PlaceHeader { display: none !important; }

/* === Phase 5: Chat ist jetzt im Center, im Right-Rail nur LETZTE CHATS === */
/* Aktives Chat-Panel im Right-Rail komplett verstecken solange es dort sitzt */
#panel-right[data-right-panel-mode="stack"] > #rightPanelChat { display: none !important; }
/* Aber wenn ins Center verschoben (.hani-chat-in-center), dann im Center sichtbar */
body.hani-chat-in-center #tab-chat #rightPanelChat {
    display: flex !important;
    flex-direction: column !important;
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: 14px !important;
    margin: 0 !important;
    max-height: none !important;
    height: calc(100vh - 280px) !important;
    min-height: 480px !important;
}
body.hani-chat-in-center #tab-chat #rightPanelChat #chatMessages {
    flex: 1 !important;
    max-height: none !important;
    overflow-y: auto !important;
    padding: 14px !important;
}
body.hani-chat-in-center #tab-chat .right-chat-inline-note { display: none !important; }
/* Wenn Chat-Filter aktiv: Live-Header und Filter-Bar bleiben sichtbar, andere Tabs ausblenden */
body.hani-chat-in-center #tab-threads,
body.hani-chat-in-center #tab-stream,
body.hani-chat-in-center #tab-heute,
body.hani-chat-in-center #tab-community { display: none !important; }
body.hani-chat-in-center #tab-chat { display: block !important; }

/* === Right-Rail Chat im Mockup-Look (minimal: Header / Messages / Input) === */
#panel-right[data-right-panel-mode="stack"] #rightPanelChat #current-channel-display,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-header > button#chat-back-btn,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat #chat-view-switch,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-view-btn,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-tabs,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-tab-btn,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-empty-state,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-empty-cta,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-empty-card,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat #chat-empty-cta,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .lobby-promo,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat #chat-lobby-join,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat [data-lobby-promo],
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-cta-btn,
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-lobby-cta { display: none !important; }
#panel-right[data-right-panel-mode="stack"] #rightPanelChat .chat-title {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}

/* === Left-Sidebar: alte QuickAccess-Blöcke komplett verstecken (Mockup hat keine) === */
#weltenbaum-v3-container .my-rooms-section { display: none !important; }
/* hierarchy-section (ÜBERSICHT mit #haniho/World) — kompakt, am Ende der Sidebar */
#weltenbaum-v3-container .hierarchy-section {
    margin-top: 14px;
    padding: 12px 6px 16px;
    border-top: 1px solid var(--border) !important;
    background: rgba(0,0,0,0.18);
    border-radius: 10px;
}
#weltenbaum-v3-container { padding: 0 6px; }
#weltenbaum-v3-container .hierarchy-section .section-label,
#weltenbaum-v3-container .hierarchy-section .section-label-row {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: var(--text-muted) !important;
    padding: 10px 10px 8px !important;
}
#weltenbaum-v3-container .room-item {
    padding: 9px 10px !important;
    border-radius: 9px !important;
    border: 1px solid transparent !important;
    margin: 1px 0 !important;
}
#weltenbaum-v3-container .room-item:hover {
    background: rgba(255,255,255,0.04) !important;
}
#weltenbaum-v3-container .room-item.active {
    background: linear-gradient(90deg, rgba(255,74,28,0.18), rgba(255,74,28,0.04)) !important;
    border-color: transparent !important;
}