/* PIANO BLACK & NEON RED - GLOBAL OVERRIDE */
:root {
    --p-black: #050505;
    --p-surface: #0a0a0a;
    --p-border: rgba(255, 255, 255, 0.05);
    --neon-red: #ff0000;
    --neon-glow: 0 0 15px rgba(255, 0, 0, 0.4);
}

html, body { 
    background: var(--p-black) !important; 
    color: #fff !important;
    overflow-x: hidden !important;
}

/* TOPBAR */
header.topbar-wide {
    background: rgba(5, 5, 5, 0.95) !important;
    border-bottom: 1px solid rgba(255, 0, 0, 0.3) !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.8) !important;
}

.logo-mark {
    background: var(--neon-red) !important;
    box-shadow: var(--neon-glow) !important;
}

/* CARDS */
.mcard, .upcard, .account-block, .plug-card, .filter-card, .workspace-card, .card {
    background: linear-gradient(145deg, #121212, #080808) !important;
    border: 1px solid var(--p-border) !important;
    border-radius: 24px !important;
    box-shadow: 10px 10px 30px rgba(0,0,0,0.5) !important;
    transition: all 0.3s ease !important;
}

.mcard:hover, .upcard:hover {
    border-color: var(--neon-red) !important;
    box-shadow: var(--neon-glow) !important;
    transform: translateY(-5px) !important;
}

/* ICONS */
.mico {
    background: #000 !important;
    border: 2px solid rgba(255, 0, 0, 0.2) !important;
    border-radius: 15px !important;
    color: #fff !important;
    box-shadow: inset 0 0 10px rgba(255, 0, 0, 0.1) !important;
}

.mcard:hover .mico {
    border-color: var(--neon-red) !important;
    color: var(--neon-red) !important;
    box-shadow: var(--neon-glow) !important;
}

/* UPDATES FEED */
.feed-item {
    background: rgba(255,255,255,0.02) !important;
    border: 1px solid var(--p-border) !important;
    border-radius: 15px !important;
    padding: 15px !important;
    margin-bottom: 10px !important;
}

.feed-item:hover {
    border-color: var(--neon-red) !important;
    background: rgba(255, 0, 0, 0.05) !important;
}

.uptitle { color: var(--neon-red) !important; font-weight: 900 !important; }
.upbadge { background: var(--neon-red) !important; box-shadow: var(--neon-glow) !important; }

/* BUTTONS */
.chip, .btn-primary, .save-btn, .btn.primary {
    background: var(--neon-red) !important;
    color: #fff !important;
    border-radius: 12px !important;
    box-shadow: 0 5px 15px rgba(255, 0, 0, 0.3) !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    border: none !important;
}

.chip:hover, .btn-primary:hover, .btn.primary:hover {
    box-shadow: var(--neon-glow) !important;
    transform: scale(1.05) !important;
}

/* SCROLLBAR */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #050505; }
::-webkit-scrollbar-thumb { background: var(--neon-red); border-radius: 10px; }
