.neon-border {
    position: relative;
    border: 1px solid rgba(99, 102, 241, 0.15);
    border-radius: 12px;
    background: rgba(255,255,255,0.9);
    backdrop-filter: blur(12px);
    transition: border-color 0.3s, box-shadow 0.3s;
}

.neon-border:hover {
    border-color: rgba(99,102,241,0.35);
    box-shadow: 0 10px 30px rgba(99,102,241,0.08);
}

.glow-text {
    text-shadow: 0 4px 18px rgba(99,102,241,0.15);
}

@keyframes shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.progress-bar {
    height: 3px;
    background: linear-gradient(90deg,#6366f1,#8b5cf6,#a78bfa);
    background-size:200% 100%;
    animation: shimmer 2s linear infinite;
    border-radius:2px;
    transition:width .4s;
}

@keyframes blink {
    0%,100% {opacity:1;}
    50% {opacity:0;}
}

.cursor-blink::after {
    content:'▊';
    color:#6366f1;
    animation:blink 1s step-end infinite;
}

* { box-sizing:border-box; margin:0; padding:0; }

body {
    
        background: rgba(99, 102, 241, 0.08);
    
}

::-webkit-scrollbar { width:6px; }
::-webkit-scrollbar-track { background:#f1f5f9; }
::-webkit-scrollbar-thumb { background:#cbd5e1; border-radius:3px; }

.tool-card {
    background: rgb(255 255 255 / 54%);
    border:1px solid #e5e7eb;
    border-radius:14px;
    padding:24px;
    transition:all .3s;
    cursor:pointer;
    position:relative;
    overflow:hidden;
    box-shadow:0 2px 8px rgba(15,23,42,.04);
}

.tool-card:hover {
    border-color:rgba(99,102,241,.4);
    transform:translateY(-4px);
    box-shadow:0 12px 35px rgba(15,23,42,.1);
}

.tool-card .icon-box {
    width:52px;height:52px;
    border-radius:14px;
    display:flex;align-items:center;justify-content:center;
    font-size:26px;
    background:#eef2ff;
    border:1px solid #e0e7ff;
}

.tool-card .cost-badge {
    position:absolute;top:16px;right:16px;
    background:#ecfdf5;
    border:1px solid #d1fae5;
    color:#059669;
    padding:2px 10px;
    border-radius:20px;
    font-size:11px;
    font-weight:500;
}

.category-tag {
    display:inline-block;
    padding:4px 14px;
    border-radius:20px;
    font-size:12px;
    font-weight:500;
    cursor:pointer;
    transition:all .2s;
    border:1px solid #e0e7ff;
    color:#64748b;
    background:#fff;
}

.category-tag:hover,.category-tag.active {
    background:#eef2ff;
    border-color:#c7d2fe;
    color:#4f46e5;
}

.glow-text { text-shadow:0 0 20px rgba(99,102,241,.2); }

.btn-primary {
    background:linear-gradient(135deg,#6366f1,#8b5cf6);
    border:none;color:#fff;
    padding:10px 24px;
    border-radius:10px;
    font-weight:600;
    font-size:14px;
    cursor:pointer;
    transition:all .25s;
}

.btn-primary:hover {
    transform:translateY(-2px);
    box-shadow:0 8px 30px rgba(99,102,241,.25);
}



.toast.show {transform:translateY(0);opacity:1;}
.toast-success {background:linear-gradient(135deg,#065f46,#047857);color:#a7f3d0;border:1px solid rgba(52,211,153,.3);}
.toast-error {background:linear-gradient(135deg,#7f1d1d,#991b1b);color:#fca5a5;border:1px solid rgba(239,68,68,.3);}
.toast-info {background:linear-gradient(135deg,#1e1b4b,#312e81);color:#c7d2fe;border:1px solid rgba(99,102,241,.3);}