/* ═══ BACKGROUND LAYERS ═══ */
.bg-layer {
    position: fixed;
    inset: 0;
    z-index: 0;
    opacity: 0;
    transition: opacity 1s ease;
    pointer-events: none;
}
.bg-layer.active {
    opacity: 1;
}
.bg-layer canvas {
    width: 100%;
    height: 100%;
}
#scAuroraC {
    filter: blur(5px);
}

/* Morphing Blobs */
.bg-blobs-inner {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background: #0a0a0f;
}
.mblob {
    position: absolute;
    border-radius: 50%;
    will-change: transform;
}
.mblob:nth-child(1) {
    width: 40vmax; height: 40vmax;
    top: -15%; left: -10%;
    background: radial-gradient(circle at 40% 40%, rgba(139,92,246,0.7), rgba(109,40,217,0.4) 40%, transparent 70%);
    filter: blur(40px);
    animation: mb1 14s ease-in-out infinite;
}
.mblob:nth-child(2) {
    width: 35vmax; height: 35vmax;
    bottom: -10%; right: -15%;
    background: radial-gradient(circle at 60% 60%, rgba(232,121,249,0.65), rgba(192,132,252,0.35) 40%, transparent 70%);
    filter: blur(40px);
    animation: mb2 18s ease-in-out infinite;
}
.mblob:nth-child(3) {
    width: 30vmax; height: 30vmax;
    top: 40%; left: 25%;
    background: radial-gradient(circle at 50% 50%, rgba(56,189,248,0.5), rgba(34,211,238,0.3) 40%, transparent 70%);
    filter: blur(35px);
    animation: mb3 16s ease-in-out infinite;
}
.mblob:nth-child(4) {
    width: 28vmax; height: 28vmax;
    top: 10%; right: 20%;
    background: radial-gradient(circle at 50% 50%, rgba(167,139,250,0.55), rgba(139,92,246,0.3) 45%, transparent 70%);
    filter: blur(35px);
    animation: mb4 20s ease-in-out infinite;
}
.mblob:nth-child(5) {
    width: 22vmax; height: 22vmax;
    bottom: 15%; left: 10%;
    background: radial-gradient(circle at 50% 50%, rgba(192,132,252,0.45), rgba(232,121,249,0.25) 40%, transparent 70%);
    filter: blur(30px);
    animation: mb5 22s ease-in-out infinite;
}
@keyframes mb1 {
    0%   { transform: translate(0,0) scale(1) rotate(0deg); border-radius: 40% 60% 55% 45%/55% 40% 60% 45%; }
    25%  { transform: translate(8vw,-5vh) scale(1.15) rotate(90deg); border-radius: 55% 45% 40% 60%/45% 60% 40% 55%; }
    50%  { transform: translate(-3vw,8vh) scale(0.9) rotate(180deg); border-radius: 45% 55% 60% 40%/60% 45% 55% 40%; }
    75%  { transform: translate(5vw,3vh) scale(1.1) rotate(270deg); border-radius: 60% 40% 45% 55%/40% 55% 45% 60%; }
    100% { transform: translate(0,0) scale(1) rotate(360deg); border-radius: 40% 60% 55% 45%/55% 40% 60% 45%; }
}
@keyframes mb2 {
    0%   { transform: translate(0,0) scale(1) rotate(0deg); border-radius: 50% 50% 40% 60%/60% 40% 55% 45%; }
    33%  { transform: translate(-10vw,6vh) scale(1.2) rotate(120deg); border-radius: 40% 60% 50% 50%/45% 55% 40% 60%; }
    66%  { transform: translate(6vw,-8vh) scale(0.85) rotate(240deg); border-radius: 60% 40% 55% 45%/50% 50% 60% 40%; }
    100% { transform: translate(0,0) scale(1) rotate(360deg); border-radius: 50% 50% 40% 60%/60% 40% 55% 45%; }
}
@keyframes mb3 {
    0%   { transform: translate(0,0) scale(1); border-radius: 55% 45% 50% 50%/45% 55% 50% 50%; }
    50%  { transform: translate(-7vw,-6vh) scale(1.15) rotate(180deg); border-radius: 45% 55% 50% 50%/55% 45% 50% 50%; }
    100% { transform: translate(0,0) scale(1) rotate(360deg); border-radius: 55% 45% 50% 50%/45% 55% 50% 50%; }
}
@keyframes mb4 {
    0%   { transform: translate(0,0) scale(1); }
    33%  { transform: translate(6vw,8vh) scale(0.9); }
    66%  { transform: translate(-4vw,-3vh) scale(1.1); }
    100% { transform: translate(0,0) scale(1); }
}
@keyframes mb5 {
    0%   { transform: translate(0,0) scale(1) rotate(0deg); }
    50%  { transform: translate(9vw,5vh) scale(1.2) rotate(180deg); }
    100% { transform: translate(0,0) scale(1) rotate(360deg); }
}

/* ═══ CURSOR ELEMENTS ═══ */
.sc-cursor {
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 99999;
    display: none;
    will-change: transform;
}
.sc-dot {
    width: 10px; height: 10px;
    border-radius: 50%;
    background: radial-gradient(circle, #c084fc 0%, #8b5cf6 60%, transparent 100%);
    box-shadow: 0 0 20px 6px rgba(139,92,246,0.6), 0 0 60px 15px rgba(139,92,246,0.2);
    mix-blend-mode: screen;
}
.sc-ring {
    width: 26px; height: 26px;
    border-radius: 50%;
    border: 2.5px solid rgba(167,139,250,0.6);
    background: transparent;
}
.sc-ring-inner {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 55%;
    height: 55%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 1px solid rgba(167,139,250,0.3);
}
.sc-ring-dot {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 3px;
    height: 3px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: rgba(167,139,250,0.7);
}
.sc-crossH { width: 28px; height: 1px; background: rgba(139,92,246,0.6); }
.sc-crossV { width: 1px; height: 28px; background: rgba(139,92,246,0.6); }
.sc-crossC {
    width: 3px; height: 3px;
    border-radius: 50%;
    background: #a78bfa;
    box-shadow: 0 0 8px #8b5cf6;
}
.sc-diamond {
    width: 10px; height: 10px;
    background: #8b5cf6;
    box-shadow: 0 0 14px rgba(139,92,246,0.7);
}
.sc-trail {
    width: 4px; height: 4px;
    border-radius: 50%;
    background: #c084fc;
    opacity: 0;
}

/* Desktop: hide system cursor */
@media (pointer: fine) {
    body.sc-active { cursor: none !important; }
    body.sc-active * { cursor: none !important; }
}
/* Touch: hide custom cursors */
@media (pointer: coarse) {
    .sc-cursor, .sc-dot, .sc-ring, .sc-crossH, .sc-crossV, .sc-crossC, .sc-diamond, .sc-trail {
        display: none !important;
    }
}

/* Optimized topbar transparency */
.topbar {
    background: rgba(6, 6, 14, 0.8) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}

/* Disable backdrop-filter on mobile for performance */
@media (max-width: 768px) {
    .topbar,
    .stat,
    .filters,
    .table-wrap,
    .detail,
    .m-card,
    .m-filter-drawer,
    .side-panel,
    .opp-card {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* Reduce backdrop-filter to key elements only */
.col-menu,
.export-menu,
.trade-overlay,
.total-row {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
