body{background:#000;color:#fff;font-family:Inter,Arial,sans-serif}input,textarea,select{color:#fff!important;background-color:#09090b}input::placeholder,textarea::placeholder{color:#a1a1aa!important}.status-dot{animation:pulse-red 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse-red{0%,100%{opacity:1}50%{opacity:.5}}.gold-gradient{background:linear-gradient(180deg,#d4af37 0%,#a67c00 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.card-bg{background:linear-gradient(180deg,#1a1a1a 0%,#0d0d0d 100%);border:1px solid #333}.progress-red{background:linear-gradient(90deg,#8b0000 0%,#f00 100%)}.progress-yellow{background:linear-gradient(90deg,#b8860b 0%,#ffd700 100%)}.btn-red{background:#7f1d1d;color:#fff;border:1px solid #991b1b}.input-dark{background:#09090b!important;border:1px solid #3f3f46;color:#fff!important;border-radius:4px}.link-tile{display:flex;flex-direction:column;align-items:center}.admin-table th,.admin-table td{padding:.55rem;border-bottom:1px solid #27272a;font-size:.75rem}.admin-table th{text-align:left;color:#ef4444}

/* =========================================
   UPGRADE NEON BORDERS
   ========================================= */

/* +5 to +7: Green neon pulsing border */
.border-upgrade-green {
    position: relative !important;
    border: 2px solid #22c55e !important;
    box-shadow:
        0 0 6px rgba(34,197,94,0.9),
        0 0 18px rgba(34,197,94,0.55),
        inset 0 0 8px rgba(34,197,94,0.3) !important;
    animation: greenPulse 2.4s ease-in-out infinite !important;
}

@keyframes greenPulse {
    0%,100% {
        box-shadow:
            0 0 6px rgba(34,197,94,0.9),
            0 0 18px rgba(34,197,94,0.55),
            inset 0 0 8px rgba(34,197,94,0.3);
    }
    50% {
        box-shadow:
            0 0 10px rgba(34,197,94,1),
            0 0 32px rgba(34,197,94,0.8),
            inset 0 0 14px rgba(34,197,94,0.5);
    }
}

/* ---- Custom property for smooth conic-gradient rotation ---- */
@property --ba {
    syntax: '<angle>';
    initial-value: 0deg;
    inherits: false;
}

/* +8 and above: gold spinning neon beam border */
.border-upgrade-gold-animated {
    position: relative !important;
    border: 2px solid #facc15 !important;
    box-shadow:
        0 0 12px rgba(250,204,21,0.75),
        0 0 28px rgba(250,204,21,0.42),
        inset 0 0 12px rgba(250,204,21,0.25) !important;
}

.border-upgrade-gold-animated::before {
    content: '' !important;
    position: absolute !important;
    inset: -3px !important;
    border-radius: inherit !important;
    padding: 3px !important;
    background: conic-gradient(
        from var(--ba),
        transparent   0deg,
        transparent  55deg,
        #aa6600      70deg,
        #facc15      85deg,
        #fff7ad      96deg,
        #facc15     108deg,
        #aa6600     126deg,
        transparent 145deg,
        transparent 360deg
    ) !important;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0) !important;
    -webkit-mask-composite: xor !important;
    mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0) !important;
    mask-composite: exclude !important;
    animation: spinBeam 2s linear infinite !important;
    pointer-events: none !important;
    z-index: 999 !important;
}

@keyframes spinBeam {
    to { --ba: 360deg; }
}
